[Vuejs]-CORS Access to XMLHttpRequest at X from origin has been blocked by CORS policy

1👍

The problem here seems to be that axios likes to send its own default headers, and these don’t pass the preflight check for your external request. To fix this, you will need to remove the offending headers.

I was able to recreate your error, and also to bypass the CORS issue using the code below.

let url = 'https://api.openweathermap.org/data/2.5/weather?q=London&mode=json&units=metric&appid=TOKEN';

// create a new instance so we don't delete the headers for other requests
let instance = axios.create();

// delete headers if existing
delete instance.defaults.headers.common['Accept'];
delete instance.defaults.headers.common['X-Requested-With'];
delete instance.defaults.headers.common['X-CSRF-TOKEN'];

// use the new axios instance to make your get request
instance.get(url)
    .then(function(response) {
        console.log(response);
    }).catch( errors => {
        console.log(errors + ' ne radi');
    });

Hope this helps and good luck!

0👍

You can add into TrustHosts.php Middleware without doing anything extra. Read more from here https://stackoverflow.com/a/70361284/2612926

👤Anup

Leave a comment