Why json string going into http post request rather than javascript object in angularjs

Question

I am sending some data using post request in angularjs like

$http({
  method: 'POST', 
  url: url, 
  data: inputParams,
  headers: headers
})
.then(function succes(response) {
    successCallBack(response.data);
}

Data image: Result in browser:

Similar I have in jQuery And its result is

In case of angularJs look like data is going as JSON map, and on Backend server I am not able to read it from request body.

It may be duplicate of how to get json string from angular $http post request

But still I am not able to fix my issue info avilable there ,can some tell me what I am missing.

This is merely a difference in how the browser chooses to visualise the data. Even with jQuery you're not sending an object which you can expand with a disclosure triangle; you're sending the same JSON, only the browser's debugger tools parse the JSON and allow you to inspect it conveniently. It's of course a valid question to ask why *that* is. Perhaps jQuery is sending a `Content-Type` header identifying the data as JSON, and Angular isn't? — deceze, Aug 17 '16 at 14:22
Start by clicking the `view source` button to see the *actual* data being sent… — deceze, Aug 17 '16 at 14:25
@deceze view soucre: {"appID":"passThrough","serviceID":"ONON","serviceType":"plainxmlserviceConnector","APIVersion":"1.0"} And one more thing i am using same browser and same settings to view data , it's not about view data , it's about sending data to backend — Yugandhar, Aug 17 '16 at 14:27

score 1 · Answer 1 · edited May 23 '17 at 12:18

jQuery is not sending the request as a JavaScript object, rather it is sending it as a form (like querystring) encoded string. Your developer tools are just decoding it and displaying it like an object.

It actually looks like:

appId=passThrough&serviceID=OFFOFF&APIVersion=1.0...

This is the standard format for traditional HTML forms.

As you can imagine this would not work well for nested objects.

var requestData = {
    planet: 'Earth',
    moons: [
        {
            name: 'luna'
        }
    ]
}

Form querystring encoding an object like this becomes problematic. This is why modern Http Client implimentations use JSON by default.

If you really want to use form querystring encoding you can.

score -1 · Answer 2 · answered Aug 17 '16 at 14:23

use this

$http({
      method: 'POST', 
      url: url, 
      data: {
           data : inputParams
      },
      headers: headers
    })
    .then(function succes(response) {
        successCallBack(response.data);
    }

and in server side use req.body.data to do operations with your inputParams

Why json string going into http post request rather than javascript object in angularjs

2 Answers2