Twilio Device.connect() results in "Bad JSON in msg" - javascript

Our React app sends a GET request to our API requesting a Twilio token. Out API then requests the token from Twilio. The token is then sent in the response back to the React app. The React app then executes Twilio.Device.setup(token, {debug: true}), and this appears to happen successfully.
The Twilio.Device.instance object appears to have the token retrieved from the server, and the token matches what the server responded with AND what the server prints to the logs.
We then call Twilio.Device.connect() which results in an error message to the console :
{"payload":{"callsid":"<SOME_ID>","error":{"code":31100,"message":"Bad JSON in msg"}},"type":"hangup","version":""}
Opening the Dev console I see this is all happening in a web socket connection, and the payload sent RIGHT before this message appears (and it is reliably sent immediately before the response, so I believe it is what triggers the error) is a payload of this form:
{
"type":"invite",
"version":"1.4",
"payload":{
"sdp":"v=0\r\no=- 436124720934282410 2 IN ... A BUNCH OF DATA WITH CARRIAGE RETURNS ... f-d0582b8dc5e6\r\n",
"callsid":"TJSceeec256-b343-4d13-bf26-febd73fcd484",
"twilio":{}
}}
So the payload.sdp attribute is definitely NOT Json, but it doesn't really look like it's even trying to be, so it's not some kinda typo.
The entire body of the request is properly formed JSON though, renders and pretty print.
So what do I need to do to start an outgoing call with the Twilio 1.4 JavaScript SDK? About a month ago the dev working on this was making calls successfully, so it's definitely possible, but I'm not sure what changed.

I'm getting the same error. Changing
Twilio.Device.connect();
to
Twilio.Device.connect({x:null});
helped me to get outgoing calls working.

Related

Laravel Vue - Console log Axios POST response is different from network response

In my backend in Laravel vue app, I am sending back the same response I sent to the server.
The two console logs aren't the same, data slightly differs.
DATA GOING OUT shows the correct data being sent out
DATA COMING IN shows the wrong data coming back
However, the network response in chrome from the POST request in (1) does show the correct response though.
Why is this?
Laravel/PHP isn't formatting response correctly and Vue on the frontend needs JSON.parse(JSON.stringify(response.data) (to be placed in the create lifecycle method)

Post request problem with nextjs and axios

I'm coming from the "Java world" and creating a small web program for the first time with: NextJS, React, Postgres and axios.
When I create the Login/Signin pages, I succesed to communicate with the server and send with post requests.
My problem is when I tried to send the post messages outside the render() of react, Its send the route without the url host, and the server doesnt get the post request. (When i send the post request with Postman its working).
I know it's a server/client sending requests problem , but I've been sitting on it for a few days and can not solve the problem.
So here is a limited repo of my web program: https://github.com/idonava/react-next-program-example
SignIn - working post request flow:
pages/signin.js handleSubmit -> signIn (line 103).
libs/auth.js signIn-> authenticate (line 16).
services/authApi.js authenticate-> post(line 6).
services/requets.js post send request via axios(line 8).
After that - the server get the post request, return answer to the client and the user login succesfully
Getting the user id- NOT working post request flow:
pages/flickr.js getInitialProps -> getUser (line 15).
libs/user.js getUser-> getCurrentUser (line 4).
services/authApi.js getCurrentUser-> post(line 26).
services/requets.js post send request via axios(line 8).
the server doesnt get to post request, And it look like the url is "/routing/getuser" instead of "localhost:3100/routing/getuser".
notes:
The program run locally on localhost:3100.
The server listening for the request on server.js -> routing/index.js -> db/models/user.
I'd be happy to get help with that.
Thanks a lot !!

Angular HTTP 'get' request 304 error

I was building angular's official 'heroes tutorial app' and instead of using their in-memory-data code, i tried using a json.placeholders (users) api so the app would be more real-world example.
Problem is when i change the official codes example url(in-memory-url) with the json.placeholder's api it just doesnt list the names and i checked the chrome dev console-network tab it shows status code 304,
By the way I am only trying to make a get request part of the tutorial, here is the error:
Request URL:https://jsonplaceholder.typicode.com/users
Request Method:GET
Status Code:304
Remote Address:104.31.87.157:443
Referrer Policy:no-referrer-when-downgrade
Edit:
So i managed to list users from json.placeholder on the app with using observables from rxjs, then i changed it back to promise method official website shows that way and still not listing. Maybe it's something about the angular's promises i dont know.
However browsers network still showing 304 status. I am worrying that this could be a problem and it shouldn't be this way. So any help would be appreciated thanks.
HTTP 304 header code means "Not modified", it's not an error. According to the RFC 2616 of HTTP 1.1, the server only sends back headers, not the response which tells the browser to use the response that it had already in cache.
On the other hand, angular will always put 200 in status (even if it is a 304) and you shouldn't have to bother about keeping up to date your data, since you retrieve the fresher value each time (without bothering if it's from a cache in the server or fresh data from the server)
Id Add a random query string behind your url, that takes timestamp as the value. This way, each request will be considered a fresh one
Moreover id refer you to this topic

Trying to GET some resource returns net::ERR_EMPTY_RESPONSE for Angular.js

So I re-installed my database, the problem is that now, my app doesn't seem to work.
Every time I try to GET a resource in my Angular.js site, the request stalls until I get back this error:
net::ERR_EMPTY_RESPONSE
The preflight "OPTIONS" requests works fine, but the actual GET request just hangs up.
If I try the same GET request with curl, then I instantly get a correct response. The same for the browser, if I type the request in the address bar, I get a correct response.
What do you guys think may be happening here?

Server giving 403 error on ajax submit

I am working on a new project like jsfiddle.
I am facing a problem while development of it. When I try to send a ajax request with JS alert() function in text box the server is giving a 403 error. Can anyone help me with this?
Example:
Go to this URL: http://www.labs.codeteam.in/lab
Enter alert(1) in javascript textbox and Run the project, the server will give a 403 error in console.
A web server may return a 403 Forbidden HTTP status code in response to a request from a client for a web page or resource to indicate that the server can be reached and understood the request, but refuses to take any further action.
Status code 403 responses are the result of the web server being configured to deny access, for some reason, to the requested resource by the client.
The server might be configure to prevent script injection. Sending "alert()" with your post to the server might look like some type of injection attempt to the server.
try urlEncode your string before sending it back to your controller and then u can decode it back in php when u get it
It's actually encodeURI http://www.w3schools.com/jsref/jsref_encodeURI.asp
I have found a different way to do this.
While submitting the data in ajax request I will reverse the string so that the server cannot recognize the keywords and in php I'll reverse it back and use it.
Did you find the solution to your problem?
I happen to have the same problem, I thought my server was slowing down for some reason, but after making a ping -i .1 domain.com, from 2000 packets sent, only .1%~ was packet loss. My queries are about 2ms.
I jumped in the conclusion that it might be that the requests are too many for the server to handle at the same time (I'm doing periodical ajax request [about 1 every 4 seconds], in 2 js scripts).
The error is in your data - try sending something useless like "asdfasdfasdfas" - it will be okay, at least I pasted that in the text box, hit run, and on the url http://www.labs.codeteam.in/lab/runProject I got 200 status code. When I wrote alert(1), then indeed 403 status code was thrown - your server is treating javascript data as an attempt to inject code.

Categories