1. 程式人生 > >Ajax請求下載檔案

Ajax請求下載檔案

以前我這樣做,現在感覺很low:

window.location.href = "http://127.0.0.1:8080/wx-sr-api/xxx/export";

現在可以這樣做,直接上程式碼,我這裡貼的是AngularJS的HTTP請求函式,ajax也是類似的:

$http({
    url: "http://127.0.0.1:8080/wx-sr-api/xxx/export",
    method: 'GET',
    params: reqData,
    responseType: 'arraybuffer'
}).success(function (data, status, headers)
{
<!--var type = 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet'; if (!type) throw '無效型別';--> //物件 URL 也被稱為 blob URL,指的是引用儲存在 File 或 Blob 中資料的 URL。使用物件 URL 的 //好處是可以不必把檔案內容讀取到 JavaScript 中而直接使用檔案內容。為此,只要在需要檔案內容的地 //方提供物件 URL 即可。 var urlCreator = window.URL || window.webkitURL; var
blob = new Blob([data], { type: type }, decodeURI(headers()["x-filename"])); var url = urlCreator.createObjectURL(blob); //這個函式的返回值是一個字串,指向一塊記憶體的地址。 //以下程式碼儲存我的excel匯出檔案 var link = document.createElement('a'); //建立事件物件 link.setAttribute('href', url); link.setAttribute("download", filename); var
event = document.createEvent("MouseEvents"); //初始化事件物件 event.initMouseEvent("click", true, true, document.defaultView, 0, 0, 0, 0, 0, false, false, false, false, 0, null); //觸發事件 link.dispatchEvent(event); }).error(function (data, status) { }); //以下程式碼可以在頁面中顯示一個影象檔案: var filesList = document.getElementById("files-list"); EventUtil.addHandler(filesList, "change", function(event){ var info = "", output = document.getElementById("output"), progress = document.getElementById("progress"), files = EventUtil.getTarget(event).files, reader = new FileReader(), url = createObjectURL(files[0]); if (url){ if (/image/.test(files[0].type)){ output.innerHTML = "<img src=\"" + url + "\">"; } else { output.innerHTML = "Not an image."; } } else { output.innerHTML = "Your browser doesn't support object URLs."; } });