Ajax Post 下载文件
Ajax Post 下载文件
通过原生js实现
function ajaxPostDownload(url,fileName,callback) {
let xhr = new XMLHttpRequest();
xhr.open('POST', url, true);
xhr.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
xhr.setRequestHeader("accessToken",session.get('accessToken'));
xhr.responseType = "blob"; //返回类型blob
xhr.onload = function () { //定义请求完成的处理函数
try {
if (this.status === 200) {
// console.log(this.response.type);
// 获取响应头部
// let fn=this.getResponseHeader("Content-Disposition");
let blob = this.response;// 后端注意设置Content-Type，否则某些浏览器不支持下载
let reader = new FileReader();
reader.readAsDataURL(blob); // 转换为base64，可以直接放入a标签href
reader.onload = function (e) {
var a = document.createElement('a'); // 转换完成，创建一个a标签用于下载
a.download = fileName;
a.href = e.target.result;
$("body").append(a); // 修复firefox中无法触发click
a.click();
$(a).remove();
}
}else if(this.status === 504){
messageError('文件下载失败：超时');
}else{
messageError('文件下载失败，状态码：'+this.status);
}
}catch (e){
messageError('下载错误：'+JSON.stringify(e))
}finally {
if (callback){
callback();
}
}
};
xhr.send();
}
调用
let url="";
let fileName="abc.png";
ajaxPostDownload(url,fileName,function(){
//下载完成后得操作，可以没有
})
基于原生js编写，适用绝大部分H5应用
地址：https://www.leftso.com/article/1113.html
相关阅读
Ajax Post 下载文件通过原生js实现function ajaxPostDownload(url,fileName,callback) {
let xhr = new XMLHt...
summernote 粘贴图片上传到服务器以下为关键代码//初始化富文本
$('#description').summernote('destroy');
...
javascript（js）onclick 传递多个字符变量参数<a title="点击下载附件" onclick="downloadFile(\''+row.url+'\',\''+ro...
Bootstrap Table 后端分页详解防坑$('#tableId').bootstrapTable({
method:'post',//请求方法
url:'',//后台地址
p...
情况说明webstorm 源文件中文显示乱码，同样版本的代码文件再git服务器显示正确
通常使用普通的资源可以通过Cache-Control配置通知浏览器进行缓存，但是有些小站没有cdn资源，用了外站的cdn资源，速度一般又想提升用户体验,ServiceWorker缓存就有用武之地了。
CKEditor 5 不重新构建移除某个plugin控件组件参考代码：ClassicEditor
.create( document.querySelector...
热门文章
最新发布：