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

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
– deceze ♦, Commented Aug 17, 2016 at 14:22
Start by clicking the view source button to see the actual data being sent… — deceze
– deceze ♦, Commented Aug 17, 2016 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
– Yugandhar, Commented Aug 17, 2016 at 14:27

Community · Accepted Answer · 2017-05-23 12:18:31Z

1

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.

edited May 23, 2017 at 12:18

CommunityBot

11 silver badge

answered Aug 17, 2016 at 14:22

Martin

16.4k4 gold badges51 silver badges58 bronze badges

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

Comments

MAREESKANNNAN RAJENDRAN · Accepted Answer · 2016-08-17 14:23:11Z

-1

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

answered Aug 17, 2016 at 14:23

MAREESKANNNAN RAJENDRAN

5475 silver badges18 bronze badges

Collectives™ on Stack Overflow

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

2 Answers 2

Comments

Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Linked

Related