Vue請求後端接口導出excel表格

項目中遇到一個需求，使用者下載下傳檔案，會從後端那裡請求接口獲得資料并下載下傳導出excel表格

後端小哥給我傳回的是二進制資料流，需要前端自己去處理這些資料

如下圖，請求接口傳回的資料都是亂碼

這裡我們可以在axios的請求裡添加，這樣傳回的二進制資料就會被讀取為Blob的資料，

responseType: ‘blob’

fetchGet1(url, params) {
    return axios({
      url,
      method: 'get',
      params,
      header: {
        headers: { 'Content-Type': 'application/x-download' }
      },
      responseType: 'blob'	//指明傳回格式
    })
  }
           

//下載下傳接口
export var downLoadOrder = (orderId) => ajax.fetchGet1(`/api/order/excel/${orderId}`)
           

當我點選下載下傳訂單的按鈕後，浏覽器就自動彈出下載下傳excel檔案一欄了，要注意的是，我的電腦好像沒有xlsx格式的檔案，是以在定義檔案名那裡改成了xls的格式