没有加token之前,下载文件用的是a标签,直接下载。

现在要求是需要在header中加入token。

 getDownload(urls, fileName) {
var url = urls;
var xhr = new XMLHttpRequest();
xhr.open("get", url, true);
xhr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
xhr.setRequestHeader("access-token", store.state.token.token);
xhr.send();
xhr.responseType = "blob"; // 返回类型blob
xhr.onload = function() {
if (this.status === 200) {
let a = document.createElement("a");
let blob = new Blob([this.response], {
type: "text/csv;charset=GBK;"
});
let objectUrl = URL.createObjectURL(blob);
a.setAttribute("href", objectUrl);
a.setAttribute("download", fileName + ".csv");
a.click();
} else {
alert("出现了未知的错误!");
}
};
},

如图所示,最后解决

需要加token验证的接口返回文件流下载的更多相关文章

  1. webapi返回文件流

    逻辑说明 webapi返回类型为IHttpActionResult接口,内部方法返回HttpResponseMessage. public interface IHttpActionResult { ...

  2. Ajax异步请求返回文件流(eg:导出文件时,直接将导出数据用文件流的形式返回客户端供客户下载)

    在异步请求中要返回文件流,不能使用JQuery,因为$.ajax,$.post 不支持返回二进制文件流的类型,可以看到下图,dataType只支持xml,json,script,html这几种格式,没 ...

  3. 文件下载post请求,返回文件流转换zip,

    最近一个需求是批量下载文件,最后打包成zip包,post请求, 因为是文件流下载,所以在取后台数据的时候,要多传递一个[responseType: ‘blob’]这个参数 download() { t ...

  4. js 前端实现文件流下载的几种方式

    后端是用Java写的一个下载的接口,返回的是文件流,需求:点击,请求,下载 利用iframe实现文件流下载 //把上一次创建的iframe删掉,不然随着下载次数的增多页面上会一堆的iframe var ...

  5. js文件流下载通用方法

    通常我们会用到文件流下载文件,下面给大家一个通用的文件流下载的js /* *下载文件 * options:{ * url:'', //下载地址 * isNewWinOpen:false,是否新窗口打开 ...

  6. js实现使用文件流下载csv文件

    1. 理解Blob对象 在Blob对象出现之前,在javascript中一直没有比较好的方式处理二进制文件,自从有了Blob了,我们就可以使用它操作二进制数据了.现在我们开始来理解下Bolb对象及它的 ...

  7. 文件流下载时 axios blob文件大小不正确?

    文件流下载时 js blob文件大小不正确? res.data的字节长度 length blob.size匹配不上.. axio请求里必须修改 responseType: 'blob' 参数, 默认是 ...

  8. java 后台返回文件流到浏览器

    package com.springbootblog.controller; import io.swagger.annotations.ApiImplicitParam;import io.swag ...

  9. 通过阿里OSS文件服务返回的URL获取文件流下载

    我们都知道将文件上传到阿里的OSS文件服务上后,可以通过generatePresignedUrl(bucketName, key, expiration)方法获取该文件的防问路径,但是当我们知道该文件 ...

随机推荐

  1. 【雕爷学编程】Arduino动手做(49)---有源蜂鸣器模块

    37款传感器与模块的提法,在网络上广泛流传,其实Arduino能够兼容的传感器模块肯定是不止37种的.鉴于本人手头积累了一些传感器和模块,依照实践(动手试试)出真知的理念,以学习和交流为目的,这里准备 ...

  2. 第七篇:wed版语音机器人

    wed版语音机器人: GitHub项目地址:https://github.com/Yang915/WebToy 特别说明:该项目在本机测试,通过浏览器调用系统麦克风(https请求),实际环境在Fir ...

  3. DPDK IP分片及重组库(学习笔记)

    1 前置知识学习 1.1 MTU MTU是最大传输单元( Maximum Transmission Unit)的缩写,指一个接口无需分片所能发送的数据包的最大字节数.  MTU范围在46 ~ 1500 ...

  4. Hbase javaAPI报错:Callexception,tries=10,retries=35,started=38465msago

    [client.RpcRetryingCaller(142)]Callexception,tries=10,retries=35,started=38465msago,cancelled=false, ...

  5. php连接数据库 需要下载adodb

    <?include('adodb/ADOdb.inc.php'); # 加载ADODB$conn = &ADONewConnection('odbc_mssql'); # 建立一个连结$ ...

  6. DFS序--一般都要转化为顶点到每个点

    There is a rooted tree with n nodes, number from 1-n. Root’s number is 1.Each node has a value ai. I ...

  7. python 串口 透传

    python正常情况通过串口 serial  传输数据的时候,都是以字符串的形式发送的 str = ‘abcd’ ser.write(str.encode())#直接发送str报错,需要发送byte类 ...

  8. mysql驱动包

    mysql驱动包和源码下载地址:https://mvnrepository.com/artifact/mysql/mysql-connector-java 下载 mysql-connector-jav ...

  9. day18 迭代器

    1,迭代器协议:对象必须提供一个next方法,执行该方法要么返回迭代中的下一项,要么就引起一个Stoplteration异常,只能往后走不能往前退: 2,可迭代对象:实现了迭代器协议的对象(如何实现: ...

  10. JS 写逻辑判断,不要只知道用 if-else 和 switch

    我们在编写 JS 代码时,经常会遇到逻辑判断复杂的情况.一般情况下,可以用 if/else 或 switch 来实现多个条件判断,但会出现一个问题:随着逻辑复杂度的增加,代码中的 if/else 和 ...