skip to Main Content

I’ve tried to fetch data from WordPress API in Vue App.
I am using DigitalOcean with Apache.

I’ve set Header set Access-Control-Allow-Origin "*" in vhost.

But now I’ve got an error like this:

Access to XMLHttpRequest at xxx from origin ‘http://localhost:3000‘ has been blocked by CORS policy: The ‘Access-Control-Allow-Origin’ header contains multiple values ‘http://localhost:3000, *’, but only one is allowed.

I am using axios for requests.

Do you have any ideas what’s going on?
Is it server side issue or should I set something in axios config?

Thanks.

2

Answers


  1. This is a server-side issue. You need to enable CORS in your apache config, by either:

    1. Setting Header set Access-Control-Allow-Origin "*" – meaning that all origins are allowed to make requests to this server
    2. Setting Header set Access-Control-Allow-Origin "http://localhost:3000"

    This tells the server to accept requests from this origin(s), to further explain.

    https://enable-cors.org/server_apache.html

    Login or Signup to reply.
  2. Change your header set statement to:

    Header always set Access-Control-Allow-Origin “*”

    Otherwise Apache will prepend origin in request to the header, which causes the issue.

    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search