Javascript HTTP POST with JSON data

Question

Can I send a request as below? With parameters being assigned with a JSON style object. I only get error. But when I use a REST client and choose RAW data, it's OK. I guess I must have written incorrect code. How to send raw JSON data in JavaScript? Could anyone help me?

xmlhttp = new XMLHttpRequest();
var url = "https://someURL";
xmlhttp.open("POST", url, true);
xmlhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
xmlhttp.onreadystatechange = function () { //Call a function when the state changes.
    if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
        alert(xmlhttp.responseText);
    }
}
var parameters = {
    "username": "myname",
    "password": "mypass"
};
// Neither was accepted when I set with parameters="username=myname"+"&password=mypass" as the server may not accept that
xmlhttp.send(parameters);

You need to convert it to a string JSON.stringify, encode it, and post it. — epascarello
– epascarello, Commented Sep 23, 2013 at 15:20
FYI, that's not a "JSON style" object, nor is it JSON data. It's an object literal that creates an object. — Felix Kling
– Felix Kling, Commented Sep 23, 2013 at 15:20
inspect your traffic using the browser console to see what's getting sent. — Janus Troelsen
– Janus Troelsen, Commented Sep 23, 2013 at 15:21

Quentin · Accepted Answer · 2013-09-23 15:19:56Z

22

No. The send() method can take a number of different argument types, but a plain object is not one of them (so it will probably end up having toString() being called on it and being turned into "[Object object]").

If you want to send JSON then you must:

Say you are sending JSON: xmlhttp.setRequestHeader("Content-type", "application/json");
Convert your JavaScript object to a string of JSON text: var parameters = JSON.stringify({"username":"myname","password":"mypass"});
Be prepared to accept JSON instead of application/x-www-form-urlencoded data on the server side.

Also note that, since you are using an absolute URI, you may run into cross domain issues.

answered Sep 23, 2013 at 15:19

Quentin

949k136 gold badges1.3k silver badges1.4k bronze badges

Sign up to request clarification or add additional context in comments.

Comments

mhdnp1234 · Accepted Answer · 2016-06-20 05:39:59Z

3

xmlhttp = new XMLHttpRequest();
xmlhttp.open("POST", AjaxURL, true);
xmlhttp.onreadystatechange = function () { //Call a function when the state changes.
if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
cb(xmlhttp.responseText);               
}
};
xmlhttp.send(JSON.stringify(Idata));

answered Jun 20, 2016 at 5:39

mhdnp1234

1787 bronze badges

Collectives™ on Stack Overflow

Javascript HTTP POST with JSON data

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related