#やりたいこと
タイトル通りなんですが、いろいろ調べてみても直接ファイルが落ちてこなくて試行錯誤してたどり着いたやつです。
##少しだけ解説
headersとしてheaderの内容を記載するのですが、AcceptにExcelであること、responseTypeにblob形式であることが重要なようです。
またfetchで返ってきた値をblob()で処理するとファイル形式(バイナリ形式)として扱われるので無理くりリンク作ってクリックさせています。
https://developer.mozilla.org/ja/docs/Web/API/Fetch_API/Using_Fetch
https://developer.mozilla.org/ja/docs/Web/API/Body/blob
example.js
var filename = 'excelfile';
var obj = {
fname: filename,
format: 'XLSX'
};
var method = "POST";
var body = Object.keys(obj).map((key)=>key+"="+encodeURIComponent(obj[key])).join("&");
var headers = {
'Accept': 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet',
'Content-Type': 'application/x-www-form-urlencoded; charset=utf-8',
'responseType' : "blob",
};
fetch("アクセスするURL", {method, headers, body})
.then((res)=> res.blob())
.then(blob => {
let anchor = document.createElement("a");
anchor.href = window.URL.createObjectURL(blob);
anchor.download = filename+".xlsx";
anchor.click();})
.then(console.log)
.catch(console.error);
##参考にさせていただきました
JavaScriptでファイルダウンロード
fetch API でも POST したい!
##Yellowfinで使う(続き)
YellowfinのAPIとwebserviceを使ってダッシュボードのレポートを全てExcelでダウンロードする