【发布时间】：2017-02-21 18:47:27
【问题描述】：
我在这里遗漏了一些东西。我正在努力让 API 调用正常工作。 然后我将 url 像下面那样拆分，它可以工作 - 从字面上看一次。之后，它再次无法工作。我发誓我没有改变任何东西。
你是如何在 AXIOS 中进行的？
错误信息是：
XMLHttpRequest 无法加载 http://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": "*"},
});
【问题讨论】：
-
No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin '...' is therefore not allowed access 的可能重复项。这是一个超级常见的问题，与 redux 没有任何关系。该帖子暗示回答了您的问题，但可能会有更好的问题。
-
好的，公平点。但是查看
axios文档，我没有看到可以配置它的东西。我确实尝试了其他一些选项，但没有奏效。我会列出来的 -
这是必须设置服务器才能执行的操作。答案告诉你，如果你在服务器上建立一个项目，你仍然可以调用魔法海藻。
-
我刚刚调用了 url magicseaweed.com/api/W2Z26fXscpELi7nPB0svfqcGj9FtGO9e/forecast/… 和您由于 CORS 导致的错误的一部分，服务器似乎以 500 响应，这表明他们一方出现意外错误。您确定 API 没有问题吗？有时，如果出现错误（在本例中为 500），实现服务器 api 的人会忘记在响应中添加 CORS 标头
-
您刚刚在问题中所做的更改不会解决任何问题，该标头应该在服务器的响应中返回，而不是在请求中发送。这是服务器 api 的工作。