解決ajax獲取流文件亂碼問題

問題描述
----
開發過程中遇到通過ajax訪問后台獲取圖片驗證碼
接口會返回亂碼
另外下載zip圖片包的時候也是返回一堆亂碼

 

 

一開始采用的方法是通過ajax訪問接口拿到返回的結果，結果是上圖亂碼，后面發現直接在img src屬性里填寫接口就可以直接拿到

但是我們的接口都是經過簽名的，所以最后的方法是將接口地址和參數地址拼接返回，js將src替換成返回的url這個時候就完美的解決了問題

大概的代碼如下

  //獲取圖片驗證碼
  getCodeImg: function(param) {
    //只對type進行簽名，然后進行拼接
    var param = _bale.pack("img", param);
    var parameters = "?";
    for (var key in param) {
      parameters += key + "=" + param[key] + "&";
    }
    parameters = parameters.substr(0, parameters.length - 1);
    //編碼因為paramMap={"type":""}的{}在liunx無法使用
    parameters = encodeURI(parameters);
  var url = _mm.getServerUrl("sso", "");
    return url + "/common/getCodeImg" + parameters;
  }

//請求url
var url = _orderApi.getCodeImg(imgParam);
$("#imgCode").attr("src", url);
 

 

 

另外還有個下載zip壓縮包的功能也是類似

 exportProImg: function(data, resolve, reject) {
    //只對type進行簽名，然后進行拼接
    var param = _bale.pack("exportImg", data);
    var parameters = "?";
    for (var key in param) {
      parameters += key + "=" + param[key] + "&";
    }
    parameters = parameters.substr(0, parameters.length - 1);
    var url = _mm.getServerUrl("upload", "");
    return url + "/upload/exportImg" + parameters;
  }

   //二進制文件打開方式
       var url = _product.exportProImg({ goodsImgs: goodsImgs, goodsCode: this.data.goodsDetails.goodsCode });
   //直接在瀏覽器打開
       window.location.href = url;