解決前端利用blob下載csv因?yàn)槎嗾Z(yǔ)言導(dǎo)致亂碼的問(wèn)題

  • 后臺(tái):把文件流獲取成二進(jìn)制形式并用base64加密返回
  • 前端:把返回的二進(jìn)制window.atob(data.content)解密,利用Uint8Array 數(shù)組類(lèi)型(表示一個(gè)8位無(wú)符號(hào)整型數(shù)組)生成blos需要的ArrayBuffer
  • 代碼如下:
downloadFile().then(res => {
    //  base64解碼
    var binaryString = window.atob(res.data.content)
    var len = binaryString.length
    //  Uint8Array: 8位無(wú)符號(hào)整數(shù)值的類(lèi)型化數(shù)組
    var bytes = new Uint8Array(len)
    for (var i = 0; i < len; i++) {
      //  charCodeAt返回字符串第一個(gè)字符的 Unicode 編碼(H 的 Unicode 值):
      bytes[i] = binaryString.charCodeAt(i)
    }
    const blob = new Blob([bytes.buffer], { type: '.csv' })
    if (window.navigator.msSaveOrOpenBlob) {
      navigator.msSaveBlob(blob)
    } else {
      const elink = document.createElement('a')
      elink.download = '123456.csv'
      elink.style.display = 'none'
      elink.href = URL.createObjectURL(blob)
      document.body.appendChild(elink)
      elink.click()
      document.body.removeChild(elink)
    }
})

如有錯(cuò)誤,望請(qǐng)指正。

?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時(shí)請(qǐng)結(jié)合常識(shí)與多方信息審慎甄別。
平臺(tái)聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡(jiǎn)書(shū)系信息發(fā)布平臺(tái),僅提供信息存儲(chǔ)服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容