API GET request returns an empty response but postman does not

Question

I am trying to make an API call to a remote server, Initially, I got this error:

No 'Access-Control-Allow-Origin' header is present on the requested resource.

I temporarily solve this error by attaching the https://cors-anywhere.herokuapp.com link before the link, or sometimes using the Moesif Cors-Any-where Chrome extension. The fetch now returns 200 ok status but the response is empty.

body: ReadableStream
locked: true
__proto__: ReadableStream
bodyUsed: true
headers: Headers {}
ok: true
redirected: false
status: 200
statusText: "OK"
type: "cors"

response: {}
data: undefined

However, if I run the same query on postman, it returns the expected response JSON object. How do I fix this?

 const searchFlightData = (to, from, depDate, adults) => {
        fetch(`http://api.travelpayouts.com/v1/prices/direct?origin=${from}&destination=${to}&depart_date=2017-11&return_date=2017-12&token=${tp_token}`)
            .then(response => {
                if (response.ok) {
                    console.log(response)
                    return response
                }
                else
                    console.log(`Looks like something went wrong. Status: ${response.status}`)
            })
            .then(response => {
                response.json()
                console.log("response: " + JSON.stringify(response))
            })
            .then(data => {
                console.log("data: " + data)
            })
            .catch(error => {
                console.log(error)
            })
}

TheWuif · Accepted Answer · 2020-07-27 17:28:20Z

1

response.json() returns a promise, you have to wait for resolving this. you also have to return something if you want the next then in the chain to receive something.

something like this should work:

 const searchFlightData = (to, from, depDate, adults) => {
        fetch(`http://api.travelpayouts.com/v1/prices/direct?origin=${from}&destination=${to}&depart_date=2017-11&return_date=2017-12&token=${tp_token}`)
            .then((response) => {
                if (response.ok) {
                    return response
                } else {
                    throw `Looks like something went wrong. Status: ${response.status}`;
                }
            })
            .then(response => response.json())
            .then(data => {
                console.log("data: " + data)
            })
            .catch(error => {
                console.log(error)
            })
}

or with your console.log:

return response.json().then((data) => console.log(data));

answered Jul 27, 2020 at 17:28

TheWuif

1,0469 silver badges11 bronze badges

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

6 Comments

excel Over a year ago

I believe that was what I did. Could the problem be the Access-Control-Allow-Origin issue?

TheWuif Over a year ago

do you see the response in the developer tools?

excel Over a year ago

No, it's an empty array. But the exact same request on postman returns a full response

TheWuif Over a year ago

if you get an array as response i think the problem is not the Access-Control-Allow-Origin. the problem may be cors-anywhere.herokuapp.com or your backend. do you use cookies to check for login? cors-anywhere.herokuapp.com is stripping all cookies. so you will not be logged in if you send your request via this tool.

excel Over a year ago

TheWuif I appreciate your help. I'm getting an empty object as a response, and instead of cors-anywhere.herokuapp.com I'm using a google chrome extension Moesif Origin and CORS changer, still the same result, even though postman returns result

|

Rumesh Madushanka · Accepted Answer · 2021-06-02 08:51:31Z

1

Add A Header For accept all as follow in the front-end request

answered Jun 2, 2021 at 8:51

Rumesh Madushanka

3793 silver badges5 bronze badges

Comments

TheWuif · Accepted Answer · 2020-07-26 18:15:39Z

0

if you want to request data from a server it has to be on the same domain, or the 'Access-Control-Allow-Origin' header has to be set. I wont rely on a service like https://cors-anywhere.herokuapp.com

For development you can use a proxy server to bypass this limitation. (many frameworks already have a solution for this, i don't know which one you use)

answered Jul 26, 2020 at 18:15

TheWuif

1,0469 silver badges11 bronze badges

2 Comments

excel Over a year ago

The problem is I'm not using a server yet. My project is only at the front end for now, that's why I'm using proxy. The chrome extension also works. Could that be the reason for my empty response?

TheWuif Over a year ago

posted a new answer which should solve your problem

pop · Accepted Answer · 2023-02-18 12:31:46Z

0

I know this is a very old question, but I've got exact same problem last night. The issue was the SSL connection, which is enforced by Chrome and is not enforced by Postman. So just make sure your API can handle https protocol.

answered Feb 18, 2023 at 12:31

pop

3,7823 gold badges30 silver badges50 bronze badges

Collectives™ on Stack Overflow

API GET request returns an empty response but postman does not

4 Answers 4

6 Comments

Comments

2 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

6 Comments

Comments

2 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related