JS实现文档下载兼容谷歌、火狐、IE

原创

已于 2022-03-31 11:04:13 修改 · 3k 阅读

3 ·

CC 4.0 BY-SA版权

文章标签：

#前端

于 2018-11-09 10:01:03 首次发布

本文介绍了如何使用JavaScript实现文件下载，重点解决Chrome、Firefox和IE11等浏览器的兼容问题，包括使用download属性、Blob对象、iframe、msSaveBlob等方法，并最终通过后台接口实现全浏览器兼容的文件下载。

js文件下载？简单啊，a标签的download属性，然后点击即下载。
http://www.w3school.com.cn/tags/att_a_download.asp
官方也说了只有 Firefox 和 Chrome 支持 download 属性。
那我IE11怎么办，于是我开始了无尽的百度与尝试。

// 方法一：window.open没用，只是打开文件。
let output = '/static/download/aaa.txt'
let downloadFileName = 'testa'
if (window.navigator.msSaveBlob) {
   // for ie 10 and later
   try {
       let blobObject = new Blob([output])
       window.navigator.msSaveBlob(blobObject, downloadFileName)
   } catch (e) {
       console.log(e)
   }
} else {
   let file = 'data:text/plain;charset=utf-8,'
   let logFile = output
   let encoded = encodeURIComponent(logFile)
   file += encoded
   let a = d