vue下载blob文档流实现过程

cnpm i file-saver --save

//utils/download.js
import Vue from 'vue'
import axios from 'axios'
import { saveAs } from 'file-saver'
import { message } from 'ant-design-vue'

const baseURL = process.env.VUE_APP_BASEURL

// 验证是否为blob格式
async function blobValidate(data) {
    try {
        const text = await data.text();
        JSON.parse(text);
        return false;
    } catch (error) {
        return true;
    }
}



export default {
    name(name, isDelete = false) {
        var url = baseURL + "/common/download?fileName=" + encodeURIComponent(name) + "&delete=" + isDelete
        axios({
            method: 'get',
            url: url,
            responseType: 'blob',//这边很关键，一定要写
            headers: { 'Authorization': 'Bearer ' + Vue.ls.get('token') }
        }).then(async(res) => {
            const isLogin = await blobValidate(res.data);
            if (isLogin) {
                console.log(res);
                const blob = new Blob([res.data])
                this.saveAs(blob, decodeURIComponent(res.headers['download-filename']))
            } else {
                this.printErrMsg(res.data);
            }
        })
    },
    saveAs(text, name, opts) {
        saveAs(text, name, opts);
    }
}

import download from "@/utils/download.js";
//下载详情
methods: {
    handleView(record) {
      download.name(record.reportFilePath);
    },
   }