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.
JavaScript
x
2
1
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.
2
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.
JavaScript
1
7
1
{
2
resolve: 'strapi::cors',
3
config: {
4
origin: 'http://localhost:8080'
5
}
6
}
7
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:
JavaScript
1
13
13
1
module.exports = [
2
3
{
4
name: 'strapi::cors',
5
config: {
6
enabled: true,
7
header: '*',
8
origin: ['http://localhost:8080']
9
}
10
}
11
12
];
13
Don’t forget to add port number, because it will not work if you don’t.