問題：后端回傳的失敗 blob 資料流， 前端如何捕獲展示
業務需求，需要后端控制檔案下載頻率，用戶在短時間內不可以重復下載檔案，并回傳訊息提示 (剩余 XX 秒)，前端需要把回傳資料msg訊息展示彈出
資料在瀏覽器的回應里可以看到
但是在列印的 res 中卻找不到對應的msg，也就沒有辦法將對應內容展示出來
解：
原來blob資料回傳的資料無法直接在回傳物件res中獲取，需要將獲取到的物件進行格式轉換，后才能取到其中的后端回傳的訊息，
請求成功發送，在 .then（res => {}）中捕獲要決議的物件 也可以在回應攔截器中做處理，
// 這里是將這部分方法做了封裝
export default exportFile(res) {
// 判斷是否存在要轉換的物件 ，如果可以下載檔案則 res.data.type = application/vnd.ms-excel
? if (res.data.type == 'application/json') { // 下載檔案失敗
? // 實體化 FileReader
? const reader = new FileReader ()
? // 讀取目標物件 res ,結果用字符形式表達
? reader.readAsText(res.data , 'utf-8')
// 讀取完后會獲得 reader.result 要轉化為可讀取的JS物件
read.onload = function() {
? const {msg} = Json.parse(reader.result)
? // 彈出轉換后的 錯誤提示
? Message.waring (msg)
}
return
? }
// 下方為下載方法
// 下載： 獲取檔案名
? let fileName = decodeURIComponent(data.headers['content-disposition'].split('=')[1])
? // 可以獲取當前檔案的一個記憶體URL
? let objectUrl = URL.createObjectURL(new Blob([data.data]))
? // 創建下載
? const link = document.createElement('a')
? link.download = fileName
? link.href = https://www.cnblogs.com/panwudi/archive/2023/02/20/objectUrl
? link.click()
}結果：成功！！
轉載請註明出處，本文鏈接：https://www.uj5u.com/qiye/544494.html
標籤：其他