Managed to get a JSON response in Postman, but got an empty response in the console, with no errors whatsoever.
here's the code:
function getFetch() {
const url = `https://fantasy.premierleague.com/api/bootstrap-static/`;
let requestOptions = {
method: "GET",
redirect: "follow",
mode: 'no-cors',
"Access-Control-Allow-Origin": "*",
"Access-Control-Allow-Methods": "GET",
"Access-Control-Allow-Headers": "x-requested-with"
};
fetch(
"https://fantasy.premierleague.com/api/bootstrap-static/",
requestOptions
)
.then((response) => response.text())
.then((result) => console.log(result))
.catch((error) => console.log("error", error));
}
Assuming you are trying that in browser, client-side:
Cross-origin mode: 'no-cors'
requests have no access to response body and headers, basically they blindly send data but cannot see the result.
Those Access-Control-…
headers are not for the request, but for the server response. If the server responded with them, the response would be readable from all origins. (Provided such requests were not self-restrained by mode: no-cors
as describer above.)
You can see that no mater what you fetch, response is always with status: 0
and ok: false
:
function runFetch() {
console.clear();
fetch(
url.value, {
mode: nocors.checked ? 'no-cors' : 'cors'
},
)
.then((response) => {
console.log('Response status:', response.status, ', OK:', response.ok);
return response.text()
})
.then((result) => console.log("Result: »" + result + "«"))
.catch((error) => console.log("error", error.message));
}
runFetch()
<label>URL: <input id="url" value="https://fantasy.premierleague.com/api/bootstrap-static/" /></label>
<br><label>no-cors: <input type="checkbox" id="nocors" checked /></label>
<br><button onclick="runFetch()">run</button>