Back Ground

NodeJS - 클라이언트로 응답을 보내는 방식 [ES5] 본문

Javascript/Node.js

NodeJS - 클라이언트로 응답을 보내는 방식 [ES5]

Back 2018. 9. 18. 21:29
클라언트로 부터 응답 보내는 방법


1
var http = require('http');
cs

기본 적으로 http모듈을 받는다.


기존에 했던 http모듈을 활용하여 서버를 띄웠던 것과 같다.


1
2
3
4
5
6
7
8
var server = http.createServer();
 
var host = '192.168.10.25';
var port = 3000;
 
server.listen(port, host,function(){
    console.log('서버 시작');
});
cs





웹 브라우저에서 요청할 때 상황에 따른 적절한 이벤트 발생


connection 

 클라이언트가 접속하여 연결이 만들어질 때 발생하는 이벤트입니다.

 request

 클라이언트가 요청할 때 발생하는 이벤트입니다.

 close

 서버를 종료할 때 발생하는 이벤트입니다.


connection

1
2
3
4
5
server.on('connection',function(socket){//클라이언트 정보를 socket이 갖고있다.
    console.log('클라이언트가 접속',
                socket.remoteAddress+','
                +socket.remotePort);
});
cs

connection는 서버에 접속한자가 누군지 안다.

(.on('') 으로 할 수 있는 이벤트는 server.connection(); 도 가능)

그 정보는 callback 함수로 받을 수있는데 현재 매개변수로 socket으로 받는다.


-socket.remoteAddress 어디서 들어왔는지 정보

-socket.remotePort       어디서 들어왔는지 소켓의 포트번호 정보

(만일 외부와 통신이 되지 않을때 방화벽을 확인한다.)



request 

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
server.on('request',function(req,res){
   console.log('클라이언트 요청');
    
    //응답
    res.writeHead(200,{"Content-Type":"text/html; charset=utf-8"});
    
    //DOM
    res.write("<!DOCTYPE html>");
    res.write("<html>");
    res.write("<head>");
    res.write("    <title>Me server</title>");
    res.write("    <meta charset='UTF-8'>");
    res.write("    <meta name='description'' content=''>");
    res.write("    <meta name='keywords' content=''>");
    res.write("</head>");
    res.write("<body>");
    res.write("<div>안녕하세요</div>");
    res.write("<div>NodeJS 실습 시간입니다.</div>");
    res.write("</body>");
    res.write("</html>");
    
    //응답 종료
    res.end();
    
});
cs

.writeHead

- Content-Type 현재 페이지의 타입 (이 페이지는 html로 할것이기 때문에 설정을 잡고 엔코딩을 맞춰준다. )


.write

- DOM에 나타낼 것 쓰기


.end

응답을 닫는다 

※만약 end를 안쓰면 server가 멈추지 않고 계속 대기 한다. (리소드 과다)



 writeHead(statusCode[, statusMessage][, headers])

 응답으로 보낼 헤더를 만듭니다.

 write(chunk[, encoding][, callback])

 응답 본문(body) 데이터를 만듭니다. 여러 번 호출될 수 있습니다.

 end([data][, encoding][, callback])

 클라이언트로 응답을 전송합니다.





마지막으로 서버를 종료하면된다.


1
2
3
4
server.on('close',function(){
    console.log('서버종료');
});
 
cs



예제)

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
var http = require('http');
 
var server = http.createServer();
 
var host = '192.168.10.25';
var port = 3000;
 
server.listen(port, host,function(){
    console.log('서버 시작');
});
 
//connection 서버에 접속한자가 누군지 안다.
server.on('connection',function(socket){//클라이언트 정보를 socket이 갖고있다.
    //var addr = socket.address();
    console.log('클라이언트가 접속',
                socket.remoteAddress+','
                +socket.remotePort);
    //socket.remoteAddress 어디서 들어왔는지 정보
    //socket.remotePort    어디서 들어왔는지 소켓의 포트번호 정보
    //외부와 통신이 되지 않을때 방화벽을 확인한다.
});
 
