Axios-不存在访问-控制-允许-起源头

Question

我错过了一些东西。我正在努力让API调用工作。然后我像下面一样分割网址，它可以工作——字面上一次。在那之后，它无法再次工作。我发誓我没有改变什么。

在AXIOS中，您是如何操作的？

错误消息是：

无法加载XMLHttpRequesthttp://magicseaweed.com/api/W2Z26fXscpELi7nPB0svfqcGj9FtGO9e/forecast/?spot_id=228. 请求的资源上不存在“Access Control Allow Origin”标头。起源'http://localhost:8080因此，不允许访问。

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
    };
}

我也尝试过这个修改过的GET，但是没有用

axios({
  url: url ,
  headers: {"Access-Control-Allow-Origin": "*"},
});

Answer 1

看这里：

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

在底部，它说明了为什么他们的应用编程接口包装在浏览器中不起作用。这和你不能在浏览器中调用Ajax的原因是一样的。

常见问题

我能在浏览器中使用这个模块吗？

理论上是的，但Magicseaweed API当前没有在浏览器请求中发送Access Control Allow Origin标头（如果通过cURL重播请求，则会以某种方式发送标头）。

因此，如果API改变了该行为，该模块将使用browserify。

您可以站起来自己的代理服务器，或者您可以使用互联网上提供的免费服务器之一：

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

https://crossorigin.me/