Fetching Data and 403 Error ReactJS

Below is the part of the code where i try to fetch data for countries but i keep getting this message

App.js:20 GET https://cors-anywhere.herokuapp.com/https://restcountries.com/v2/all 403 (Forbidden)

below is my code , i hope someone can help and point to any possible issues with it .

 const [countries, setCountries] = useState([]);
  const [score, setScore] = useState(0);

  const FetchCountries = async () => {
    try {
      const response = await fetch(
      const data = await response.json();
    } catch (error) {
      /* alert("Countries data failed to fetch"); */

  useEffect(() => {
  }, []);


I was able to get this work with this:


Here is a pen that shows it in action.

it was already in my code

The more important part was the link to a working example.

1 Like

What was wrong with the other API?


I wouldn’t suggest you rely on a CORS proxy if you don’t have to. They tend to be unreliable and shouldn’t be used in production/release versions anyway so you would have to come up with something else for the final version.

1 Like

Problem solved , i checked the URL in the browser , with the following text and button

This demo of CORS Anywhere should only be used for development purposes, see https://github.com/Rob--W/cors-anywhere/issues/301.

To temporarily unlock access to the demo, click on the following button

i clicked the button and it worked

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.