解決使用$.ajax的時候獲得返回亂碼

場景:原本是一個文件下載接口,由於需求是要在新窗口中打開而不是下載,因此使用$.ajax去請求,能夠獲得文件的文本內容,不過內容中的中文所有都是亂碼。下面給出使用$.ajax時的代碼(不全):html

$.ajax({
    type: 'get',
    url: targetUrl,
    complete : function(xhr,status){                         //請求完成後最終執行參數
    if(status === 'success') {
        var respContentType = xhr.getResponseHeader('Content-Type');    //這裏獲得的是'text/html'
        var respText = xhr.responseText;                 //此處獲得的字符串中的中文爲亂碼
    }
  }
})

分析緣由:首先觀察控制檯的返回值,在network中發現response中的文本沒有出現亂碼,放回的html文本中meta的charset爲 'GB2312',而preview中顯示出現了問題,並且直接在瀏覽器中打開這個路徑的時候下載獲得的文件也是沒有亂碼的,返回的請求頭的contentType爲 'text/html',這裏沒有指定編碼格式,因此感受是返回的時候由於沒有指定編碼格式,因此ajax使用了utf-8處理了。ajax

解決方案:嘗試使用xmlHttpRequest來發送請求,代碼以下:瀏覽器

function xhrLoadText(url, onSuccess, onFailure) {
    onSuccess = onSuccess || function _onSuccess(data) {};
    onFailure = onFailure || function _onFailure() {};
    var xhr = new XMLHttpRequest();
    xhr.open('GET', url, true);
    if (xhr.overrideMimeType) {
      xhr.overrideMimeType('text/html; charset=GB2312');     // 關鍵是這裏
    }
    xhr.onreadystatechange = function () {
      if (xhr.readyState == 4) {
        if (xhr.status == 200 || xhr.status === 0) {
          onSuccess(xhr.responseText);
        } else {
          onFailure();
        }
      }
    };
    xhr.onerror = onFailure;
    xhr.ontimeout = onFailure;
    try {
      xhr.send(null);
    } catch (e) {
      onFailure();
    }
  }

這裏對overrideMimeType作一下說明:XMLHttpRequest 的 overrideMimeType 方法是指定一個MIME類型用於替代服務器指定的類型,使服務端響應信息中傳輸的數據按照該指定MIME類型處理。例如強制使流方式處理爲"text/xml"類型處理時會被使用到,即便服務器在響應頭中並無這樣指定。此方法必須在send方法以前調用方爲有效。(https://developer.mozilla.org...服務器

使用上面的函數,發現問題獲得解決。ide

相關文章
相關標籤/搜索