前端文件下载---后端返回文件流类型

后端返回文件流类型,前端下载要进行处理,处理代码如下:

import request from '@/router/axios';
//将后台返回的文件流做处理,导出excel
            exportSearchList(url,name,params,time,type) {
            request({
                method: type,
                url: url,
                data:params,//post请求 
                // params,//get请求
                responseType: "arraybuffer"
            }).then(function(res){
            console.log("返回的二进制流文件", res)
            if(!res) return;
            //fileName:下载的文件名
            // let currentData=timeFormat(new Date())
            var fileName = name+time
            let blob = new Blob([res], {type: 'application/vnd.ms-excel;charset=utf-8'});
        
            // 针对ie浏览器
            if (window.navigator && window.navigator.msSaveOrOpenBlob) {
                window.navigator.msSaveOrOpenBlob(blob, fileName);
                } else {
  • 0
    点赞
  • 12
    收藏
    觉得还不错? 一键收藏
  • 4
    评论
后端返回文件后,前端可以通过以下几种方式实现文件下载导出: 1. 使用`<a>`标签的`download`属性:可以在前端创建一个`<a>`标签,将后端返回文件作为链接的`href`属性值,并设置`download`属性为文件名,这样点击该链接时,浏览器会自动下载文件。 ```html <a href="后端返回文件URL" download="文件名">点击下载</a> ``` 2. 使用`window.open()`方法:可以使用JavaScript的`window.open()`方法打开一个新的窗口,并将后端返回文件URL作为参数传递给该方法,浏览器会自动下载文件。 ```javascript window.open("后端返回文件URL"); ``` 3. 使用`XMLHttpRequest`对象:可以使用JavaScript的`XMLHttpRequest`对象发送GET请求,将后端返回文件作为响应内容,然后通过创建`Blob`对象和`URL.createObjectURL()`方法将文件转换为可下载的URL,最后使用`<a>`标签的`download`属性进行下载。 ```javascript var xhr = new XMLHttpRequest(); xhr.open("GET", "后端返回文件URL", true); xhr.responseType = "blob"; xhr.onload = function() { if (xhr.status === 200) { var blob = xhr.response; var url = URL.createObjectURL(blob); var a = document.createElement("a"); a.href = url; a.download = "文件名"; a.click(); } }; xhr.send();``` 请注意,以上方法中的"后端返回文件URL"需要替换为实际的后端返回文件的URL,"文件名"需要替换为实际的文件名。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 4
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值