ajax异步下载文件并判断状态

今日需要对公司的代码进行更新，发现之前有的文件丢失导致下载不到直接跳转到一个空的页面，第一反应是应该没有用异步请求，直接用a标签或者表单之类的处理下载文件请求了。

但是ajax似乎是不支持下载文件的，会把流信息当初文本类处理。。。自然不能还原文件数据。

通过测试发现原生ajax xhlHttpRequest可以处理流信息，具体在于它可以将请求中的数据变成blob对象进行读取（好吧我一个后端的实在是不太清楚前段原理）。。。可以通过判断http的status状态来进行下载文件或者提示错误。

function downloadOnclick() {var file=$("#realr0205").val();var fileName=file;if (file!=undefined&&file!=""&&file.indexOf("/")!=-1){fileName=file.substr(file.lastIndexOf("/")+1);}var url = BASE_PATH+'/manage/filedownload?path='+file;var xhr = new XMLHttpRequest();xhr.open('GET', url, true);        // 也可以使用POST方式，根据接口xhr.responseType = "blob";    // 返回类型blob// 定义请求完成的处理函数，请求前也可以增加加载框/禁用下载按钮逻辑xhr.onload = function () {if (this.status == 200) {var blob = this.response;var reader = new FileReader();reader.readAsDataURL(blob);    // 转换为base64，可以直接放入a表情hrefreader.onload = function (e) {// 转换完成，创建一个a标签用于下载var a = document.createElement('a');a.download = fileName;a.href = e.target.result;$("body").append(a);    // 修复firefox中无法触发clicka.click();$(a).remove();}}else {//此处是前端layiUI自带的提示框，无视即可$.confirm({theme: 'dark',animation: 'rotateX',closeAnimation: 'rotateX',title: false,content: '未找到该文件',buttons: {confirm: {text: '确认',btnClass: 'waves-effect waves-button waves-light'}}});}};xhr.send();
}

参考：https://www.cnblogs.com/cdemo/p/5225848.html

另外网上也有一部分人说此方法不安全之类的，缺少判断，容易被网络攻击，我觉得ajax可以带上token，在http协议中加上header信息那原生xhr应该也可以做到吧，既然能做到带上安全验证信息，在后端验证一下不就行了？

还有一部分人认为这样做太麻烦，直接通过A标签或者表单进行实现，我觉得现在基本上哪个功能都会存在错误，存在错误就会产生意料之外的情况，大大降低用户体验感，所以异步请求加判断才是主流。

下面公司之前写法，怪不得拿不到文件就不知道调到哪个页面了。

jQuery.download = function (url, method, filedir) {jQuery('<form action="' + url + '" method="' + (method || 'post') + '">' +  // action请求路径及推送方法'<input type="text" name="path" value="' + filedir + '"/>' + // 文件路径'</form>').appendTo('body').submit().remove();//var newTab = window.open('about:blank')//newTab.location.href = url;
};

ajax异步下载文件并判断状态相关推荐

异步下载文件 java_在浏览器中异步下载文件监听下载进度
在浏览器中异步下载文件,其实就是把服务器响应的文件先保存在内存中.然后再一次下载到磁盘.第二次下载过程,就是把内存的数据IO到磁盘,没有网络开销.速度极快. 之所以要先保存在内存,主要是可以在下载开始 ...
Demo_C#_Winform Ftp异步下载文件，更新ProgressBar
由于研究Winform项目的版本自动检测更新,需要用到Ftp下载更新包文件. 特写出这个小Demo. 我的Ftp是本地用IIS搭建的FTP服务器,下载过一个1.8G的视频文件,亲测有效. 注意点: F ...
ajax异步上传图片文件并将其转换为base64格式
ajax异步上传图片文件并将其转换为base64格式高级浏览器上面,可以直接使用html5的FileReader,实现获取上传文件的base64格式,并以字符串形式提交.对于IE9以下的浏览器,就得 ...
ajax实现下载文件进度条及方法详解
javascript使用ajax下载文件进度条实现 <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml&qu ...
关于Ajax无法下载文件到浏览器本地的问题(文件下载的几种方式)
最近在做网站的时候遇到这样一个功能,在如图所示的页面中,需要用户点击链接的时候,能够以异步Ajax的方式判断服务器中是否存储有相应的Excel文件,如果没有的话就提示用户没有找到,如果有的话就下载到用 ...
Ajax实现下载文件功能
刚开始学习Asp的时候我们实现下载功能可能是这样 <form id="form1" runat="server">ASP:<asp:Butto ...
Ajax请求导出Excel的问题【ajax不能下载文件】
最近要给后台添加操作日志导出的功能,后台已经生成.xls文件,本来想只要ajax请求下就完事儿,想象总是美好的,可不管我怎么ajax,想了各种可能原因也无法解决. 问题描述前端发送ajax[get/ ...
用JAVA API实现HDFS常用shell命令的功能（新建文件夹，上传文件，下载文件，判断文件是否存在）
新建文件夹 package hdfs.files;import org.apache.hadoop.conf.Configuration; import org.apache.hadoop.fs.Fi ...
js 关于下载文件如何判断是否下载成功
最近在做的一个项目碰到一个问题,就是需要检测什么时候导出成功并根据导出成功进行提示操作.开始是直接使用location.href,但是无法检测到是否下载成功. 经过查找资料下载文件使用iframe可以 ...
ant design pro 实现异步下载文件
直接复制下面函数到antdesign Pro中实现文件下载 /*** 异步文件下载功能* @param url 文件url地址* @param filename 导出的文件名*/ async func ...

ajax异步下载文件并判断状态

ajax异步下载文件并判断状态相关推荐

最新文章

热门文章