server.on('request',function(req,res){
   console.log('클라이언트 요청');
 //  console.log(req);
    
    //응답
    
    
    //헤더 정보 
    res.writeHead(200,{"Content-Type":"text/html; charset=utf-8"}); //Content-Type 현재 페이지의 타입
    
    //DOM
    res.write("<!DOCTYPE html>");
    res.write("<html>");
    res.write("<head>");
    res.write("    <title>Me server</title>");
    res.write("    <meta charset='UTF-8'>");
    res.write("    <meta name='description'' content=''>");
    res.write("    <meta name='keywords' content=''>");
    res.write("</head>");
    res.write("<body>");
    res.write("<div>안녕하세요</div>");
    res.write("<div>NodeJS 실습 시간입니다.</div>");
    res.write("</body>");
    res.write("</html>");
    
    //응답 종료
    res.end(); //end를 안쓰면 server가 멈추지 않고 계속 대기 한다. (리소드 과다)
    
});
 
server.on('close',function(){
    console.log('서버종료');
});
 
cs



서버 생성시에도 Response에 담아 보낼수 있다.

하지만 좋은 방법이라곤 하지만 쓰기 나름이라고 생각한다.

예제)

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
var http = require('http');
 
var server = http.createServer(
    
    //서버 생성시에 만들 순 있지만 (좋은 방법은 아니다. 편법)
    function(req,res){
       console.log('클라이언트 요청');
     //  console.log(req);
 
        //응답
        //헤더 정보 
        res.writeHead(200,{"Content-Type":"text/html; charset=utf-8"});
 
        //DOM
        res.write("<!DOCTYPE html>");
        res.write("<html>");
        res.write("<head>");
        res.write("    <title>Me server</title>");
        res.write("    <meta charset='UTF-8'>");
        res.write("    <meta name='description'' content=''>");
        res.write("    <meta name='keywords' content=''>");
        res.write("</head>");
        res.write("<body>");
        res.write("<div>안녕하세요</div>");
        res.write("<div>NodeJS 실습 시간입니다.</div>");
        res.write("</body>");
        res.write("</html>");
 
        //응답 종료
        res.end(); 
    }
);
 
var host = '192.168.10.25';
var port = 3000;
 
server.listen(port, host,function(){
    console.log('서버 시작');
});
 
 
server.on('connection',function(socket){
    //var addr = socket.address();
    console.log('클라이언트가 접속',
                socket.remoteAddress+','
                +socket.remotePort);
});
 
server.on('close',function(){
    console.log('서버종료');
});
 
cs






이미지 파일 보내는 방법




위의 방식과 거의 동일 하다


1
var fs = require('fs');
cs

아까 코드에서 추가적으로 file 모듈을 가져온다.



request 부분에 

file readFile을 해서 파일을 불러온다.

1
2
3
4
5
6
7
8
9
10
11
12
server.on('request',function(req,res){
   console.log('클라이언트 요청');
    
    fs.readFile('./study/img/ii.jpg',function(err,data){
        console.log(data);
        res.writeHead(200,{"Content-Type":"image/jpg"}); 
        res.write(data);
        res.end();
    });
    
});
 
cs


Content-Type 을 'image/jpg' 로변경 하면 된다. 

(png/gif 로 해도 되지만 이미지에 투명도를 적용 시키고 싶다면 사용하여야한다.)

(엉뚱한 글자 넣으면 의문의 파일이 다운로드된다)


그 후 DOM에 File Data를 보내준 후 서버를 실행시키면 이미지가 뜨는걸 확인할 수 있다.

(이미지 경로는 node가 시작되는 시점이란걸 명심)


예제)

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
var http = require('http');
var fs = require('fs');
 
var server = http.createServer();
 
var host = '192.168.10.25';
var port = 3000;
 
server.listen(port, host,function(){
    console.log('서버 시작');
});
 
server.on('connection',function(socket){//클라이언트 정보를 socket이 갖고있다.
    console.log('클라이언트가 접속',
                socket.remoteAddress+','
                +socket.remotePort);
});
 
server.on('request',function(req,res){
   console.log('클라이언트 요청');
    
    fs.readFile('./study/img/ii.jpg',function(err,data){
        console.log(data);
        res.writeHead(200,{"Content-Type":"image/jpg"}); //타입은 이미지로 설정
        res.write(data);
        res.end();
    });
    
});
 
