js下载文件

最新推荐文章于 2024-01-31 17:16:03 发布

xiaozhen0610

最新推荐文章于 2024-01-31 17:16:03 发布

阅读量527

点赞数

分类专栏：前端

原文链接：https://www.mk2048.com/blog/blog_h201h11jc2ab.html

版权

844 篇文章 0 订阅

订阅专栏

能触发浏览器下载的url有两类:

response header中指定了Content-Disposition为attachment，它表示让浏览器把响应体作为附件下载到本地 (一般Content-Disposition还会指定filename, 下载的文件默认就是filename指定的名字)
response header中指定了Content-Type 为 application/octet-stream(无类型) 或者 application/zip(下载zip包时)以及其它几个不常见类型 (其中还有浏览器差异)，其中 application/octet-stream表示http response为二进制流(没指定明确的type), 需要下载到本地, 由系统决定或者用户手动指定打开方式。

在这种前提下，只需要浏览器请求了这个地址，都会自动下载，具体的方式如下：

1、iframe 　　加载请求此地址时会自动下载 //据说兼容先较好，推荐，使用的时候吧iframe设置为display;none即可

2、a 　　　　点击请求此地址时会自动下载

　　H5的download属性 <a download href="下载url">下载</a> 这时候，如果返回的是img这种浏览器可以打开的文件时，也会下载（否则会直接打开）

3、form 　　发起submit请求此地址时会自动下载

<form 
   action="下载ur"
   method="get" 
>
   <button type="submit">下载</button>
</form>

4、window.location.href 赋值为此地址时会自动下载 ，如果是其他地址，会跳转，但，当是下载的url，浏览器会发起请求，下载下来，并且不会改变本页的 window.location.href

　　window.location.href = “下载url”

4、window.open 　　　　赋值为此地址时会自动下载 ，但会先打开新标签页再下载再关闭新标签页，体验不佳

　　window.open = “下载url”

总之：只要是下载的url，只要让浏览器发起请求，都会实现下载的功能；具体是什么原因，有待后期的学习。（我司是汪大神，分分钟就说出了这个规律，想必必然有基础理论的支持，也许是HTTP请求、或者后台知识的）

关注