盘点前端下载功能

开发过程中会遇到下载某个文件或者压缩包，浏览器下载功能基本就是利用<a></a>标签实现的，

为什么用a标签？a标签开始学习的时候不是跳转吗？但是如果a标签的href给的不是一个可访问的地址，而是一个文件，那么浏览器就去解析文件，如果是能解析的就直接打开展示，如果解析不了那么就打包下载。

1、<a href="1.txt" download="1.txt" target="view_window">下载</a>

2、<a href="httpxxxxxxx.txt" download="1.txt" target="view_window">下载</a>

还可以动态生成a标签，然后赛值

let a = document.createElement('a');
a.href = '1.txt';
a.download = '1.txt';
a.click()

道理还是以上的道理。

但是如果后台给的就是一个字符串，但是你就是需要下载的形式呢？

那么用以下方式：

3、

download({接口传参}).then((res) => { 　　　　// download 为调用的接口 res为接口给的内容 可以直接给下面的内容赛值也行     const blob = new Blob([res]);     const objectUrl = URL.createObjectURL(blob);     const a = document.createElement('a');     document.body.appendChild(a);     a.setAttribute('style', 'display:none');     a.setAttribute('href', objectUrl);     a.setAttribute('download', '文件名.txt');     a.click();     URL.revokeObjectURL(objectUrl);   }) 看需求和具体场景使用哪种方式。  

标签：const,href,标签,前端,盘点,download,txt,下载
来源： https://www.cnblogs.com/zyz-s/p/16411924.html