Geek Answers Handbook

Axios Header - No 'Access-Control-Allow-Origin' Present

Something is missing for me. I tried my best to work with the API. Then I broke the URL as shown below and it works literally once. after that he did not work again. I swear I haven’t changed anything.

How do you do this in axios?

Error message - XMLHttpRequest cannot load http://magicseaweed.com/api/W2Z26fXscpELi7nPB0svfqcGj9FtGO9e/forecast/?spot_id=228. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:8080' is therefore not allowed access. XMLHttpRequest cannot load http://magicseaweed.com/api/W2Z26fXscpELi7nPB0svfqcGj9FtGO9e/forecast/?spot_id=228. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:8080' is therefore not allowed access.

 import axios from 'axios'; const ROOT_URL = `magicseaweed.com/api/W2Z26fXscpELi7nPB0svfqcGj9FtGO9e/forecast/`; export const FETCH_WEATHER = 'FETCH_WEATHER'; export function fetchWeather() { const url = `http://${ROOT_URL}?spot_id=228`; const request = axios.get(url); return { type: FETCH_WEATHER, payload: request }; }

I also tried with this modified GET, but to no avail

 axios({ url: url , headers: {"Access-Control-Allow-Origin": "*"}, });
+7
cors axios
source share
1 answer

Look at here:

https://www.npmjs.com/package/magicseaweed

The bottom line says why their API shell will not work in the browser. For the same reason, you cannot make an Ajax call in a browser.

reference

Can I use this module in a browser using a browser?

Theoretically, yes, but the Magicseaweed API does not currently send the Access-Control-Allow-Origin header to browser requests (somehow, the header is sent if you play the request through cURL).

So, if the API changes this behavior, this module will work with the browser.

You can leave your own proxy server or use one of the available on the Internet:

https://developer.yahoo.com/yql/

https://crossorigin.me/

+1
source share

More articles:


All Articles