前端vue 下载文件(后端传给的文件流)

可以使用axios库下载文件流。具体步骤如下:
后端通过URL地址或API接口将文件流传递给前端。
前端使用axios库发送GET请求,获取文件流数据。
在响应拦截器中获取文件流数据,并创建一个Blob对象。
创建一个a标签,设置它的href属性为Blob URL,download属性为文件名,触发点击事件进行下载。

import axios from 'axios';

// 下载文件流
function downloadFile(url) {
  axios({
    method: 'GET',
    url: url,
    responseType: 'blob'
  })
  .then(response => {
    // 获取文件流数据
    const blob = new Blob([response.data]);
    // 创建a标签进行下载
    const link = document.createElement('a');
    link.href = URL.createObjectURL(blob);
    link.download = '文件名';
    document.body.appendChild(link);
    link.click();
    document.body.removeChild(link);
  })
  .catch(error => {
    console.log(error);
  });
}

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容