在我的网站“mywebsite.com“上,我有一个D3 javascript代码运行在位于“www.example.com“的某个数据集上otherwebsite.com/data.json,所以我天真地尝试
d3.json("otherwebsite.com/data.json", function(error, json) {
if (!error) {
console.log('done loading',json)
} else {
console.log(error)
}
})
但它当然不起作用:)
Access to XMLHttpRequest at 'otherwebsite/data.json' from origin 'https://mywebsite.com' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.
有没有人有更好的主意?我应该强调这是一个大文件(200MB)。
谢谢
1条答案
按热度按时间5cnsuln71#
取自MDN page on CORS:
出于安全原因,浏览器限制从脚本启动的跨源HTTP请求。例如,XMLHttpRequest和Fetch API在same-origin policy之后。这意味着使用这些API的Web应用程序只能从加载该应用程序的同一源请求资源,除非来自其他源的响应包含正确的CORS标头。
所讨论的CORS标头为
Access-Control-Allow-Origin
,需要将其显式设置为https://mywebsite.com
或设置为包含该标头的值,例如*
。如果您可以访问“www.example.com“的服务器otherwebsite.com,则可以更改随请求发送的标头。
否则,您可能必须在“www.example.com“上下载数据服务器端mywebsite.com,然后让前端从后端请求它,而不是进行跨源请求,因此,您将把JS更改为如下所示: