前端調用后端接口下載excel文件的幾種方式

　　今天有一個導出相應數據為excel表的需求。后端的接口返回一個數據流，一開始我用axios(ajax類庫)調用接口,返回成功狀態200,但是!但是瀏覽器沒有自動下載excel表,當時覺得可能是ajax的安全性問題導致無法下載。下面列覺兩種我測試成功的方式:

　　1.window.location.href = '接口地址'

　　　　含義:當前頁面打開URL頁面.

　　　　和在瀏覽器輸入接口地址一樣,可以下載excel文件.但是缺點是無法執行POST請求

　　

　　2.利用隱藏表單解決(我這里假設加入了JQuery庫):

var exportData = [
    {'list1':'xiaodo1'},
    {'list2':'xiaodo2'}   
 ]  //模擬后台需要接收的參數
let form = $("<form>"); //創建form標簽

form.attr("style","display:none");
from.attr("method","post");//設置請求方式
form.attr("action","接口地址"); //action屬性設置請求路徑
$("body").append(form); //頁面添加form標簽

let input1 = $("<input>") //創建input標簽
input1.attr("type","hidden") //設置隱藏域
input1.attr("name","data") //設置發送后台數據的參數名
input1.attr("value",JSON.Stringify(exportData));

form.submit();//表單提交即可下載！

　　

上面就是我測試成功的兩種方法.后面我去百度了一下axios如何導出excel文件,發現也是可以的.

axios導出excel文件可以參考這篇文章:https://blog.csdn.net/u013224660/article/details/79981350

謝謝！