1. 程式人生 > >利用XMLHttpRequest同步和非同步下載二進位制檔案的解決方案。

利用XMLHttpRequest同步和非同步下載二進位制檔案的解決方案。

在XMLHttpRequest2裡支援二進位制資料的下載了,現分別以同步和非同步兩種方式分別介紹。

非同步的方式下載:

     xmlRequest.open("GET", "0.jpg", true);
     xmlRequest.responseType = "blob";//這裡是關鍵,它指明返回的資料的型別是二進位制
     xmlRequest.onreadystatechange = function(e) {
         if (this.readyState == 4 && this.status == 200) {
             var response = this.response;
             img.src = window.URL.createObjectURL(response);
         }
     }
     xmlRequest.send(null);

同步的方式下載:

    xmlRequest.open("GET", "0.jpg", false);
    xmlRequest.overrideMimeType('text/plain; charset=x-user-defined');//這裡是關鍵,不然 this.responseText;的長度不等於檔案的長度
    xmlRequest.onreadystatechange = function(e) {
    if (this.readyState == 4 && this.status == 200) {
              var text = this.responseText;
              var length = text.length;
              var array = new Uint8Array(length);
              for (var i = 0; i < length; ++i) {
                  array[i] = text.charCodeAt(i);
              }
              var blob = new Blob([array], { "type": "image/jpeg" });
              img.src = window.URL.createObjectURL(blob);
          }
      }
    xmlRequest.send(null);

注意:w3c標準中規定同步的情況下是不能設定responseType屬性的。