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

[procarrera]

Hi ! is there anyone to help me? Everything was working ok till I start getting this error from server:

Access to XMLHttpRequest at 'https://newsapi.org/v2/everything?q=javascript+&language=en&sortBy=relevancy&pageSize=100&apiKey=MY-API' from origin 'http://localhost:3000' 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.

I am calling the API directly from my frontend (react js) and print some news on my page. vey simple

ps: i have removed my api id from the above code....

[zubeirom]

I am receiving the same error. I tried using fetch with mode no-cors but nothing worked yet

[altezza04]

Me too, I am using Vue.js. + Axios

[zubeirom]

The only way to use the newsapi is from server-side like node. I had to build a small node app and make the client fetch it from there unfortunately...

[procarrera]

Hello @zubeirtech ! Have you heard any thing regarding to this from them?

I had been loading this API directly in my ReactJS without any problems. I suppose this issue started few days ago.

[zubeirom]

Yes definitely @procarrera , the issue came up recently.

I used the API just like you on my emberJS app with no problem. But now, with or without the wrapper it won't work.

What's funny is, locally it works but the moment I deploy my app it doesn't work and this cors error comes up. Doesn't matter if I use the wrapper, Ajax or fetch.

I also emailed them, with a link to this gh issue but no answer yet😕

[gabrielbhl-zz]

Same here. It was working fine till one week ago, then... Tried everything but nothing seems to work. Probably a problem with their server, from our reports

[procarrera]

perfect @zubeirtech ! so, it wouldn't be a big issue to create a server and call the API, but would be fair to hear from them :+1:

[zubeirom]

Right @procarrera, it would be an additional step to get the data but atleast you get the data.

I hope they fix it soon though

[procarrera]

@News-API-gh Hello guys, have you had time to check this issue?

Thank you!!

[altezza04]

It seem the problem with the TLS version, i am getting a code 426 error when request from now.sh (which only support TLS 1.2+), but when request from a local server, it's all working fine.

[procarrera]

It seem the problem with the TLS version, i am getting a code 426 error when request from now.sh (which only support TLS 1.2+), but when request from a local server, it's all working fine.

It was not working even in my localhost...

[altezza04]

for` quick fix, can write small node.js API server

example

const NewsAPI = require("newsapi");
const newsapi = new NewsAPI("YOUR_API_KEY");
const http = require("http");

// Create an instance of the http server to handle HTTP requests
let app = http.createServer((req, res) => {
  newsapi.v2
    .topHeadlines({
      q: "bitcoin",
      category: "business",
      language: "en",
      country: "us"
    })
    .then(response => {
          console.log(response)
          res.writeHead(200, { "Content-Type": "text/json" });
          res.json(response);
    });
});

// Start the server on port 3000
app.listen(3000, "127.0.0.1");

[procarrera]

yes, i ended up with a similar solution... not the best thing, but at least still works