Axios - Sending Nested JSON Object

Question

I have a web page that is using the Axios Http Client. In my web page, I'm getting my location using the browser's geolocation feature. When my location is obtained, I want to send that location, along with other data. To do this, I've built data object like this:

navigator.geolocation.getCurrentPosition(
  function(position) { 
    var data = {
      id: 1,
      user:'me',
      location: position
    };
  })
;

I then try to send the data via Axios like this:

axios.put('/my-endpoint', data, options)
    .then(function(res) {
      console.log('success');
      console.log(res);
    })
;

I get a successful response back from this request. However, it's a false positive. When I look at the logs, it's weird. I can see that the location property is an empty object. So, I did a console.log in the browser and I can see that location is properly set. But when I send it via Fiddler, I notice that it's not there. It's just an empty object when it goes across the wire. How?

I suspect there is some setting or something else I have to do to send a nested JavaScript object over the network. But I don't see anything. What am I doing wrong? I've made a basic JSFiddle here with this code..

Erik Berkun-Drevnig · Accepted Answer · 2017-02-06 21:07:09Z

1

It looks like your variable data is out of scope when you are trying to send it. In the example you've given data is local variable of that closure which means it is destroyed when the callback completes. To get around this you need to declare data outside of that function where it will be visible to axios as well. You can still assign to it inside the callback, you have to actually but you should declare it above.

answered Feb 6, 2017 at 21:07

Erik Berkun-Drevnig

2,36325 silver badges40 bronze badges

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

3 Comments

Some User Over a year ago

the variable data is in scope. It looks out of scope because of how I phrased the question. But, in my actual code the axios call happens right after the var data line.

Erik Berkun-Drevnig Over a year ago

Is it only for the location property? Are user and id going through ok?

Some User Over a year ago

It's only the location property that is showing this behavior. user and id are going through ok.

Collectives™ on Stack Overflow

Axios - Sending Nested JSON Object

1 Answer 1

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related