vue 用axios实现调用接口下载excel
了解的方式有两种:
1. 用a标签,href设置为后端提供的excel接口
<a href="excel接口">导出</a>
简单方便,缺点就是当有token校验时,不适合
2. 用axios
把token放在请求的header里边
import axios from 'axios'
import { getToken } from 'js-cookie'; methods: {
exportExcel () {
let url = 'http...',
token = getToken();
axios.get(url, {
headers:{
"Admin_token":token
},
responseType: 'blob', //二进制流
}).then(function (res) {
if(!res) return
let blob = new Blob([res.data], {type: 'application/vnd.ms-excel;charset=utf-8'})
let url = window.URL.createObjectURL(blob);
let aLink = document.createElement("a");
aLink.style.display = "none";
aLink.href = url;
aLink.setAttribute("download", "excel.xls");
document.body.appendChild(aLink);
aLink.click();
document.body.removeChild(aLink);
window.URL.revokeObjectURL(url);
}).catch(function (error) {
console.log(error)
});
}
}
注:如果上面的方法还是乱码,请尝试一下方法:
1.如果装了mockjs,把mockjs去掉
2.使用原生的js请求
参考:https://blog.csdn.net/xuesheng1610748/article/details/83865679
vue 用axios实现调用接口下载excel的更多相关文章
- 前端调用后端接口下载excel文件的几种方式
今天有一个导出相应数据为excel表的需求.后端的接口返回一个数据流,一开始我用axios(ajax类库)调用接口,返回成功状态200,但是!但是浏览器没有自动下载excel表,当时觉得可能是ajax ...
- vue 利用axios请求接口下载excel
一般有三种方法: 方法一: 通过a标签下载 // href为文件的存储路径或者地址,download为问文件名 <a href="/images/download.jpg" ...
- VUE 使用axios请求第三方接口数据跨域问题解决
VUE是基于node.js,所以解决跨域问题,设置一下反向代理即可. 我这里要调用的第三方接口地址为 http://v.juhe.cn/toutiao/index?type=top&key=1 ...
- vue 文件下载(需调用接口)
methods:{ //下载文件 filerightDown(index,fileName) {//index 接口参数 fileName文件名字 var _this = this; var file ...
- vue使用axios访问后台接口
链接1:https://segmentfault.com/a/1190000012635783#item-2 // axios 使用post方式传递参数,后端接受不到,怎么解决 链接2:http ...
- 前端axios下载excel(二进制)
需求:通过后端接口下载excel文件,后端没有文件地址,返回二进制流文件 实现:axios(ajax类似) 主要代码: axios:设置返回数据格式为blob或者arraybuffer 如: var ...
- 前端axios下载excel,并解决axios返回header无法获取所有数据的问题
需求:通过后端接口下载excel文件,后端没有文件地址,返回二进制流文件 实现:axios(ajax类似) 主要代码: axios:设置返回数据格式为blob或者arraybuffer 如: var ...
- vue搭配axios踩坑
客户端项目中有一个小需求“我的卡券”,有单独入口,所以综合考虑之后,采用了vue来实现,因为是初次使用,导致了选型不当,先用了SUI-Mobile来搭建页面,当决定使用vue的时候,页面也搭建完毕了, ...
- vue中axios调用接口和用node.js跨域
<script>const API_PROXY = 'https://bird.ioliu.cn/v1/?url='import axios from 'axios'export defa ...
随机推荐
- IIS调用批处理权限的处理[转]
最近公司希望将Windows 2003升级为Windows 2008,做完安全设置后发现.net调用批处理拒绝访问的情况.网上很多说更改应用程序池的权限,建议不需要修改该权限,我这里强烈建议使用默认的 ...
- iOS播放视频
1.首先导入 MediaPlayer import MediaPlayer 2.播放事件 class ViewController:UIViewController{ var pc:MPMoviePl ...
- Mina2中IoService
Apache MINA 2 是一个开发高性能和高可伸缩性网络应用程序的网络应用框架.它提供了一个抽象的事件驱动的异步 API,可以使用 TCP/IP.UDP/IP.串口和虚拟机内部的管道等传输方式. ...
- vector向量容器元素排序与查找
1.利用标准库函数sort()对vector进行排序 参考源码: #include <algorithm> #include <vector> vector<int> ...
- DCloud:目录
ylbtech-DCloud:目录 1.返回顶部 1.5+ App开发入门指南 http://ask.dcloud.net.cn/article/89 2. 3. 2.返回顶部 3.返回顶部 ...
- C++11 auto和decltype推导规则
VS2015下测试: decltype: class Foo {}; int &func_int_r(void) { int i = 0; return i; }; int && ...
- pos机的热敏纸尺寸
57x50或者是57x30,两个型号宽度都是一样的,只是厚度不一样,前者是厚一点,适合固定机用,后者适合移动POS机用 厚度不是指纸的厚度,而是纸的容量,移动机的纸槽较小只能用57X30的
- delphi 安卓配置教程
本教程以 delphi 10.2.2.2004 为例,演示 delphi 安卓配置步骤 1.打开 Android Tools 2. 选择合适的版本.比如:我的小米4 LTE 是 andorid 6.0 ...
- Shell编程进阶 1.7 case选择
逻辑判断的格式 vim case.sh #!/bin/bash read -p "please input a number:" n m=$[$n%] case $m in ) e ...
- H.264学习笔记
1.帧和场的概念 视频的一场或一帧可用来产生一个编码图像.通常,视频帧可以分成两种类型:连续或隔行视频帧.我们平常看的电视是每秒25帧,即每秒更换25个图像,由于视觉暂留效应,所以人眼不会感到闪烁.每 ...