之前做過一些EXCEL檔案匯出功能，但是都是用GET請求實作的。我使用的方法是這樣的
// export excel module
handleExportTemplate:_debounce(function(){
window.location.href = process.env.BASE_API `/export/excelDownload`
}),我使用[window.location.href]方法讓瀏覽器自動下載Excel，但是今天后端工程師讓我使用POST請求，并在body中將引數傳遞給他。資料與此類似：
data:{
userIdList:["1","2","3","4","5"],
ifShow:true,
ifDownLoadNow:true,
}但是使用window.location.href，我不知道如何將這些引數回傳給后端工程師
另外，我嘗試使用普通的POST請求發送給他，他確實成功回傳了一個檔案給我，但是我無法讓瀏覽器通過window.location.href自動下載它
我試圖說服他對這個功能使用 GET 請求，但他不聽我的。使用 POST 進行下載請求真的合適嗎？是他錯了還是我知道的太少？如果是我的錯，我怎樣才能完成 POST 請求并能夠下載 EXCEL？
uj5u.com熱心網友回復：
POST使用請求下載檔案沒有問題。特別是當您創建包含許多資料的檔案時。在這種情況下，get 請求的長度是有限的，而 aPOST則沒有。
我不知道POST使用 only 發送請求的任何方法window.location.href，但是您可以使用 JavaScript 來實作您想要的。
一種方法是使用fetchAPI：
const resp = await fetch('/your/url',{ method : 'POST', body : { /**@ your data **/ } });
const fileContent = await resp.text();
然后，您可以使用如下函式讓瀏覽器下載檔案：
function download(filename, text) {
var element = document.createElement('a');
element.setAttribute('href', 'data:text/plain;charset=utf-8,' encodeURIComponent(text));
element.setAttribute('download', filename);
element.style.display = 'none';
document.body.appendChild(element);
element.click();
document.body.removeChild(element);
}
它會臨時用該屬性創建一個不可見的鏈接，download并自動單擊它以下載記憶體中的檔案。
轉載請註明出處，本文鏈接：https://www.uj5u.com/houduan/467259.html
標籤：javascript html