javasciprtのaxiosで取得したxlsxのバイナリデータをFileSaver.jsでGoogle chromeからダウンロードしたいですが、
うまくいかなくて困っています。
サーバー側では実施せず、クライアント側で実施したいです。
下記の記事のことを試してみましたができませんでした。
Downloading excel(.xlsx) with blob and FileSaver.js in vue project getting coruppted
どなたかわかる方がいらっしゃいましたら、ご教授をお願いします。
javascript
1function onExcelExportClicked() { 2 axios({ 3 method: "get", 4 url: "***", 5 responseType: "blob", // blog or arraybuffer? 6 dataType: "binary", 7 params: { id: 1 } 8 }).then((response) => { 9 // ① arraybufferで試したこと 10 // var blob = new Blob([response.data], { type: "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet" }); 11 // FileSaver.saveAs(blob, "test.xlsx"); 12 13 // ② blobで下記はだめだった 14 FileSaver.saveAs(response.data, "test.xlsx"); 15 16 }).catch((response) => { 17 // エラー処理 18 }); 19}
このコードでうまくいき、ファイル名も内容も日本語でも正しく表示されました。
ただし、Excelがそのままオープンしてしまい、FileSaverでブラウザのダウンロード機能が働いてくれなくて困っています。
Edgeではダウンロード機能が働きましたが、Google Chromeで働いていないです。
FileSaverが対応していなさそうなので、他の方法があればよいのですが。
javascript
1function onExcelExportClicked() { 2 axios({ 3 method: "get", 4 url: "***", 5 responseType: "blob", 6 params: { id: 1 } 7 }).then((response) => { 8 var blob = new Blob([response.data], { type: "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet" }); 9 saveAs(blob, "テスト.xlsx"); 10 11 }).catch((response) => { 12 // エラー処理 13 }); 14}
回答2件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。