0

I am trying to fetch json data from an API. It works fine in postman, it only requires me to add 'x-auth-token' in the headers value for which is my api_key.

Now when I am running my code, I am getting this error.

Access to fetch at 'http://api.football-data.org/v4/competitions/PL/standings' from origin 'null' 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.

I've already tried setting 'Access-Control-Allow-Origin':'*'. But it is still giving the same error.

Below is the code I am using. Any help is appreciated. Thanks in advance.

    fetch('http://api.football-data.org/v4/competitions/PL/standings' 
    ,{
        headers : {
            'X-Auth-Token' : 'api_key',
            'Access-Control-Allow-Origin':'*',
        }
    })
    .then(response => {
        return response.json();
    }).then(text => {
        console.log(text);
    });
Fakipo
  • 182
  • 2
  • 17
  • 3
    If the API you're calling does not include CORS headers *in the response* then you will not be able to call it from client-side JS. You will need to make the call from the server-side instead, or find an alternative API which has CORS enabled. – Rory McCrossan Feb 13 '23 at 15:22
  • 1
    it doesn't make sense to add to the request add that to the response on the server – Tachibana Shin Feb 13 '23 at 15:22
  • @TachibanaShin I am not using server-side platform for this project. – Fakipo Feb 13 '23 at 15:24
  • @Fakipo — The hostname of the server is `api.football-data.org` and it most certainly *is* using a server-side platform. – Quentin Feb 13 '23 at 15:34

0 Answers0