Vue で Excel ストリーム ファイルをダウンロードし、ダウンロード ファイル名を設定する方法

window.location.href = `${location.origin}/operation/ruleImport/template`

window.open(`${location.origin}/operation/ruleImport/template`)

axios.get(`/operation/ruleImport/template`, {
        responseType: "blob" // サーバー応答のデータ型。'arraybuffer'、'blob'、'document'、'json'、'text'、'stream' のいずれか。デフォルトは 'json' です。
    })
    .then(res => 
        if(!res) 戻り値
        const blob = new Blob([res.data], { type: 'application/vnd.ms-excel' }) // データを処理し、ファイルの種類を設定するための blob オブジェクトを構築します if (window.navigator.msSaveOrOpenBlob) { // IE10 と互換性があります
            navigator.msSaveBlob(blob、this.filename)
        } それ以外 {
            const href = URL.createObjectURL(blob) //指定されたblobオブジェクトを表す新しいURLを作成します。const a = document.createElement('a') //aタグを作成します。a.style.display = 'none'
            a.href = href //ダウンロードリンクを指定 a.download = this.filename //ダウンロードファイル名を指定 a.click() //ダウンロードをトリガー URL.revokeObjectURL(a.href) //URLオブジェクトを解放 }
        // ここでリンクを作成する必要はありません。window.open(href) を呼び出して直接ダウンロードすることもできます。
    .catch(エラー => {
        コンソール.log(エラー)
    })

npm インストール js-file-download --S

'js-file-download' からファイルをインポートします

axios.get(`/operation/ruleImport/template`, {
        responseType: 'blob' // 返されるデータ型})
    .then(res => {
        ファイルダウンロード(res.data, this.fileName)
    })