user3430761
user3430761

Reputation: 298

Convert curl GET to javascript fetch

I am able to successfully retrieve an object from parse using command below:

curl -X GET \
-H "X-Parse-Application-Id:1231231231" \
-H "X-Parse-REST-API-Key: 131231231" \
-G \
--data-urlencode 'where={"uid":"12312312"}' \
https://api.parse.com/1/classes/birthday`

But I'm struggling converting it to javascript, using the code below I will get response with a status of 200. I assume error is converting data-urlencode to data:

var getObject = function {
    var url = "https://api.parse.com";
    url += '/1/classes/birthday';

    fetch(url, {
        method: 'GET',
        headers: {
            'Accept': 'application/json',
            'X-Parse-Application-Id': '12122',
            'X-Parse-REST-API-Key': '12121',
            'Content-Type': 'application/json',
        },
        data: '{"where":{"uid":"12312312"}}'

    })
    .then(function(request, results) {
        console.log(request)
        console.log(results)
    })
}

Thanks!

Upvotes: 18

Views: 36277

Answers (2)

kigiri
kigiri

Reputation: 3368

Since I often wanted to do this, I made https://kigiri.github.io/fetch/ , you can copy / paste a curl command it will give you the fetch code.

You can checkout the source if you want to use it differently.

edit: The feature was added to chrome devtools devtool-as-fetch-opts 👏👏 Thanks chrome dev team 🎉

Upvotes: 50

Charles Haro
Charles Haro

Reputation: 1886

Ok so basically you need another then. So it has something to do with promises. I figured it out after reading this awesome article http://blog.gospodarets.com/fetch_in_action/

What you need to do is this

var getObject = function {
  var url = "https://api.parse.com";
  url += '/1/classes/birthday';

  return fetch(url, {
      method: 'GET',
      headers: {
          'Accept': 'application/json',
          'X-Parse-Application-Id': '12122',
          'X-Parse-REST-API-Key': '12121',
          'Content-Type': 'application/json',
      },
      data: '{"where":{"uid":"12312312"}}'

  })
  .then(function(response) {
    return response.text();
  })
  .then(function(data){
    console.log(data); //this will just be text
    var data_obj = JSON.parse(data);
    return data_obj
  })

}

I don't really understand why you have to return response.text(). Again it has something to do promises

https://developer.mozilla.org/en-US/docs/Mozilla/JavaScript_code_modules/Promise.jsm/Promise

Because when I access response.text() from the first then. It returns a promise.

Hopefully some other kind gentleman can comment and explain why returning response.text() turns the promise into the data you need.

--EDIT--

I added some returns to show how you can have getObject return out the response data as an object. So

var d = getObject();

will return the response as a js object now.

Upvotes: 7

Related Questions