zipやtar.gzなどの圧縮ファイルをサーバからhttpで送信する方法

今回は圧縮ファイルをhttpでサーバからフロントエンドに送信するための方法に関してまとめます。

ふと、フロントエンドからファイルを指定してアップロードは行えるけど、
圧縮ファイルをサーバーからフロントエンドに送信する方法ってどうやるんだろう？？
と思い、調べてみました！！

■環境
■zipファイル送信用サーバーサイドの実装
■tar.gzファイル送信用サーバーサイドの実装
■(補足)他の書き方
■最後に
■参考

■環境

今回、下図のようにラズパイをサーバーと見立て、
PCからzipファイルやtar.gzファイルをダウンロードしてみました。
f:id:Elsammit:20211108231936p:plain

使用した言語はnode jsです。

■zipファイル送信用サーバーサイドの実装

まず、zipファイルをhttp responseで返すためのサーバーサイドの実装をしていきます。
コードはこちら。

const fs = require('fs')
const http = require('http');

http.createServer(function(req,res){
    letfileName = "src.zip";
    let contentDip = 'attachment; filename=' + fileName;
    
    res.writeHead(200, {
        'Content-Type': 'application/zip',
        'Content-Disposition' : contentDip
    });
    var readStream = fs.createReadStream(fileName);
    readStream.pipe(res);
}).listen(8080);
});

ヘッダに対して、
Content-Typeにapplication/zipを指定することでzipを送信することを明示します。
Content-Dispositionはレスポンスヘッダーとして、コンテンツがブラウザーでインラインで表示されることを求められているか、
つまり、ウェブページとして表示するか、ウェブページの一部として表示するか、ダウンロードしてローカルに保存する添付ファイルとするかを示します。
詳細は下記に記載されておりますので詳しくはこちらをご参照ください。
developer.mozilla.org

後は、createReadStreamでファイルを読み込みながらレスポンスにpipeで流していきます。

こちらのコードを、

node ファイル名.js

などでサーバーを起動させ、

curl -o output.zip http://IPアドレス:8080/

とcurlコマンドを実行すると、
output.zipという名前でzip圧縮ファイルが格納されていることが確認できるかと思います。

さらにWebブラウザへ、

http://IPアドレス:8080/

と入力すると名前を付けて保存というメッセージがポップアップで表示され、
保存するとzipファイルがダウンロード出来ているかと思います。

■tar.gzファイル送信用サーバーサイドの実装

次にtar圧縮ファイルを送信するためのコードを載せます。

const fs = require('fs')
const http = require('http');

http.createServer(function(req,res){
    let fileName = "src.tar.gz";
    let contentDip = 'attachment; filename=' + fileName;
    
    res.writeHead(200, {
        'Content-Type': 'application/x-gzip',
        'Content-Disposition' : contentDip
    });
    let readStream = fs.createReadStream(fileName);
    readStream.pipe(res);
}).listen(8080);

先ほどと異なり、レスポンスヘッダには、

res.setHeader('Content-Type', 'application/x-gzip');

とgip圧縮ファイルを転送することを明示しています。
違いはこれだけ！！
後は先ほどのzipファイルと同様です。

確認も先ほどのzipの時と同様のcurlコマンドやWebブラウザで確認できますので動作確認してみてください。

■(補足)他の書き方

補足としてtar圧縮ファイルのレスポンス送信を例に別の書き方も載せておきます。

const fs = require('fs')
const http = require('http');

http.createServer(function(req,res){
    fs.readFile("src.tar.gz", (err,data)=>{
        if(err){
            console.log("err :" + err);
        }else{
            res.setHeader('Content-Type', 'application/x-gzip');
            res.end(data);
        }
    });
}).listen(8080);