0

I have read tons of responses on this error but none of the causes seem to be my problem.

The endpoint works fine if I hit it directly. When I tested this on my local (localhost) machine I have the same issue.

Here is frontend code.

async function getAirportInfo(){
    let icao = document.getElementById('icao').value
    var data = await fetch(airportfeed + icao, {
        method: "GET", 
        mode: "no-cors", 
        headers: {
            'Content-Type': 'application/json'
        }
    });
    let response = await data.json()
    console.log(response)
    document.getElementById("airportname").value = response.name
}

Here is the endpoint code:

app.get("/airports/:icao", async function(req, res) {
  let reqicao = req.params.icao
  await getAirportRecord(reqicao)
  res.set({
    "Content-Type": "application/json",
    "Access-Control-Allow-Origin": "*"
  });
  res.send(airportresults);
});

Some other interesting information that may help you help me is that when I check the Network log on the browser the request to the endpoint appears to have completed successfully:

Browser Network Header

But on the Response tab I see this:

Browser Network Response

I am not sure what the issue is.

Please help.

Barmar
  • 741,623
  • 53
  • 500
  • 612
Othniel Alexandre
  • 3
  • 3
  • You never set `airportresults` – Barmar Aug 23 '21 at 20:50
  • You probably want `const airportresults = await getAirportRecord(reqicao)` – Barmar Aug 23 '21 at 20:51
  • You **need** CORS to read a response cross-origin. You said `no-cors` so you can't read the response. Since you haven't got a response, when you try to parse it as JSON it gets to the end before it has parsed any valid JSON. Then it errors. – Quentin Aug 23 '21 at 20:55
  • I fixed the airportresults. But still had the error. When I commented out the no-cors line I get the following errors: Access to fetch at 'http://localhost:8000/airports/TFFR' from origin 'http://127.0.0.1:5500' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. If an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled. – Othniel Alexandre Aug 23 '21 at 21:04
  • The solution is to have cors installed via npm. I am flabbergasted that in none of the articles I read did anyone even hint at that. Is that perhaps an assumption that it is installed!!?? – Othniel Alexandre Aug 23 '21 at 23:15
  • I lied it worked locally but when I deployed to PROD it still gave the same error. – Othniel Alexandre Aug 24 '21 at 17:50

0 Answers0