前端 下载流文件的方法

一、location.herf
对于一些浏览器无法识别的,可以直接再浏览器地址栏输入url即可触发浏览器的下载功能。对于单文件下载没有什么问题，但是如果下载多文件，点击过快就会重置掉前面的请求。
window.location.href=url

二、window.open
和location.href一样
window.open(url)

三、a标签下载
直接下载仅适用于浏览器无法识别的文件。如果是浏览器支持的文件格式，如html、jpg、png、pdf等，则不会触发文件下载，而是直接被浏览器解析并展示，这种情况下，可以使用a标签下载文件，download属性可以设置文件名。适用于单文件下载，如果下载多文件，点击过快就会重置掉前面的请求。

function downloadFn(url, fileName, params){
return Axios({
    method:'POST/get',
    url,
    headers:{
        Authorization:localStorage.getItem('token')
    },
    responseType: 'blob',
    data:params
}).then(res =>{
    const blob = new Blob([res])
    if (window.navigator.msSaveBlob){
         navigator.msSaveBlob(blob,fileName+'.xlsx')
    } else {
        let href = URL.createObjectURL(blob)
        const a = document.createElement('a')
        a.style.display = 'none'
        a.href= href
        a.download  = fileName + '.xlsx'
        a.click()
        URL.revokeObjectURL(href)
    }

})
}

注意：有时候对于浏览器可识别的文件格式，我们还是需要直接下载的情况，可以声明一下文件的header的 Content-Disposition信息，告诉浏览器，该链接为下载附件链接，并且可以声明文件名。

Content-Disposition：: attachment; filename="filename.xls"

拿取响应中Content-Disposition的文件名

let fileName = (res.headers['content-disposition'].split("="))[1]