JavaScript 下载文件并保持原文件名称
2023-06-13 09:12:01 时间
大家好,又见面了,我是你们的朋友全栈君。
<script>
// 获取文件名
function fileNameFromHeader (disposition) {
var result = null;
if (disposition && /filename=.*/ig.test(disposition)) {
result = disposition.match(/filename=.*/ig);
return decodeURI(result[0].split('=')[1]);
}
return null;
}
function downloads() {
var url = '/down_excel';
var xhr = new XMLHttpRequest();
xhr.open('GET', url, true); // 也可以使用POST方式,根据接口
xhr.responseType = "blob"; // 返回类型blob
// 定义请求完成的处理函数,请求前也可以增加加载框/禁用下载按钮逻辑
xhr.onload = function () {
// 请求完成
if (this.status === 200) {
// 返回200
var blob = this.response
var filenames = fileNameFromHeader(xhr.getResponseHeader('Content-Disposition'));
var reader = new FileReader();
reader.readAsDataURL(blob); // 转换为base64,可以直接放入a表情href
reader.onload = function (e) {
// 转换完成,创建一个a标签用于下载
var a = document.createElement('a');
a.download = filenames.slice(1,filenames.length-1); //'data.xlsx';
a.href = e.target.result;
$("body").append(a); // 修复firefox中无法触发click
a.click();
$(a).remove();
}
}
};
// 发送ajax请求
xhr.send()
}
</script>
注:此代码只是个人根据当时的环境满足了当时的需求,记录下来用做后续参考!如有问题,请检查软硬件环境是否一致,由于时间精力有限,大部分未做详细环境描述。
发布者:全栈程序员栈长,转载请注明出处:https://javaforall.cn/134693.html原文链接:https://javaforall.cn
相关文章
- 如何用 JavaScript 下载文件
- 使用 JavaScript 下载文件
- 【说站】javascript创建对象的方法
- 前端必读:如何在 JavaScript 中使用SpreadJS导入和导出 Excel 文件
- JavaScript案例:仿京东显示密码
- 新的一年,建议尝试下这7个JavaScript 库
- WordPress 教程:如何正确引用 JavaScript 和 CSS 文件
- 使用原生 JavaScript 在页面加载完成后处理多个函数
- 在JavaScript文件中读取properties文件的方法详解编程语言
- Javascript写入txt和读取txt文件示例详解编程语言
- 将JavaScript文件存入Redis缓存(把js文件写入redis)
- 用JavaScript获取网页中的js、css、Flash等文件
- Javascript----文件操作
- javascript下过滤数组重复值的代码
- javascript表单中浏览文件的“浏览”按钮修改
- JavaScript正则表达式之RegExp属性、方法及应用分析
- JavaScript设计模式富有表现力的Javascript(一)
- javascript保存文件到本地实现方法
- javascript文件的同步加载与异步加载实现原理
- 使用GruntJS链接与压缩多个JavaScript文件过程详解
- JAVASCRIPT模式窗口中下载文件无法接收iframe的流
- 利用noesis.Javascript开源组件.Net中执行javascript脚本
- 利用javascript判断文件是否存在
- Javascript自定义函数判断网站访问类型是PC还是移动终端
- JavaScript中的数学运算介绍