Vue 实现下载功能前端改文件类型该如何做

请求回来的数据有name（result.data.name）和url（result.data.url）通过url再去下载文件
获取到url和name之后就直接axios去请求请求成功后台返回文件流

一般的下载都是一个超链接然后点击直接下载好而且还有后缀而我这个是前端改变文件类型和后缀（后台返回的是文件流）

//下载
let url = '/' + result.data.url.split('/').slice(3).join('/');
//console.log(url);
//let urlHost = window.location.host;
//console.log(urlHost);
this.$axios({method: 'get',url: url,responseType: 'arraybuffer'}).then(response => {const url = window.URL.createObjectURL(new Blob([response.data]));const link = document.createElement('a');link.href = url;link.setAttribute('download', result.data.name ); //or any other extensiondocument.body.appendChild(link);link.click();}).catch(() => console.log('error occured'))
}

请求下载成功长这样~

Vue 实现下载功能前端改文件类型该如何做相关推荐

element-ui实现下载动态进度条，可实现批量下载，附Blob文件类型对照表
element-ui实现下载动态进度条,可实现批量下载,附Blob文件类型对照表 ①页面结构使用element-ui的进度条组件,示例为圆形,具体样式根据需求确定 <el-button>下 ...
实战 - 文件上传功能：校验文件类型，文件大小，获取文件真实类型
文件上传的漏洞和防御-设置黑名单和白名单以PHP脚本语言为例,一些文件上传功能实现代码没有严格限制用户上传的文件后缀以及文件类型,导致允许攻击者向某个可通过Web访问的目录上传任意PHP文件,并能够 ...
vue el-upload上传组件限制文件类型：accept属性
el-upload 控件文档 https://element.eleme.cn/#/zh-CN/component/upload accept属性示例 <el-uploadclass=&quo ...
Django2实现word文件的下载功能（docx文件）
详细请参考 Django(12): 实现文件下载的几种方法_python开发笔记的博客-CSDN博客_django实现文件下载只用第三种方法已实现. 前端代码views.py {% load sta ...
简单的前端文件预览下载功能
VUE预览与下载我们大多数的项目中都能用到预览与下载功能(功能比较基础哈,大佬们不要介意)基本逻辑就是后端返回文件的url,前端利用a标签的特性来进行下载这一块就引发了如果遇到**浏览器支持的格式 ...
前端下载 “不支持打开该类型文件或文件已损坏“问题
最开始做下载功能的时候,是模仿项目中已有的写法来实现的,这套模板应该可以适应大多数的下载,网上很多也是这种写法: .then(res => {// res 为调用后端下载接口返回的值const ...
vue前端生成二维码，实现扫码下载功能
vue前端生成二维码,实现扫码下载功能首先需要安装一个插件 npm install --save qrcodejs2 然后在需要的页面引入插件,最后使用 <template><di ...
Excel文档导出-后端返回文件流，前端实现下载功能
最近在做项目的时候遇到Excel导出功能,后端返回的是文件流,前端如何实现下载功能,以下是项目用的源码,有需要可直接复制使用: // 导出exporttable() {this.axios({meth ...
Vue - 超详细 “纯前端“ 将阿里云 OSS 文件删除流程，支持单个 / 批量删除文件（附带完整示例运行源码，保证新手小白 100% 轻松实现删除功能）
前言如果您需要纯前端将文件上传到阿里云 OSS,请访问:Vue - 上传文件到阿里云 OSS 详细教程 / 各种常见问题! 本文站在新手的角度,从 0-1 完成前端 "阿里云oss&quo ...

Vue 实现下载功能前端改文件类型该如何做

Vue 实现下载功能前端改文件类型该如何做相关推荐

最新文章

热门文章

Vue 实现下载功能 前端改文件类型该如何做

Vue 实现下载功能 前端改文件类型该如何做相关推荐

最新文章

热门文章

Vue 实现下载功能前端改文件类型该如何做

Vue 实现下载功能前端改文件类型该如何做相关推荐