要件 : S3にあるPDFを取得してZIPにする
利用するライブラリ
-
フェッチ処理 : Axios
-
ファイル圧縮 : Archiver
-
S3からPDFのオブジェクト取得 : AWS-SDK for javascript
アップロードのシーケンス(処理手順)
①ZIPダウンロードのリクエスト
- 取得したzipファイルをダウロードするために
- aタグに
href属性
とdownload属性
を追加してクリックする
- aタグに
フロント
import axios from 'axios'
const download = () => {
const { data }: any = await axios.get("http://localhost:8000/archive", {
responseType: "arraybuffer",
})
// blobの作成
const blob = new Blob([data], { type: "application/zip" });
// URLの作成
const url = window.URL.createObjectURL(blob);
// aタグの作成
const link = document.createElement("a");
// urlの追加
link.href = url;
// download属性を付与, ファイル名も指定
link.setAttribute("download", "ダウンロード.zip");
// aタグをクリックしてダウンロード
link.click();
// urlの削除
link.parentNode?.removeChild;
}
②PDF取得、③zip圧縮
AWS : Amazon S3 オブジェクトに対する操作の実行
- S3のgetObjectメソッドを利用してPDFデータ(Buffer)を取得
- BufferをStreamにする
- archiverを利用してzip化させる
-
response
にzip化したarchive
をpipe
する -
stream
をappend
メソッドでarchive
に追加-
.pdf
の指定はappendメソッドの第二引数で行う -
/sample1
はディレクトリとなる
-
-
バックエンド(download.ts)
import AWS from 'aws-sdk'
import * as archiver from 'archiver'
const S3 = new AWS.S3({'region':'region'});
// ダウンロード、zip化
const download = (request, response) => {
// ②PDF取得
const stream = S3.getObject(
{
Bucket:'test',
Key:'hoge/huga.pdf'
}).createReadStream()
// ③zip圧縮
const archive = archiver('zip')
// レスポンスにarchiveを繋げる
archive.pipe(response)
// ファイルを追加
archive.append(stream, '/sample1/test.pdf')
// zipにする
archive.finalize()
// 一応、ヘッダーのContent-Typeを指定しておく
return response.header('Content-Type', 'application/zip')
}