ラボ > Javascript関連:form、イベント関連

js ファイルを圧縮して送信

ファイル送信時に圧縮して送りたい

作成日:2024-03-29, 更新日:2024-03-29

メモ

面倒そうなので途中で調査をストップ

圧縮用のライブラリが必要
pakoライブラリってのがあるらしく、それを読み込めば良いらしい
ただ、jpgファイルなどはもともとが圧縮されたファイルなので、圧縮してもあまり恩恵は得られないっぽい

サンプル

▼ファイルを選択したら圧縮して、即送信処理

document.getElementById('fileInput').addEventListener('change', function(event) {
    const file = event.target.files[0];
    const reader = new FileReader();

    reader.onload = function(event) {
        const compressed = pako.gzip(event.target.result); // pakoライブラリで圧縮

        const formData = new FormData();
        formData.append('file', new Blob([compressed]), 'filename.gz'); // 圧縮ファイルを追加

        fetch('/upload', {
            method: 'POST',
            body: formData
        })
        .then(response => { /* 省略 */ })
        .catch(error => { /* 省略 */ });
    };

    reader.readAsArrayBuffer(file);
});