axio请求里必须加  responseType: 'blob' 参数,如下

//下载文件
api.download=function(id) {
return request({
url: this.baseUrl+'/download/'+id,
method: 'get',
params: {},
responseType: 'blob'
})
}

  

返回结果里面要做如下处理

.then( res => {
let blob = new Blob([res], {type: res.type})
let downloadElement = document.createElement('a')
let href = window.URL.createObjectURL(blob); //创建下载的链接
downloadElement.href = href;
downloadElement.download = fileName; //下载后文件名
document.body.appendChild(downloadElement);
downloadElement.click(); //点击下载
document.body.removeChild(downloadElement); //下载完成移除元素
window.URL.revokeObjectURL(href); //释放blob对象 })

  

axios 下载文件的更多相关文章

  1. vue+axios下载文件的实现

    HTML代码: <el-button size="medium" @click="download">下载表格</el-button> ...

  2. vue element之axios下载文件(后端Python)

    axios 接受文件流,需要设置 {responseType:'arraybuffer'} axios.post( apiUrl, formdata, {responseType:'arraybuff ...

  3. ajax axios 下载文件时如何获取进度条 process

    最近项目需要做一个下载文件的进度条,看网上上传文件进度条下载,特分享出来方便大家查阅 <!DOCTYPE html> <html> <head>     <m ...

  4. vue中使用axios下载文件,兼容IE11

    一.设置axios返回值为blob 二.使用a标签的down属性下载,如果是IE浏览器,可以使用navigator.msSaveBlob进行下载 // data的数据类型是blob downloadF ...

  5. axios下载文件乱码问题 无法解压 文件损坏

    /* 下载附件 */ downloadFile(fileName) { // window.open(url); var that = this; var url = "PO2116&quo ...

  6. vue+axios+elementUI文件上传与下载

    vue+axios+elementUI文件上传与下载 Simple_Learn 关注  0.5 2018.05.30 10:20 字数 209 阅读 15111评论 4喜欢 6 1.文件上传 这里主要 ...

  7. axios 利用new FileReader() 下载文件获取返回的错误信息

    this.axios({           method: "post",           url: url,           data: data,           ...

  8. vue axios post请求下载文件,后台springmvc完整代码

     注意请求时要设置responseType,不加会中文乱码,被这个坑困扰了大半天... axios post请求:     download(index,row){         var ts =  ...

  9. axios通过post请求下载文件/图片

    我们平常下载文件一般都是通过get请求直接访问进行下载, 但是当有特殊情况如权限控制之类的会要求我们通过post请求进行下载,这时就不一样了, 具体方法是通过协调后端,约定返回的文件流,请求的resp ...

随机推荐

  1. cf1207解题报告

    cf1207解题报告 A 模拟 #include <bits/stdc++.h> #define ll long long using namespace std; ll T,a,b,c, ...

  2. A1083 List Grades (25 分)

    Given a list of N student records with name, ID and grade. You are supposed to sort the records with ...

  3. Vue实际中的应用开发【分页效果与购物车】

    作者 | Jeskson 来源 | 达达前端小酒馆 分页组件 首先来创建项目: 分页组件,做项目不要写动手写代码,要想想业务逻辑,怎么写,如何写才是最好的呈现方式,做项目不急,要先想好整体的框架,从底 ...

  4. Spring Cloud Gateway 结合配置中心限流

    前言 上篇文章我讲过复杂的限流场景可以通过扩展RedisRateLimiter来实现自己的限流策略. 假设你领导给你安排了一个任务,具体需求如下: 针对具体的接口做限流 不同接口限流的力度可以不同 可 ...

  5. 基于sign的pose-graph残差函数构建

    沿sign的法线方向优化车辆位姿,优化目标函数也即残差函数构建过程如下:

  6. C# HTTP系列6 HttpWebResponse.StatusCode 响应代码中文详解

    系列目录     [已更新最新开发文章,点击查看详细] 1xx - 信息提示 这些状态代码表示临时的响应.客户端在收到常规响应之前,应准备接收一个或多个 1xx 响应 · 100 - Continue ...

  7. AngularJS入门Demo

    1 :表达式 <html> <head> <title>入门小Demo-1</title> <script src="angular.m ...

  8. 异步IO与回调

    最好了解 Java NIO 中 Buffer.Channel 和 Selector 的基本操作,主要是一些接口操作,比较简单. 本文将介绍非阻塞 IO 和异步 IO,也就是大家耳熟能详的 NIO 和 ...

  9. 【转】.Net程序员学习Linux最简单的方法

    有很多关于Linux的书籍.博客.大多数都会比较“粗暴“的将一大堆的命令塞给读者,从而使很多.NET程序员望而却步.未入其门就路过了. 所以我设想用一种更为平滑的学习方式, 就是在学习命令时,先用纯语 ...

  10. 我自己收藏的 Windows 上好用的软件

    已经在使用的工具就不会列出来了. 1. 截图 - Snipaste 截图在我们的生活中,可以算的上是非常频繁的操作了,但是很多人是不是都在使用腾讯聊天软件的聊天截图功能,或许是没有一款称心的.安全的截 ...