Java script fetch returns 200 but no data

Question

I have a requirement to display all the countries in the world in a drop down. So I found this api end point END POINT LINK. When I copy and paste this end point link in my web browser I got a response with all the data. (countries);

When I try to embed this in project.

getCountries() {
      try {
       
        fetch(`https://restcountries.eu/rest/v1/all`).then(data =>
          console.log(data)
        );
        
      } catch (error) {
        console.log("HERE ERROR COMES", error);
      }
    }

It does go to then block of the fetch method. But gives me the output

There is nothing called data here. Even I get a success respond. Why could this happen? Is this something related to cors errors?

Answer 1

You can use as follow:

let url = 'https://restcountries.eu/rest/v1/all';

fetch(url)
.then(res => res.json())
.then((data) => {
  console.log(data);
})
.catch(err => { throw err });