如何解决Fetch API js中的CORS错误

Question

我想从我的子域(文件托管服务器(中获取json，但它得到了以下错误：

原因：CORS请求未成功(

(原因：CORS标头"Access Control Allow Origin"丢失

我的类似代码：

async function getData(url = '', data = {}) {
const response = await fetch(url, {
method: 'get',
mode: 'no-cors',
headers: {
'Access-Control-Allow-Origin' : '*'
},
});
return response.json();
}

我添加

headers: {
}                               'Access-Control-Allow-Origin' : '*'

但不要工作。

我添加

mode: no-cors

到代码，获取文件，但返回响应状态0，模式："不透明"。

请帮帮我。

Answer 1

如果你的宿主是一个PHP文件，你想在其他PHP文件中调用它，你需要很多时间才能将这些代码添加到你想在line_2调用的PHP文件中

header("Access-Control-Allow-Origin: *");

Answer 2

我相信你知道你在这里想要实现什么。使用CORS用例获取是非常棘手的。CORS由服务器设置驱动。所有标头ACCESS-CONTROL-*都设置在服务器端。

Access Control Allow Origin适用于CORS，客户端在处理跨来源请求时会遵守此标头。服务器在响应中发送此标头。您必须从服务器端传递此标头。在你的回应中，你必须传递这个标题。

Access-Control-Allow-Origin: *

或者，如果您正在处理凭据(此处不支持通配符(：-

Access-Control-Allow-Origin: https://foo.example 

参考：-

https://developer.mozilla.org/en-US/docs/Web/HTTP/CORS

https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API/Using_Fetch

Answer 3

CORS是通过服务器端配置的，因此您需要在文件托管服务器上进行配置