2

How can I convert this paypal curl command to Axios?

curl -v https://api.sandbox.paypal.com/v1/oauth2/token \
-H "Accept: application/json" \
-H "Accept-Language: en_US" \
-u "client_id:secret" \
-d "grant_type=client_credentials"

I am using vueAxios in vue, hence the "this.".

this.axios.post('https://api.sandbox.paypal.com/v1/oauth2/token',
    {'Accept': "application/json", 'Accept-Language': "en_US", 
    'XXXXXX': 'XXXXX', // my paypal client ID and client secret 
    'grant_type':'client_credentials'}
    )
    .then( response => {
        console.log("Response is: ", response);
    })
    .catch( error => {
        console.log("Error is :", error);
});

I am getting this error:

 Error is : Error: Request failed with status code 401
    at createError (createError.js?16d0:16)
    at settle (settle.js?db52:18)
    at XMLHttpRequest.handleLoad (xhr.js?ec6c:77)

I've also tried this (which seems to be better but I'm still getting a 400 error):

 this.axios({ 
    method: 'POST', 
    url: 'https://api.sandbox.paypal.com/v1/oauth2/token', 
    headers: {
            'Accept': 'application/json',
            'Accept-Language': 'en_US',
            'Content-Type':'application/x-www-form-urlencoded'
    },
    auth: {
            username: '<XXXX My paypal client ID>',
            password: '<XXXX My paypal secret>'
    } ,
    data: {
        grant_type: 'client_credentials'
    },
})
.then(function(response) {console.log(response);})
.catch(function(response) {console.log(response);});

UPDATE – after some help form the comments I have tried the following code and the paypal has an issue CORS error ( i have installed a npm packages "cors" and the cors error persists (both locally and when deployed)).

This answers my question but, as stated here, it seems like Paypal doesn't allow requests directly from the browser.

this.axios({
    withCredentials: true,
    url: 'https://api.sandbox.paypal.com/v1/oauth2/token',
    method: 'post',
    headers: { 
        'Accept': 'application/json', 
        'Accept-Language': 'en_US',
        'Content-Type':'application/x-www-form-urlencoded',
        'Access-Control-Allow-Origin': '*',
        },
    data: { 'grant_type':'client_credentials' },
    auth: {
        username: 'XXXXXXXX',
        password: 'XXXXXXXX'
    }
})

Related documentation:

CORS: https://developer.mozilla.org/en-US/docs/Web/HTTP/CORS

VueAxios: https://www.npmjs.com/package/vue-axios

Paypal dev: https://developer.paypal.com/docs/api/overview/#make-your-first-call

2 Answers2

7

this is a quite old thread. I've struggled too on this with node.js. My solution hereafter. Hope this helps :

const res = await axios(
    {
        method: 'post',
        url: 'https://api.sandbox.paypal.com/v1/oauth2/token',
        data: 'grant_type=client_credentials', // => this is mandatory x-www-form-urlencoded. DO NOT USE json format for this
        headers: {
            'Accept': 'application/json',
            'Content-Type': 'application/x-www-form-urlencoded',// => needed to handle data parameter
            'Accept-Language': 'en_US',
        },
        auth: {
            username: clientId,
            password: clientSecret
        },

    });

console.log(JSON.stringify(res.data)); // => be sure to handle res.data, otherwise you will have a circular json error. The token you need is res.data.access_token.
zaz pureimpro
  • 71
  • 1
  • 1
2

According to the axios GitHub docs:

this.axios({
  url: 'https://api.sandbox.paypal.com/v1/oauth2/token',
  method: 'post',
  headers: { 
       'Accept': 'application/json', 
       'Accept-Language': 'en_US',
       'Content-Type':'application/x-www-form-urlencoded',
       'Access-Control-Allow-Origin': '*', 
  },
  data: { 'grant_type':'client_credentials' },
  auth: {
    username: client_id,
    password: secret
  }
})
Psidom
  • 209,562
  • 33
  • 339
  • 356
  • thanks but that doesn't work I get this 415 error: POST https://api.sandbox.paypal.com/v1/oauth2/token 415 (Unsupported Media Type)... so I have added the content type Header to try and fix it: _'Content-Type':'application/x-www-form-urlencoded'_ and it now returns a 400 error – Joao Alves Marrucho Nov 19 '18 at 16:59
  • 1
    Hmm. Could you try add `withCredentials: true` to `this.axios({})`? – Psidom Nov 19 '18 at 17:08
  • I did and that threw a CORS error: `Access to XMLHttpRequest at 'https://api.sandbox.paypal.com/v1/oauth2/token' from origin 'http://localhost:8080' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: The value of the 'Access-Control-Allow-Origin' header in the response must not be the wildcard '*' when the request's credentials mode is 'include'. The credentials mode of requests initiated by the XMLHttpRequest is controlled by the withCredentials attribute.` – Joao Alves Marrucho Nov 19 '18 at 17:59
  • 1
    ok. Not sure if your server allows cross origin request, but try add `{ 'Access-Control-Allow-Origin': 'Authorization' }` to the headers. – Psidom Nov 19 '18 at 18:07
  • 1
    Also I am not sure `PayPal` API allows you to directly make request from the browser. If not, then you need to set up a server to make request on behalf of your frontend; that is, set up a server to make these requests and then send result to your frontend; – Psidom Nov 19 '18 at 18:14