之前在网上看到一个博主写的前端通用的下载文件的方法,个人觉得很实用,所以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)的更多相关文章

  1. 前端通过url下载文件方法

    前端通过url下载文件方法 产生背景 浏览器通过url下载文件,当浏览器识别出资深能播放的资源文件,就不会走下载流程,会直接打开 解决方法 1.让后台转成请求的方式,输出文件流(如果想实现批量下载-因 ...

  2. .NET两种常见上传下载文件方法

    1.FTP模式 代码如下: (1)浏览 /// <summary> /// 浏览文件 /// </summary> /// <param name="tbCon ...

  3. js页面(页面上无服务端控件,且页面不刷新)实现请求一般处理程序下载文件方法

    对于js页面来说,未使用服务端控件,点击下载按钮时不会触发服务端事件,且不会提交数据到服务端页面后台进行数据处理,所以要下载文件比较困难.且使用jQ的post来请求一般处理程序也不能实现文件的下载,根 ...

  4. net下载文件方法汇总

    //TransmitFile实现下载 protected void Button1_Click1(object sender, EventArgs e) { /* 微软为Response对象提供了一个 ...

  5. 页面下载文件方法,post与get

    一般下载文件,常见使用的是window.open('url'):方法进行下载.若需要带参数,直接在url后面拼接参数,进行传递.window.open方法仅可以进行get方法进行参数提交. 若需要进行 ...

  6. 前端JS下载文件总结

    Data URLs Data URLs: 即前缀为data: 协议的URL,其允许内容创建者向文档中嵌入小文件. 例如:可以直接在HTML中的img元素直接使用Data URLs : data:[&l ...

  7. 前端vue下载文件时blob返回流中怎么获取文件名

    我很久之前写了一篇前端vue利用blob对象下载文件,有些人私信我,如果后端返回流失败,给出的json对象该怎么获得?前端获取的流怎么能获取原文件名?其实在那篇文章之后,我就已经针对这两个问题进行了优 ...

  8. .net下载文件方法

    1.以文件流下载 byte[] fileStr=new byte[5]; MemoryStream btMs = new MemoryStream(fileStr); //以字符流的形式下载文件 by ...

  9. ASP.NET 后台下载文件方法

    void DownLoadFile(string fileName) { string filePath = Server.MapPath(fileName);//路径 //以字符流的形式下载文件 F ...

随机推荐

  1. angularcli 第二篇(数据绑定、属性申明、绑定属性)

    1.数据绑定 插值绑定: <li>{{ hero.name }} </li>       或       <div  class = "{{ demo }}&q ...

  2. 彻底终结MySQL同步延迟问题

    作为一名DBA,在工作中会经常遇到一些MySQL主从同步延迟的问题,这些同步慢的问题,其实原因非常多,可能是因为主从的网络问题导致,可能是因为网络带宽问题导致,可能是因为大事务导致,也可能是因为单线程 ...

  3. vue之获取原生的dom的方式

    1.获取原生的DOM的方式 <!DOCTYPE html> <html lang="en"> <head> <meta charset=& ...

  4. SPA项目开发动态树、数据表格、分页功能

    SPA项目开发 1.修改左侧动态树 LeftNav.vue <template> <el-menu router :" class="el-menu-vertic ...

  5. (Python) SOAP Web Service (HTTP POST)

    功能很强大,可惜只有试用 https://www.example-code.com/python/soap_web_service.asp

  6. Bzoj 4147: [AMPPZ2014]Euclidean Nim(博弈)

    4147: [AMPPZ2014]Euclidean Nim Time Limit: 1 Sec Memory Limit: 256 MB Description Euclid和Pythagoras在 ...

  7. jmeter五种提取器 之 正则表达式

    提取器的作用是把响应结果值获取到,用于后续的请求参数中 () :封装了待返回的匹配字符串. .  :匹配任何单个字符串. + :一次或多次. ? :不要太贪婪,在找到第一个匹配项后停止. *  :匹配 ...

  8. 本地spark报:java.lang.UnsatisfiedLinkError: org.apache.hadoop.io.nativeio.NativeIO$Windows.createFileWithMode0(Ljava/lang/String;JJJI)Ljava/io/FileDescriptor;

    我是在运行rdd.saveAsTextFile(fileName)的时候报的错,找了很多说法……最终是跑到hadoop/bin文件夹下删除了hadoop.dll后成功.之前某些说法甚至和这个解决方法自 ...

  9. P5385 [Cnoi2019]须臾幻境(LCT+主席树,思维题)

    题目 P5385 [Cnoi2019]须臾幻境 做法 考虑一条边\((u,v)\)是否\([L,R]\)中的贡献:\([L,R]\)中第一条位于\(u,v\)链的边,则减少了一个联通块 实现:\(LC ...

  10. HDU 6194 string string string ——(2017沈阳网络赛,后缀数组)

    思路见:http://blog.csdn.net/aozil_yang/article/details/77929216. 代码如下: #include <stdio.h> #includ ...