前端文件流下载

时间:2025-04-04 20:10:34

一、在vux中使用了 Axios 后,后端返回来的是文件流 这里我们可以直接用 Axios 方法返回的 res 赋值到 blob

需要注意和后端发起请求的时候 responseType 需要是 ‘blob’

		const blob = res
        const reader = new FileReader()
        (blob)
         = function (ev) {
          if () {
            // 兼容ie11
            const blobObject = new Blob([blob])
            (blobObject, '文件名称.xlsx')
          } else {
            const url = (new Blob([blob]))
            const a = ('a')
            (a) // 此处增加了将创建的添加到body当中
             = url
             = '文件名称名称.xlsx'
             = '_blank'
            ()
            () // 将a标签移除
          }
        }

二、使用原生的 XMLHttpRequest 文件流下载

  1. xhr.setRequestHeader(‘token’,‘token’); // 在headers加参方法
var url = ‘请求接口链接’
const xhr = new XMLHttpRequest()
        ('GET', url)
         = 'blob'
         = function () {
          const blob = 
          const reader = new FileReader()
          (blob)
           = function (ev) {
              if(){
                // 兼容ie11
                let blobObject = new Blob([blob]);
                (blobObject, '文件名称名称.xlsx');
              }else{
                let url = (new Blob([blob]));
                let a = ('a');
                (a); //此处增加了将创建的添加到body当中
                 = url;
                 = '文件名称名称.xlsx';
                 = '_blank';
                ();
                (); //将a标签移除
              }
          }
        }
         = function () {
          ('could not download file')
        }
        ()