How can i fix CORS policy problem in Nuxt?

47 Views Asked by At

I have a Nuxt.js application. I try to fetch data from an api everytime the user change the page. but i get confronted by a Cors problem:

Access to fetch at 'https://api.jikan.moe/v4/top/anime/?page=2' from origin 'http://localhost:3000' has been blocked by CORS policy: 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.

const fetchData = async (page) => {
    const { data: recommendations } = await useFetch(
      `https://api.jikan.moe/v4/top/anime/?page=${page}`
    );
    return recommendations;
  };

  const page = ref(1);
  const recommendations = ref([]);

  watch(page, async (newPage) => {
    recommendations.value = await fetchData(newPage);
  });
0

There are 0 best solutions below