server.on('close',function(){
    console.log('서버종료');
});
 
cs






이미지 파일 보내는 방법 ( Stream으로 파일 보내기 )


위와 방식은 동일하다.


1
2
3
4
5
6
7
server.on('request',function(req,res){
   console.log('클라이언트 요청');
    
   var inF = fs.createReadStream('./study/img/ii.jpg',{flages:'r'});
   inF.pipe(res);
    
});
cs

createReadStream로 읽어온 파일을 
.pipe를 통해 resonse를 넣어주면 된다.

이 방식엔 단점이 있는데
해더를 바꿀수 없기때문에 조절하면서 보낼 수 없다.


예제)

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
var http = require('http');
var fs = require('fs');
 
var server = http.createServer();
 
var host = '192.168.10.25';
var port = 3000;
 
server.listen(port, host,function(){
    console.log('서버 시작');
    
    
    
});
 
server.on('connection',function(socket){//클라이언트 정보를 socket이 갖고있다.
    console.log('클라이언트가 접속',
                socket.remoteAddress+','
                +socket.remotePort);
});
 
server.on('request',function(req,res){
   console.log('클라이언트 요청');
    
   //단점 : 해더를 바꿀수 없다. 조절하면서 보낼 수 없다.
   var inF = fs.createReadStream('./study/img/ii.jpg',{flages:'r'});
   inF.pipe(res);
    
});
 
server.on('close',function(){
    console.log('서버종료');
});
 
cs






이미지 파일 보내는 방법 ( Buffer 파일 보내기 )



예제)

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
var http = require('http');
var fs = require('fs');
 
var server = http.createServer();
 
var host = '192.168.10.25';
var port = 3000;
var fileSize =0;
 
server.listen(port, host,function(){
//    console.log('서버 시작');
});
 
server.on('connection',function(socket){
//    console.log('클라이언트가 접속',
//                socket.remoteAddress+','
//                +socket.remotePort);
});
 
fs.stat('./study/img/kk.jpg',function(err,data){
    //console.log(data.size);
    fileSize = data.size; //파일크기
});
 
server.on('request',function(req,res){
//    console.log('클라이언트 요청');
 
    var inF = fs.createReadStream('./study/img/kk.jpg',{flages:'r'});
    
    var currSize =0;
    
    console.log("파일 총 크기 :" +fileSize);
    
    res.writeHead(200,{"Content-Type":"image/jpg"}); 
    
    inF.on('readable',function(){ //readable 읽는게 있을때까지 계속 읽는다.
        var chunk ; //chunk 저장공간이란 뜻
        while(null !== ( chunk = inF.read() )){ //통신량에 따라서 분할해서 읽는양이 달라진다.
            //내용을 읽어서 읽은 내용을 chunk에 저장 null이 아닐 때까지
            currSize = chunk.length;
            console.log(" 읽은 데이터 사이즈 : " + chunk.length+
                        '\n 현재 데이터 사이즈 : '+currSize+
                        '\n 파일 데이터 사이즈 : '+fileSize
                       );
            
            res.write(chunk,'utf8',function(err){//데이터 쓰기
                if(currSize >= fileSize){
                    res.end();
                }
            });
            
        }; 
    });
});
 
server.on('close',function(){
//    console.log('서버종료');
});
 
cs


저작자표시 비영리

'Javascript > Node.js' 카테고리의 다른 글

NodeJS - Express의 요청 객체와 응답 객체 [ES5]  (0) 2018.09.20
NodeJS - Express모듈 서버 만들기 [ES5]  (0) 2018.09.18
NodeJS - http 모듈로 요청받은 파일 내용을 읽고 응답하기 [ES5]  (0) 2018.09.18
NodeJs - 스트림 단위로 파일 읽고 쓰기 [ES5]  (0) 2018.09.18
NodeJS - 파일을 직접 열고 닫으면서 읽거나 쓰기 [ES5]  (0) 2018.09.14
'Javascript/Node.js' Related Articles more
Comments