Friday 12 April 2019

reactjs - React fetch has error fetch was blocked by CORS policy

I tried to have a login button click call a fetch REST call.




However, the problem is that the fetch fails, with this error message in the Javascript console.



// Access to fetch from origin has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource
// If an opaque serves your need set the requests mode to 'no-cors' to fetch the resource with CORS disabled.
// Exception Failed to Fetch.



Why is this happening, and why can't I call a REST call from a Button click in React?



private handleLogin = () => {




    console.log("button submit");

// Access to fetch from origin has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource
// If an opaque serves your need set the requests mode to 'no-cors' to fetch the resource with CORS disabled.
// Exception Failed to Fetch.
fetch('https://gturnquist-quoters.cfapps.io/api/random')
.then((res) => {
if (res.status >= 400) {
throw new Error("Bad response from server");
}

return res.json();
})
.then((stories) => {
console.log(stories);
});


this.props.login(this.state);



}

No comments:

Post a Comment

php - file_get_contents shows unexpected output while reading a file

I want to output an inline jpg image as a base64 encoded string, however when I do this : $contents = file_get_contents($filename); print &q...