Response for reflight has invalid HTTP status code 500

Question

I am trying to make a simple ajax call to the Yelp Fusion API. I used the client_id and client_secret provided by Yelp to make a 'POST' call in Postman and receive an access token according to Yelp API documentation. This access token can be used to authenticate api calls. After getting the access token, I used Postman to make the 'GET' call to the /business/search endpoint and get relevant business information. The following image displays the appropriate headers and parameters needed to make the call:

Postman Headers, Parameters, and Response

After hitting 'SEND' in Postman, the JSON response code is displayed in Postman (bottom of previous image) which is the result I am looking for. Postman also has a feature to generate the code needed to make the call, and I inserted their generated ajax request into my program:

var settings = {
    "async": true,
    "crossDomain": true,
    "url": "https://api.yelp.com/v3/businesses/search?term=delis&latitude=37.786882&longitude=-122.399972",
    "method": "GET",
    "headers": {
        "authorization": "Bearer 0P*****************x",
        "cache-control": "no-cache",
        "postman-token": "30*************7"
    },
    "data": {
        "grant_type": "client_credientials",
        "client_secret": "tp***************m",
        "client_id": "RO**********w"
    }
}

$.ajax(settings).done(function (response) {
   console.log(response);
});

For now, when a submit button is clicked on my page, I want to display the response in the console. However, while Postman seems to be able to make the ajax call correctly and receives the correct response, Google chrome browser displays the following error: Response for preflight has invalid HTTP status code 500. To my understanding, the first error occurs in the preflight request when an HTTP request is made by the OPTIONS method to the resource to determine if the actual request is safe to send. However, I am stumped as to how Postman can make the call without any problems but Google Chrome can't. Any help is appreciated.

Karim Karim · Accepted Answer · 2017-06-30T07:57:43

this is a tipical CORS scenario

a preflight request is an HTTP request made by the browser for cross domains call to check if your domain has the right "privileges" to determine whether the actual request is safe to send

the preflight request double checks that some headers are set by the server: e.g.

"Access-Control-Allow-Origin": "*" 
"Access-Control-Allow-Methods": "GET, POST"
"Access-Control-Allow-Headers: "X-Custom-Header"

that basically specify the list of domains which are granted the access , the allow methods (get, put, post etc.) and the allow headers. You don't see this error in Postman because it doesn't make any preflight request to the server, it just bypasses any CORS related problem

Since you don't have control over the Yelp Fusion API backend, you can make a simple backend to make a request (Cors does not seem to be supported)

Response for reflight has invalid HTTP status code 500

1 Answers