前端通用下载文件方法(兼容IE)
之前在网上看到一个博主写的前端通用的下载文件的方法,个人觉得很实用,所以mark一下,方便以后查阅
源文地址(源文还有上传/下载excel文件方法)
因为项目要求要兼容IE浏览器,所以完善了一下之前博主的方法
- IE 浏览器:使用微软自带的msSaveBlob 方法,a标签的download属性不支持IE
- 谷歌浏览器(只测试过谷歌):创建a标签 ,添加download属性,模拟鼠标点击事件

//这里res.data是返回的blob对象
var blob = new Blob([res.data.fileData], {type: 'application/json;charset=utf-8'}); //application/vnd.openxmlformats-officedocument.wordprocessingml.document这里表示doc类型
var href = window.URL.createObjectURL(blob); //创建下载的链接
if (window.navigator.msSaveBlob) {
try {
window.navigator.msSaveBlob(blob, 'model.json')
} catch (e) {
console.log(e);
}
} else {
// 谷歌浏览器 创建a标签 添加download属性下载
var downloadElement = document.createElement('a');
downloadElement.href = href;
downloadElement.target = '_blank';
downloadElement.download = 'model.json'; //下载后文件名
document.body.appendChild(downloadElement);
downloadElement.click(); //点击下载
document.body.removeChild(downloadElement); //下载完成移除元素
window.URL.revokeObjectURL(href); //释放掉blob对象
}
前端通用下载文件方法(兼容IE)的更多相关文章
- 前端通过url下载文件方法
前端通过url下载文件方法 产生背景 浏览器通过url下载文件,当浏览器识别出资深能播放的资源文件,就不会走下载流程,会直接打开 解决方法 1.让后台转成请求的方式,输出文件流(如果想实现批量下载-因 ...
- .NET两种常见上传下载文件方法
1.FTP模式 代码如下: (1)浏览 /// <summary> /// 浏览文件 /// </summary> /// <param name="tbCon ...
- js页面(页面上无服务端控件,且页面不刷新)实现请求一般处理程序下载文件方法
对于js页面来说,未使用服务端控件,点击下载按钮时不会触发服务端事件,且不会提交数据到服务端页面后台进行数据处理,所以要下载文件比较困难.且使用jQ的post来请求一般处理程序也不能实现文件的下载,根 ...
- net下载文件方法汇总
//TransmitFile实现下载 protected void Button1_Click1(object sender, EventArgs e) { /* 微软为Response对象提供了一个 ...
- 页面下载文件方法,post与get
一般下载文件,常见使用的是window.open('url'):方法进行下载.若需要带参数,直接在url后面拼接参数,进行传递.window.open方法仅可以进行get方法进行参数提交. 若需要进行 ...
- 前端JS下载文件总结
Data URLs Data URLs: 即前缀为data: 协议的URL,其允许内容创建者向文档中嵌入小文件. 例如:可以直接在HTML中的img元素直接使用Data URLs : data:[&l ...
- 前端vue下载文件时blob返回流中怎么获取文件名
我很久之前写了一篇前端vue利用blob对象下载文件,有些人私信我,如果后端返回流失败,给出的json对象该怎么获得?前端获取的流怎么能获取原文件名?其实在那篇文章之后,我就已经针对这两个问题进行了优 ...
- .net下载文件方法
1.以文件流下载 byte[] fileStr=new byte[5]; MemoryStream btMs = new MemoryStream(fileStr); //以字符流的形式下载文件 by ...
- ASP.NET 后台下载文件方法
void DownLoadFile(string fileName) { string filePath = Server.MapPath(fileName);//路径 //以字符流的形式下载文件 F ...
随机推荐
- H3C 802.11n
- Java抽象语法树AST,JCTree 分析
JCTree简要分析文章目录JCTree简要分析JCAnnotatedTypeJCAnnotationJCArrayAccessJCArrayTypeTreeJCAssertJCAssignJCAss ...
- 【转】win10硬盘序列号查看方法
原文:https://zixue.3d66.com/changjianwenti/tiwen_9679.html ------------------------------------------- ...
- springboot进行热部署项目
百度了挺多的热部署,一种就是idea中一个插件,但是听说还需要 花钱,而且效果还是不太好. 自己按照网上的经验配置了一种属于自己的热部署,下面是详细的配置过程: 一.就是引入热部署需要的依赖: < ...
- try catch 场景
面试官:什么情况下用到try-catch?程序员:代码执行预料不到的情况,我会使用try-catch.面试官:什么是预料不到的情况呢?程序员:比如我要计算a除以b,但是b是变量,如果b等于0程序就会出 ...
- 黄杉杉 --java第八次作业
题目:编写一个应用程序,创建一个矩形类,类中具有长.宽两个成员变量和求周长的方法.再创建一个矩形类的子类——正方形类,类中定义求面积方法.重写求周长的方法.在主类中,输入一个正方形边长,创建正方形对象 ...
- URL路径详解
1.url http://localhost:8080/Test/1.html url表示浏览器访问服务器的网络路径 http:相当于人们交流时候的语言 :// 分隔符 localhost ...
- js select 默认回显判断
<select id="dataselect" class="input-medium" style="width: 20%"> ...
- linux下新磁盘创建lvm、扩容lvm
1.首先查看磁盘fdisk -l2.进入磁盘fdisk /dev/sdbn 创建新磁盘p 创建主分区创建分区ID 1-4为主分区根据提示选择磁盘开始位置(默认空格就好)选择结束位置(新增磁盘大小)t ...
- SPOJ - BALNUM - Balanced Numbers(数位DP)
链接: https://vjudge.net/problem/SPOJ-BALNUM 题意: Balanced numbers have been used by mathematicians for ...