【问题标题】:Instead of downloading, files are opening in browser不是下载,而是在浏览器中打开文件
【发布时间】:2019-03-08 07:25:22
【问题描述】:

我的 Pdf 文件存储在 google 存储桶中,我有一个链接,可以说是 https://storage.googleapis.com/bucketName/xyz.pdf。要下载此文件,我正在这样做,

<a href="https://storage.googleapis.com/bucketName/xyz.pdf" download> Download This File </a>

但是当我点击这个锚标记时,而不是下载这个文件浏览器在同一个标​​签中打开这个文件,即使我尝试通过 javascript 下载文件并且正在使用这个代码。

var link = document.createElement("a");
link.download = 'File.pdf';
link.href = 'https://storage.googleapis.com/bucketName/xyz.pdf';
link.click();

但同样的情况再次发生在同一选项卡中打开文件而不是下载。不知道主要问题是什么?这个 Google 存储桶是不允许文件下载,还是我的 chrome 设置阻止文件下载。 它没有在 Chrome 中下载,我猜 Chrome 确实允许从 CORS 文件下载。

【问题讨论】:

标签: javascript html download anchor


【解决方案1】:

按照JavaScript/jQuery to download file via POST with JSON data 构造一个 blob 并使用它返回链接的文件引用。

这将以符合标准的方式通知浏览器您的意图。

示例 ...

$.get(/*...*/,function (result)
{
    var blob=new Blob([result]);
    var link=document.createElement('a');
    link.href=window.URL.createObjectURL(blob);
    link.download="myFileName.txt";
    link.click();

});

【讨论】:

  • 你试过下载pdf吗?它不适用于最新的浏览器。
  • 同意 pdf 也不会下载
  • 一些浏览器具有您无法覆盖的内置功能......这是浏览器的一项功能,打开浏览器后会提供“保存”选项,但必须下载它才能显示首先。
【解决方案2】:

解决方案

内容处置附件似乎对我有用:

self.set_header("Content-Type", "application/json")
self.set_header("Content-Disposition", 'attachment; filename=learned_data.json')

解决方法

应用程序/八位字节流

我在使用 JSON 时发生了类似的事情,对于 服务器端的我来说,我将标头设置为 self.set_header("Content-Type", "application/json") 但是,当我将其更改为:

self.set_header("Content-Type", "application/octet-stream")

它会自动下载它。

还要知道,为了使文件仍然保留 .json 后缀,您需要在文件名标题上添加它:

self.set_header("Content-Disposition", 'filename=learned_data.json')

【讨论】:

    【解决方案3】:

    尝试link.target = "_blank"; 这将在新标签中打开文件,link.download 将强制下载。

    请告诉我这是否有效。

    【讨论】:

    • 对不起,它不起作用,但是对于 pdfviewer 中的解决方法,我们有一个下载 pdf 的按钮,但它不是直接通过单击按钮下载 pdf。
    猜你喜欢
    • 2011-11-08
    • 2016-12-14
    • 2013-10-25
    • 1970-01-01
    • 2011-10-18
    • 2013-05-15
    • 2013-04-13
    • 1970-01-01
    相关资源
    最近更新 更多