Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Vue and Axios CORS error No 'Access-Control-Allow-Origin' header is present on the requested resource [duplicate]

I am currently getting the above error, I am using Axios to make the GET request to an external API. After reading the Mozilla docs, doing a lot of research and trying different options I am still not any better off.

I have stripped the code back to the basics:

axios.get('URL.com', {
        headers: {
          Access-Control-Allow-Origin: *
        },
        auth: {
          username: 'username',
          password: 'password'
        },
      })
      .then(function (response) {
        console.log(response);
      })
      .catch(function (error) {
        console.log(error);
      });

Do I need to add anything else to the headers?

Everything works through Postman so once I can pass the CORS issue everything will work.

like image 508
James Parsons Avatar asked Jan 21 '17 11:01

James Parsons


People also ask

How do I fix CORS header access-control-allow-Origin missing?

If the server is under your control, add the origin of the requesting site to the set of domains permitted access by adding it to the Access-Control-Allow-Origin header's value. You can also configure a site to allow any site to access it by using the * wildcard. You should only use this for public APIs.

How do I fix CORS error Vue?

You can set a proxy in Vue using the vue. The file is located on the root directory of a Vue project. If it's not present, you can create one. Not every fix for a CORS error is a good fix. For example, setting the value for the Access-Control-Allow-Origin header to " * " on the back end may clear many CORS errors.


1 Answers

baseURL: 'https://www.yourserver.com.br',
timeout: 10000,
withCredentials: false

setting axios.defaults.withCredentials = true;

like image 96
Leonardo Filipe Avatar answered Nov 10 '22 07:11

Leonardo Filipe