常用的文件下载方式
链接跳转
浏览器访问一个链接时,对于浏览器可以打开的文件类型,浏览器会跳转到该链接,而对于无法打开的文件类型,浏览器会自动下载.
因此根据这一特性,对于浏览器无法打开的文件类型,可以采用location.href
,window.open
,a标签等只要是可以访问链接的方式,实现文件下载
缺点:
- 对于图片等浏览器能打开的文件格式,不适用
a标签
对a标签添加download属性,可实现文件下载.参考MDN,注意几点:
- 要配合href属性使用,href为文件的地址,download为文件预填充名
- 可以使用blob:URL和data:URL,下载用js生成的内容
- content-disposition优先级高于此属性
缺点:
1)只能用于同源URL,当跨域时,download属性失效,a标签保持默认的跳转功能
服务端设置header
通过服务端设置header,直接标识文件需要下载
header('Content-type: image/jpeg');
header("Content-Disposition: attachment; filename='filename.jpg'");
参考文档MDN content-disposition,
Content-Disposition 响应头指示回复的内容该以何种形式展示,是以内联的形式(即网页或者页面的一部分),还是以附件的形式下载并保存到本地。attachment表示消息体应该被下载到本地.
缺点:
- 需要服务端支持
参考