Im new to strapi and I have downloaded strapi v4 and as front-end I use vue.js.
Now I created categories and I am trying to fetch those with my vue app but I’m getting a cors error.
Access to XMLHttpRequest at 'http://localhost:1337/api/categories' from origin 'http://localhost:8080' has been blocked by CORS policy: The value of the 'Access-Control-Allow-Origin' header in the response must not be the wildcard '*' when the request's credentials mode is 'include'. The credentials mode of requests initiated by the XMLHttpRequest is controlled by the withCredentials attribute.
In the documentation I see I can override the origin on the cors middleware, but I don’t know how.
I’ve tried it with resolve and then set the config, but that breaks the cms.
{ resolve: 'strapi::cors', config: { origin: 'http://localhost:8080' } }
Advertisement
Answer
After spending a few hours on the internet I finally got it working.
In my config/middlewares.js
I had to replace strapi::cors
to this:
module.exports = [ ... { name: 'strapi::cors', config: { enabled: true, header: '*', origin: ['http://localhost:8080'] } } ... ];
Don’t forget to add port number, because it will not work if you don’t.