[Node.js] NodeJS 웹서버에서 한 덩어리씩 파일 읽어서 클라이언트에게 출력하기

이전글

[Node.js] NodeJS 웹서버에서 스트림을 이용하여 클라이언트에게 파일 응답

Node 웹서버 파일을 한덩어리씩 로딩한 후에 출력하기

이전 글에 이어서 이번에는 파일을 한 덩어리(chunk)씩 서버로 로딩한 후에 클라이언트와 연결된 출력스트림으로 내보내 보도록 하겠습니다.

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


var server = http.createServer();


server.listen(7070, function() {
    console.log('웹서버 시작');
});




server.on('request', function(req, res) {

    var filename = 'flower.png';
    var file = fs.createReadStream(filename, {flags: 'r'} );
    var filelength = 0; //파일의 길이를 저장할 변수
    var outlength = 0; //출력한 데이터 길이기를 저장할 변수

    fs.stat(filename,  function(err, stats) {
        filelength = stats.size;
    });

    // HTTP 응답 헤더에 이미지 파일임을 명시
    res.writeHead(200, {"Content-Type": "image/png"});

    file.on('readable', function() {
        var chunk;

        while (null !== (chunk = file.read())) {
            outlength += chunk.length;

            //파일 한 덩어리씩 출력
            //클라이언트가 아닌 버퍼로 내보낸다.
            //res.end() 를 호출하면 버퍼의 내용이 클라이언트로 출력된다.
            res.write(chunk, 'utf8', function(err) {
                //출력한 내용이 파일의 길이 이상이면
                //즉 모든 내용을 다 출력 했으면'
                //버퍼의 내용을 클라이언트로 전송
                if (outlength >= filelength) {
                    res.end();
                }
            });
        }
    });

});

주석에 설명이 나와 있지만 핵심 로직을 살펴보겠습니다.

위의 소스에서 최초에 fs.stat를 통해 이미지 파일의 총 길이(크기)를 구합니다. fs.Stat 객체는 파일에 대한 정보를 담고있는 객체입니다.

그리고 while문을 통해 파일 데이터를 한 덩어리씩 읽어들입니다. 파일의 끝까지 읽었을 때 read() 메서드는 null을 반환할 것이고 while문은 끝날 것입니다.

while문이 계속 되는 동안은 한 덩어리씩 res.write()를 통해 출력하는데 이때 클라이언트(서버에 접속한 브라우저)에 출력하는 것이 아닌 중간 버퍼에 출력하게 됩니다. 이후 버퍼로 출력한 데이터의 총 합이 파일의 데이터 크기와 같아지면 res.end()를 호출하고 버퍼에 있던 모든 내용들이 클라이언트로 출력되게 됩니다.

while (null !== (chunk = file.read())) {
    outlength += chunk.length;

    res.write(chunk, 'utf8', function(err) {

        if (outlength >= filelength) {
            res.end();
        }
    });
}