1. POST方式进行文件导出;

  // url 下载URL
// fileName 下载文件名称
function exportFile(url, fileName) {
let xhr = new XMLHttpRequest();
xhr.open("POST", url);
xhr.responseType = "blob";
xhr.onload = () => {
let ctx = xhr.response;
let blob = new Blob([ctx]);
if ("msSaveOrOpenBlob" in navigator) {//兼容IE
window.navigator.msSaveOrOpenBlob(blob, fileName);
} else {
let aLink = document.createElement("a");
aLink.download = fileName;
aLink.style.display = "none";
aLink.href = URL.createObjectURL(blob);
document.body.appendChild(aLink);
aLink.click();
document.body.removeChild(aLink);
}
};
xhr.send();
}

使用方法:exportFile(url,fileName);

使用Angular方式进行导出:

class ExportEvent {
constructor( private http:HttpClient ){}
// url 下载URL
// fileName 下载文件名称
exportFile(url,fileName){
this.http.request("POST",url,{},{responseType:"blob"}).pipe()
       .subscribe(
(res)=>{
let blob = new Blob([res]);
if ("msSaveOrOpenBlob" in navigator) {//兼容IE
window.navigator.msSaveOrOpenBlob(blob, fileName);
} else {
let aLink = document.createElement("a");
aLink.download = fileName;
aLink.style.display = "none";
aLink.href = URL.createObjectURL(blob);
document.body.appendChild(aLink);
aLink.click();
document.body.removeChild(aLink);
} },
(error)=>{
let reader = new FileReader();
reader.onload = (e)=>{
if(e && e["target"]){
let errorMsg = JSON.parse(e["target"]["result"]);
if(errorMsg && errorMsg["code"]){
console.log("有报错,出错了。。。。。");
}
}
}
//error.error的值是一个Blob对象
reader.readAsText(error.error);
}
       );
}
}

2. GET方式进行文件导出;

// url 下载路径
window.location = url;

js 实现文件下载/文件导出。的更多相关文章

  1. FileSaver.js 实现浏览器文件导出

    FileSaver.js 实现浏览器文件导出 在浏览器中用 FileSaver.js 可以下载文件,不会造成文件直接打开等情况

  2. FileUtils 文件下载 文件导出

    public class FileUtils { /// <summary> /// 文件下载 /// </summary> /// <param name=" ...

  3. 文件导出也可以这么写【js+blob】

    文件导出在软件开发中是个比较常用的功能,基本原理也很简单: 浏览器向后台发送一个Get请求 后台处理程序接收到请求后,经过处理,返回二进制文件流 浏览器接收到二进制文件流后提示下载文件 调用的js方法 ...

  4. grunt 单独压缩多个js和css文件【转】

    原文地址:http://xiaomiya.iteye.com/blog/2177877 使用grunt来压缩前端js,css文件 因为最近做的客户端本地项目有用到十几个js,js提交之前都需要压缩.用 ...

  5. loadrunner实现excel文件导出操作

    项目中需要对“商品信息”进行查询及导出,但是loadrunner并不能录制到“保存”这一操作. 项目介绍:flex+Http协议: 不能录制的原因: 在我们点击了“导出”按钮后,服务端已经生成一份我们 ...

  6. minify合并js和css文件

    压缩 JavaScript 和 CSS,是为减少文件大小,节省流量开销:合并 JavaScript 和 CSS,是为了减少请求数量,减轻服务器压力.而这些枯燥又没有技术含量的工作,我们以前通常会手动处 ...

  7. Jmeter_实现Excel文件导出到本地

    一般而言,对于页面的“导出”操作,主要经历如下两个操作:①根据数据库的内容,将文件导出到应用服务器上:②将服务器上的文件下载到本地电脑: Jmeter同LoadRunner类似,只能记录服务端与客户端 ...

  8. 构建工具是如何用 node 操作 html/js/css/md 文件的

    构建工具是如何用 node 操作 html/js/css/md 文件的 从本质上来说,html/js/css/md ... 源代码文件都是文本文件,文本文件的内容都是字符串,对文本文件的操作其实就是对 ...

  9. C#中的文件导出大全

    s 得到 radiobuttonlist和CheckBoxList 选中值 得到radiobuttonlist 选中值:var CheckBoxList=document.all.optButtonL ...

  10. Node.js之文件下载

    Node.js之文件下载,主要最近解决我的一个需求. 需求描述:如何将腾讯云上传的文件存储到本地某个目录下,如果用js来实现,纯JavaScript没有这样的功能(也许有),正好我这个项目用node. ...

随机推荐

  1. 图像分割_评价指标_PSNR峰值信噪比和SSIM结构相似度

    PSNR psnr是"Peak Signal to Noise Ratio"的缩写,即峰值信噪比,是一种评价图像的客观标准. 为了衡量经过处理后的影像品质,我们通常会参考PSNR值 ...

  2. Hexo博客yilia主题首页添加helper-live2d模型插件

    插件效果 插件的github地址 插件作者提供了较为详细的安装步骤,我结合自己操作和图示,提供大家. 效果展示:红框内为2d模型,可以随鼠标移动而变化 安装模块: hexo博客根目录选择cmd命令窗口 ...

  3. Python数据分析易错知识点归纳(六):机器学习

    六.机器学习 分类和聚类的区别 分类是有监督学习,聚类是无监督学习 分类算法用于预测新样本,聚类用于理解已知数据 标准化/归一化 type_se_num = type_se[type_se!= 'ob ...

  4. 代码随想录贪心专题-day1

    35. 分发糖果 n 个孩子站成一排.给你一个整数数组 ratings 表示每个孩子的评分. 你需要按照以下要求,给这些孩子分发糖果: 每个孩子至少分配到 1 个糖果. 相邻两个孩子评分更高的孩子会获 ...

  5. 树形DP + 换根DP

    树形DP--基础 P1352 没有上司的舞会 设 \(f[i][0/1]\) 表示第 \(i\) 个人不去或者去. 如果第 \(i\) 个人没去,那么下属可去可不去,所以 \(f[i][0] = \s ...

  6. 【go语言】2.4.3 Go Modules

    Go Modules 是 Go 语言的官方依赖管理工具,自 Go 1.11 版本开始引入.它解决了 Go 语言在依赖管理上的一些问题,如版本控制.依赖隔离等. 初始化一个新的模块 你可以使用 go m ...

  7. NAT与NAT实验

    1.NAT与NAT实验 NAT(网络地址翻译) 一个数据包目的ip或者源ip为私网地址, 运营商的设备无法转发数据. 实际场景问题 如下图 201.0.0.1 公网地址?   买的 运营商给你的​19 ...

  8. 使用logrotate定期切割nginx日志

    前言 默认情况下,nginx的日志都会写到access.log文件中,访问流量大的话,日志文件很快就会膨胀到几十G,不方便分析处理,也占用硬盘空间.借助linux自带的logrotate工具可以很方便 ...

  9. Health Kit基于数据提供专业方案,改善用户睡眠质量

    什么是CBT-I? 中国社科院等机构今年发布的<中国睡眠研究报告2023>内容显示,2022年,受访者的每晚平均睡眠时长为7.40小时,近半数受访者的每晚平均睡眠时长不足8小时(47.55 ...

  10. Ascend C保姆级教程:我的第一份Ascend C代码

    本文分享自华为云社区<Ascend C保姆级教程:我的第一份Ascend C代码>,作者:昇腾CANN . Ascend C是昇腾AI异构计算架构CANN针对算子开发场景推出的编程语言,原 ...