1. 程式人生 > 其它 >後端返回二進位制內容時 $.ajax請求返回亂碼問題

後端返回二進位制內容時 $.ajax請求返回亂碼問題

前端通過jQuery ajax接受後端的檔案流,前端下載檔案後內容亂碼

原因分析:
jQuery ajax response 型別只能是:xml, html,script,json,jsonp,text。 無法接受blob型別的response。 當後端返回給前端一個檔案流的時候,前端ajax會將檔案流轉化成string 型別。 無法正確讀取改檔案流,導致文字內容亂碼。

解決方案:

前端在實現檔案下載功能時,請不要使用ajax請求。我們可以使用XMLHttpRequest來代替ajax, 請看下面的程式碼:

const xhr = new XMLHttpRequest();
xhr.open(
'POST', url, true); //定義responseType='blob', 是讀取檔案成功的關鍵,這樣設定可以解決下載檔案亂碼的問題 xhr.responseType = "blob"; xhr.onload = () => { //'\ufeff' 這個變數是定義字符集為utf-8, 防止中文亂碼的問題。 // {type: 'application/msword'} 根據文件型別來定義這個type。MIMA type const blob = new Blob(["\ufeff", xhr.response], {type: 'application/msword'});
const blobUrl = URL.createObjectURL(blob); const a = document.createElement('a'); a.style.display = 'none'; a.href = blobUrl; a.target = '_blank'; a.click(); } }; xhr.send(null);