Question

<a href="www.myfile.json" download>download file</a>

“ www.myfile.json”是指向json文件的链接。我的目标是当用户点击“下载文件”时，json 文件将自动下载。但是，使用上面的代码，当我单击“下载文件”时，它将打开浏览器中的json文件对我来说。我想知道我在这里做错了。

我已经尝试过此链接（Chrome 65 blocks cross-origin <a download>. Client-side workaround to force download?）中的解决方案，但是我获得了从原点“ XXXX”到“ XXXXX”处进行抓取的访问权限已被CORS策略阻止：对预检请求的响应未通过访问控件检查：所请求的资源上不存在“ Access-Control-Allow-Origin”标头。如果不透明的响应满足您的需求，请将请求的模式设置为“ no-cors”，以在禁用CORS的情况下获取资源。但是，我确实在请求标头中设置了“ Access-Control-Allow-Origin”：“ *”。我无法在服务器端进行任何修改。对我来说正确的方法应该是什么？

我的标题如下：

headers: new Headers({
                 'Origin': location.origin,
                 'Access-Control-Allow-Origin': '*',
                 }),
                 mode: 'cors'
            })

此外，我还尝试了设置模式：'no-cors'，但它不起作用。

Answer 1

Access-Control-Allow-Origin: *标头必须位于响应中，而不是请求中。没有服务器的配合，您将无法读取响应数据。

因此，找到一个更协作的服务器。

有一个simple CORS proxy，它将下载您提供的所有URL，粘贴在Access-Control-Allow-Origin标头上，然后将其发送回给您。 如果您愿意让第三方看到JSON文件的内容，您可以将linked solution中的fetch行更改为

  fetch(url, {

到

  fetch(`https://bypasscors.herokuapp.com/api/?url=${encodeURIComponent(url)}`, {

使用链接下载json文件

1 个答案: