1. 現(xiàn)在后端請(qǐng)求數(shù)據(jù)后,返回了一個(gè)二進(jìn)制的數(shù)據(jù),我們要把它下載下來(lái)。
這是響應(yīng)的數(shù)據(jù):
2. 這是調(diào)用接口的地方:
uploadOk(){
if(this.files.length === 0){
return this.$Message.warning("請(qǐng)選擇上傳文件?。?!")
}
let formData = new FormData();
formData.append("file", this.files[0]); // 文件對(duì)象
Api.uploadQuery(formData).then(response=>{
// 文件的下載
const blob = new Blob([response], {'content-type': "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet",})
saveAs(blob, "表格的名字.xlsx")
})
})
},
?使用了file-saver插件:github地址
3. 這時(shí)如果直接下載的話,打開(kāi)文件就會(huì)失敗
4. 這時(shí)就必須要在調(diào)接口的時(shí)候做一下處理
uploadQuery(data){
return fetch({
url: "/fast-finance-core-service/mm/insurance/pay/uploadQuery",
method: "POST",
headers: {
"Content-Type": "multipart/form-data",
dataType: "file"
},
responseType: 'arraybuffer', // 這一行必須要加,不然文件就打不開(kāi)
data
});
}
responseType: 'arraybuffer', 這個(gè)必須要加?。?!
5. 然后刷新,重新下載就可以了
效果:文章來(lái)源:http://www.zghlxwxcb.cn/news/detail-762763.html
文章來(lái)源地址http://www.zghlxwxcb.cn/news/detail-762763.html
?如果還沒(méi)解決的話,建議看一下這篇文檔 文章
到了這里,關(guān)于解決前端二進(jìn)制流下載的文件(例如:excel)打不開(kāi)的問(wèn)題的文章就介紹完了。如果您還想了解更多內(nèi)容,請(qǐng)?jiān)谟疑辖撬阉鱐OY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章,希望大家以后多多支持TOY模板網(wǎng)!