使用html新属性download自定义下载文件

在 HTML5 中可以设置 a 标签的 download 属性,实现点击超链接时直接下载文件而不是打开超链接。

代码示例:

<a href="woxinfeishi-bukezhuanye.jpg" download="我心匪石.jpg">点击下载图片</a>

Demo 示例:html-download.html

目前该属性仅 Chrome、Firefox 支持。

使用 download 属性需要注意,只有同域(来源相同)时才会得到完整支持。这一点 w3school 并没有明确指出。Mozilla 的开发文档里有一行小字:This attribute is only honored for links to resources with the same-origin.

在 Chrome 下,当 href 不同域,会以原始的名称下载文件。在 Firefox 下,当 href 不同域时,会当做普通 a 处理,直接在浏览器中打开该连接。

我们知道通过程序下载文件时,设置 Content-Disposition 头信息,可以告诉浏览器文件存储的名字。火狐浏览器会优先使用 Content-Disposition 给出的文件名。

作者: 袖之欢

科技改变生活,编程改变世界。

发表评论

电子邮件地址不会被公开。 必填项已用*标注