背景
項目上需要用到多語言，項目設計語言選擇是通過header傳遞的，如果直接用平時location.href下載并無法實現(xiàn)這個效果采幌，然后在網(wǎng)上查閱了一些資料，可以通過流處理來實現(xiàn)下載宝惰，代碼如下
downloadFile(){
let timestamp = new Date().getTime(); //時間戳
let url =XXXXXXXXXXXX;
let xmlResquest = new XMLHttpRequest();
xmlResquest.open("GET", url, true);
xmlResquest.setRequestHeader("Authorization", "bearer" + this.token); //token驗證
xmlResquest.responseType = "blob";
xmlResquest.onload = function(oEvent) { //接口響應后的處理
var content = xmlResquest.response; // 組裝a標簽
let elink = document.createElement("a");// 設置下載文件名
elink.download = "track-kml-" + timestamp + ".kml";
elink.style.display = "none";
let blob = new Blob([content]);
elink.href = URL.createObjectURL(blob);
document.body.appendChild(elink);
elink.click();
document.body.removeChild(elink);
URL.revokeObjectURL(blob); //釋放對象
};
xmlResquest.send();
}
本著不懂就學的原則植榕，查閱了部分不懂的方法再沧，以下資料來源MDN
URL.createObjectURL
URL.createObjectURL() 靜態(tài)方法會創(chuàng)建一個 DOMString尼夺，其中包含一個表示參數(shù)中給出的對象的URL。這個 URL 的生命周期和創(chuàng)建它的窗口中的 document 綁定炒瘸。這個新的URL 對象表示指定的 File 對象或 Blob 對象淤堵。
內(nèi)存管理
在每次調(diào)用 createObjectURL() 方法時，都會創(chuàng)建一個新的 URL 對象顷扩，即使你已經(jīng)用相同的對象作為參數(shù)創(chuàng)建過拐邪。當不再需要這些 URL 對象時，每個對象必須通過調(diào)用 URL.revokeObjectURL() 方法來釋放隘截。瀏覽器會在文檔退出的時候自動釋放它們扎阶，但是為了獲得最佳性能和內(nèi)存使用狀況，你應該在安全的時機主動釋放掉它們婶芭。
XMLHttpRequest.responseType
XMLHttpRequest.responseType 屬性是一個枚舉類型的屬性东臀，返回響應數(shù)據(jù)的類型。它允許我們手動的設置返回數(shù)據(jù)的類型犀农。如果我們將它設置為一個空字符串惰赋，它將使用默認的"text"類型。
在工作環(huán)境(Work Environment)中將responseType的值設置為"document"通常會被忽略. 當將responseType設置為一個特定的類型時呵哨，你需要確保服務器所返回的類型和你所設置的返回值類型是兼容的赁濒。那么如果兩者類型不兼容呢?恭喜你轨奄，你會發(fā)現(xiàn)服務器返回的數(shù)據(jù)變成了null，即使服務器返回了數(shù)據(jù)拒炎。還有一個要注意的是挪拟，給一個同步請求設置responseType會拋出一個InvalidAccessError 的異常。
responseType支持以下幾種值：
| 值 | 描述 |
|---|---|
| "" | 將 responseType 設為空字符串與設置為"text"相同击你， 是默認類型 （實際上是 DOMString）舞丛。 |
| "arraybuffer" | response 是一個包含二進制數(shù)據(jù)的 JavaScript ArrayBuffer 。 |
| "blob" | response 是一個包含二進制數(shù)據(jù)的 Blob 對象 果漾。 |
| "document" | response 是一個 HTML Document 或 XML XMLDocument 球切，這取決于接收到的數(shù)據(jù)的 MIME 類型。請參閱 HTML in XMLHttpRequest 以了解使用 XHR 獲取 HTML 內(nèi)容的更多信息绒障。 |
| "json" | response 是一個 JavaScript 對象吨凑。這個對象是通過將接收到的數(shù)據(jù)類型視為 JSON 解析得到的。 |
| "text" | response 是包含在 DOMString 對象中的文本户辱。 |
| "moz-chunked-arraybuffer" |
與"arraybuffer"相似鸵钝，但是數(shù)據(jù)會被接收到一個流中。使用此響應類型時庐镐，響應中的值僅在 progress 事件的處理程序中可用恩商，并且只包含上一次響應 progress 事件以后收到的數(shù)據(jù)，而不是自請求發(fā)送以來收到的所有數(shù)據(jù)必逆。
在 progress 事件處理時訪問 response 將返回到目前為止收到的數(shù)據(jù)怠堪。在 progress 事件處理程序之外訪問， response 的值會始終為 null 名眉。|
|"ms-stream" |response 是下載流的一部分粟矿；此響應類型僅允許下載請求，并且僅受Internet Explorer支持损拢。|
