怎么用ajax下载文件

可能大家都觉得没有必要用ajax来下载东西,用window.open(url)就可以搞定

但是这有一个问题,就是这就限定了只能用GET方式来请求了;

可能你又会说GET很符合REST的要求呀。

但是如果你用jwt来做身份验证呢?

这意味着你需要在Window.open时带上自定义的Request Header,这就无解了

所以今天来介绍一下怎么用ajax来下载文件

 1 let xhr = new XMLHttpRequest()
 2 xhr.open(‘GET‘, ‘http://www.xxx.com/bbb.zip‘, true)
 3 // 这部至关重要,命令xhr返回给你的时blob(二进制大对象)类型的数据
 4 xhr.responseType = ‘blob‘
 5 xhr.send()
 6 xhr.onreadystatechange = function () {
 7   if (xhr.readyState === 4 && xhr.status === 200) {
 8     const aTag = document.createElement(‘a‘)
 9     aTag.href = URL.createObjectURL(this.response)
10     aTag.download = ‘aaa.zip‘
11     aTag.click()
12   }
13 }

原文地址:https://www.cnblogs.com/amiezhang/p/9984557.html

时间: 2024-10-09 08:49:59

怎么用ajax下载文件的相关文章

如何用ajax下载文件

引子 在HTML5没来之前,浏览器想要下载文件,可能有这么几种方式: 借助a标签,<a href="学习资料.xlsx"></a> window.location = '学习资料.xlsx' 借助浏览器插件,如flash等(没考证过) 除了第三外,前两种方法有个缺点,就是无法知道下载是否完成,因为浏览器没有给出相关的事件.但是,自从有了Blob,fetch, xhr2这些好用的API之后,ajax下载文件(小文件)就变得可行了,核心原因就在于Blob和Array

ajax 下载文件

原本现在文件直接通过超链接可以完成下载,但现在要在url中附带几个参数,并且这些参数要是点击事件触发时的最新值,所以这里使用ajax的方式进行下载 然而: 1.使用ajax,ajax的返回值类型是json,text,html,xml类型,或者可以说ajax的发送,接受都只能是string字符串,不能流类型,所以无法实现文件下载,强用会出现response冲突. 如果非要使用ajax的话,只能通过返回值得到生成的文件相关url.然后在回调函数里通过创建一个iframe,并设置其src值为文件url

用ajax下载字节流形式的excel文件

原因:ajax请求只是个“字符型”的请求,即请求的内容是以文本类型存放的.文件的下载是以二进制形式进行的,ajax没法解析后台返回的文件流,所以无法处理二进制流response输出来下载文件. 解决方法:使用form表单提交实现文件下载 1,后台代码实现方法: // 生成excel文件 @RequestMapping(value = "/study", method = RequestMethod.POST) public void study(@RequestBody ParamVO

ajax请求不能下载文件(转载)

最近在做文件下载,后台写了个控制层,直接走进去应该就可以下载文件,各种文件图片,excel等 但是起初老是下载失败,并且弹出下面的乱码: 前台请求代码: [html] view plain copy $('#fileexcel').unbind('click').bind('click',function(){ alert("我要下载了"); $.ajax({ type:'post', url:'media', data:null, async:true, success : func

SpringMVC 避免IE执行AJAX时,返回JSON出现下载文件

<?xml version="1.0" encoding="UTF-8"?> <!-- SpringMVC配置文件 --> <beans xmlns="http://www.springframework.org/schema/beans" xmlns:p="http://www.springframework.org/schema/p" xmlns:xsi="http://www.w3

ajax请求过程中下载文件在火狐下的兼容问题

项目中碰到的问题,记录如下. 需求很简单,点击一个文件链接下载该文件,同时向后台发送请求.需求很常见,用户点击下载后通常要进行下载量的统计,统计的话可以利用 script标签 或者 img标签(图片ping) 的跨域能力,将它们的 src 属性指向统计地址,但是这次用了 ajax 进行统计,遂出现了这个问题. demo 代码如下: 复制代码<a id="a" href="http://c758482.r82.cf2.rackcdn.com/Sublime Text 2.

下载文件:AJAX下载效果

//下载 function Download(id) { var form = $("<form>"); //定义一个form表单 form.attr('style', 'display:none'); //在form表单中添加查询参数 form.attr('target', ''); form.attr('method', 'post'); form.attr('action', "/task/DetailDownload"); var input1

JS实现点击按钮,下载文件

PS:本文说的,并非如何用js创建流.创建文件.实现下载功能. 而是说的:你已知一个下载文件的后端接口,前端如何请求该接口,实现点击按钮.下载文件到本地.(可以是zip啦.excel啦都是一样) 有两个方法:window.open()和通过form表单来提交. 在线例子:https://hamupp.github.io/gitblog/app/jsBasic/jsButtonDownloadFile/index.html 方法一:window.open("下载文件的后端接口"); *h

HttpServletResponse设置下载文件

// path是指欲下载的文件的路径.            File file = new File(path);            // 取得文件名.            String filename = file.getName();            filename = URLEncoder.encode(filename,"UTF-8");            // 以流的形式下载文件.            InputStream fis = new Buf