之前在网上看到一个博主写的前端通用的下载文件的方法,个人觉得很实用,所以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. 初识面向对象(钻石继承,super,多态,封装,method,property,classmethod,staticmethod)

    组合 什么有什么的关系 一个类的对象作为另一个类的对象继承 子类可以使用父类中的名字(静态属性 方法)抽象类和接口类 只能不继承,不能被实例化 子类必须实现父类中的同名方法———规范代码 metacl ...

  2. python代码组织及模块使用

    python代码组织 python和其他编程语言一样,采用包管理代码,一个包中可包含许多模块. 使用模块最大的好处是大大提高了代码的可维护性.其次,编写代码不必从零开始.当一个模块编写完毕,就可以被其 ...

  3. QT5无法定位程序输入点 于动态链接库QtCore5.dll的解决

    本人新手刚接触QT5,今天在写程序时,在QtCreator中可以运行,但是单独运行.exe文件时报错 之后发现是因为我之前在path路径中添加了MinGw,导致里面也有Qt库.但是我编译的时候用的是安 ...

  4. redis问题解决 Caused by: io.lettuce.core.RedisException: io.lettuce.core.RedisConnectionException: DENIED Redis is running in protected mode because protected mode is enabled, no bind address was specifie

    1找到redis的配置文件 redis.conf vim redis.conf 修改 protected-mode  yes 改为 protected-mode no 注释掉 #bin 127.0.0 ...

  5. 优先级队列(python)

    # -*- coding:utf-8 -*- class Array(object): def __init__(self, size=32): self._size = size self._ite ...

  6. JAVA对象结构

    对象的内存布局 在HotSpot虚拟机中,对象在内存中存储的布局可以分为3块区域:对象头(Header),实例数据(Instance Data)和对象填充(Padding). 实例数据:对象真正存储的 ...

  7. AI文本审核垃圾内容

    今天无意获得一个AI的文本审核的API,基于深度学习及大规模样本训练的人工智能文本审核技术,一站式准确  检测识别文本中夹杂的色情.推广.辱骂.违禁违法等垃圾内容,净化 网络环境,为您的应用提供更可靠 ...

  8. spring mvc 坑之PUT,DELETE方法接收不到请求参数

    https://www.cnblogs.com/roobtyan/p/9576685.html 原因: Tomcat处理参数的问题: 1.将请求体中的数据,封装成一个map    2.request. ...

  9. dp--01背包,完全背包,多重背包

    背包问题 以下代码 n是物品个数,m是背包容积 物品价值和重量int v[maxn],w[maxn]; 01背包 模板 for(int i = 0; i < n; i++) { for(int ...

  10. am335x using brctl iptables dhcpcd make multi wan & multi lan network(十五)

    构建多LAN口多WAN口动态网络 [目的] 在AM335X定制动态网络功能,如下所示,在系统当中有两个以太网口,有4G模块,有wifi芯片8188eu支持AP+STA功能. [实验环境] 1.  Ub ...