https://www.cnblogs.com/webbe...
https://www.zhangxinxu.com/wo...

先分清后端返回文件流還是直接觸發(fā)鏈接就進(jìn)行下載?

如果是直接觸發(fā)鏈接下載的話，那就很簡單了

如果是文件流的話，那就需要前端再做一次處理，才能進(jìn)行下載
我的示例代碼是axios，給你參考一下

1 觸發(fā)下載的接口，要在axios設(shè)置responseType = 'blob'
這個(gè)參考官方文檔https://github.com/axios/axios

2 寫一個(gè)接受文件流的函數(shù)

// 接受后端blob文件流 下載
// blob 文件流 fileName 文件名稱
function downFiles(blob, fileName) {
    let link = document.createElement('a')
    link.href = window.URL.createObjectURL(blob)
    link.download = fileName
    link.click()
    window.URL.revokeObjectURL(link.href)
}
 

3 發(fā)送請(qǐng)求的回調(diào)函數(shù)里，也要做一些處理,比如說我要觸發(fā)xx/down接口

api("down", formData, "post", "blob").then(function(res) {
                let blob = new Blob([res.data], {
                    type: '*'
                })
                let fileName = '交易列表'
                _this.$tool.downFiles(blob, fileName)
                _this.isDown = false
            })