在 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 给出的文件名。