본문 바로가기
매일코딩/Node.js

[node.js] HTTP

by 인생여희 2017. 3. 10.
반응형

HTTP

http 모듈은 node.js 의 가장 기본적인 웹 모듈이며 http 웹 서버와 클라이언트를 생성하는 것과 관련된 모든 기능을 담당한다.

 

기본개념

개념

설명

요청

웹 페이지에 접속하려고 하는 어떤 요청을 말한다.

응답

요청 받아 이를 처리하는 작업을 말한다.

http 모듈

http 웹 서버와 관련된 모든 기능을 담은 모듈이다.

server 객체

웹 서버를 생성하는데 꼭 필요한 객체이다.

response 객체

응답 메시지를 작성할 때 request 이벤트 리스너의 두 번째 매개변수로 전달되는 객체

request 객체

응답 메시지를 작성할 때 request 이벤트 리스너의 첫 번째 매개변수로 전달되는 객체

 



 

요청메시지를 사용해야 사용자에게 적절한 웹 페이지를 제공할 수 있다. 그리고 응답 메시지를 사용하면 쿠키를 저장하거나 추출할 수 있고 강제로 웹 페이지를 이동시킬 수도 있다.


서버생성

// 모듈을 추출합니다.

var http = require('http');

 

// 웹 서버를 생성합니다.

var server = http.createServer();

 

// 웹 서버를 실행합니다.

server.listen(52273);

 


close()메서드

// 서버를 생성합니다.

var server = require('http').createServer();

 

// 서버를 실행합니다.

server.listen(52273, function () {

console.log('Server Running at http://127.0.0.1:52273');

});

 

// 10초 후 함수를 실행합니다.

var test = function () {

// 서버를 종료합니다.

server.close();

};

setTimeout(test, 10000);


server 객체의 메서드

listen(port) - 서버를 실행한다.

close() - 서버를 종료한다.

 

server 객체의 이벤트

server 객체는 EventEmitter 객체를 기반으로 만들어졌으므로 이벤트를 연결할 수 있다.

request - 클라이언트가 요청할 때 발생하는 이벤트

connection - 클라이언트가 접속할 때 발생하는 이벤트

close - 서버가 종료될 때 발생하는 이벤트

checkContinue - 클라이언트가 지속적인 연결을 하고 있을 때 발생하는 이벤트

upgrade - 클라이언트가 http 업그레이드 요청할 때 발생하는 이벤트

clientError - 클라이언트에서 오류가 발생할 때 발생하는 이벤트

 

 

on() 메서드를 사용해 server 객체에 이벤트를 연결한다.

// 모듈을 추출합니다.

var http = require('http');

 

// server 객체를 생성합니다.

var server = http.createServer();

 

// server 객체에 이벤트를 연결합니다.

server.on('request', function (code) {

console.log('Request On');

});

 

server.on('connection', function (code) {

console.log('Connection On');

});

 

server.on('close', function (code) {

console.log('Close On');

});

 

// listen() 메서드를 실행합니다.

server.listen(62273);

웹브라우저에 http://127.0.0.1:62273/ 입력!

웹브라우저가 요청메시지를 전달했지만 웹서버가 응답메시지를 전달하지 않았다.

그래서 응답메시지 작성


response 객체의 메서드

writeHead(statusCode) - 응답 헤더를 작성한다.

end([data][,encoding][,callback]) - 응답 본문을 작성한다.

 

// 웹 서버를 생성하고 실행합니다.

require('http').createServer(function (request, response) {

// 응답합니다.

response.writeHead(200, { 'Content-Type': 'text/html' });

response.end('<h1>Hello Web Server with Node.js</h1>');

}).listen(52273, function () {

console.log('Server Running at http://127.0.0.1:62273');

});




File System 모듈을 사용한 html 페이지 제공

자바스크립트 파일 위에서 모든 html 페이지를 문자열로 작성하는 것은 불가능하다. 그래서 file system 모듈을 사용해서 서버에 존재하는 html 페이지를 클라이언트에 제공해보자.


// 모듈을 추출합니다.

var fs = require('fs');

var http = require('http');

 

// 서버를 생성하고 실행합니다.

http.createServer(function (request, response) {

// HTML 파일을 읽습니다.

fs.readFile('exam.html', function (error, data) {

response.writeHead(200, { 'Content-Type': 'text/html' });

response.end(data);

});

}).listen(62273, function () {

console.log('Server Running at http://127.0.0.1:62273');

});



exam.html

<!DOCTYPE html>

<html>

<head>

<title>Index</title>

</head>

<body>

<h1>Hello Node.js</h1>

<h2>Author. RintIanTta</h2>

<hr />

<p>Lorem ipsum dolor sit amet.</p>

</body>

</html>

웹브라우저에

http://127.0.0.1:62273/ 입력

 


이미지와 음악 파일 제공

특정 형식 파일을 제공할 때 중요한 것은 응답 헤더의 Content-Type 속성이다. Content-Type 속성은 MIME 형식을 입력하는데 지금까지는 text/html을 입력했으므로 웹브라우저가 html 파일을 연 것이다.

image/jpeg audio/mp3를 이용하면 이미지와 음악을 넣을 수 있다.

 

MIME TYPE

text/plain 기본적인 텍스트

text/html html 문서

text/css css 문서

text/xml - xml문서

image/jpeg jpg/jpeg 그림 파일

image/png png 그림 파일

video/mpeg mpeg 비디오 파일

audio/mp3 mp3 음악 파일


쿠키생성

쿠키는 키와 값이 들어 있는 작은 데이터 조각으로 이름, , 파기 날짜와 경로 정보가 있다. 쿠키는 서버와 클라이언트에서 모두 저장하고 사용할 수 있으며, 일정 기간 동안 데이터를 저장할 수 있으므로 로그인 상태를 일정 시간 동안 유지해야 하는 페이스북과 같은 웹 사이트에 사용한다.

response 객체를 사용하면 클라이언트에 쿠키를 할당 할 수 있다. 이때 응답 헤더의 Set-Cookie 속성을 사용한다. Set-Cookie 속성에는 다음과 같은 문자열 형태로 이루어진 쿠키의 배열을 넣는다.


Name Value; Expires = 날짜; Domain = 도메인; Path = 경로; Secure

 

// 모듈을 추출합니다.

var http = require('http');

 

// 서버를 생성하고 실행합니다.

http.createServer(function (request, response) {

// 변수를 선언합니다.

var date = new Date();

date.setDate(date.getDate() + 7);

 

// 쿠키를 입력합니다.

response.writeHead(200, {

'Content-Type': 'text/html ',

'Set-Cookie': [

'breakfast = toast; Expires = ' + date.toUTCString(),

'dinner = chicken'

]

});

// 쿠키를 출력합니다.

response.end('<h1>' + request.headers.cookie + '</h1>');

}).listen(62273, function () {

console.log('Server Running at http://127.0.0.1:62273');

});



페이지 강제 이동

응답헤더의 Location 속성 사용

 

// 모듈을 추출합니다.

var http = require('http');

 

// 웹 서버를 생성 및 실행합니다.

http.createServer(function (request, response) {

response.writeHead(302, { 'Location': 'http://www.naver.com' });

response.end();

}).listen(62273, function () {

console.log('Server Running at http://127.0.0.1:52273');

}); 

writeHead의 첫 번째 매개변수를 status code 라고 부른다.


http status code

1.. - 처리중

2.. - 성공

3.. - 리다이렉트

4.. - 클라이언트 오류

5.. - 서버 오류

request 객체

 

 

request 객체 속성

method 클라이언트의 요청방식을 나타낸다.

url - 클라이언트가 요청한 url을 나타낸다.

headers 요청 메시지 헤더를 나타낸다.

trailers - 요청 메시지 트레일러를 나타낸다.

httpVersion http 프로토콜 버전을 나타낸다.

이 속성을 사용하면 사용자가 요청한 페이지를 적절하게 제공하는 것은 물론 요청 방식에 따라 페이지를 구분할 수 있다.

 

url속성을 사용한 페이지 구분


index.html


<!DOCTYPE html>

<html>

<head>

<title>Index</title>

</head>

<body>

<h1>Hello Node.js _ Index</h1>

<h2>Author. RintIanTta</h2>

<hr />

<p>Lorem ipsum dolor sit amet</p>

</body>

</html>

 

OtherPage.html

 

<!DOCTYPE html>

<html>

<head>

<title>OtherPage</title>

</head>

<body>

<h1>Hello Node.js _ OtherPage</h1>

<h2>Author. RintIanTta</h2>

<hr />

<p>Lorem ipsum dolor sit amet</p>

</body>

</html>

 

module.js

 

// 모듈을 추출합니다.

var http = require('http');

var fs = require('fs');

var url = require('url');

 

// 서버를 생성 및 실행합니다.

http.createServer(function (request, response) {

// 변수를 선언합니다.

var pathname = url.parse(request.url).pathname;

// 페이지를 구분합니다.

if (pathname == '/') {

// Index.html 파일을 읽습니다.

fs.readFile('index.html', function (error, data) {

// 응답합니다.

response.writeHead(200, { 'Content-Type': 'text/html' });

response.end(data);

});

} else if (pathname == '/OtherPage') {

// OtherPage.html 파일을 읽습니다.

fs.readFile('OtherPage.html', function (error, data) {

// 응답합니다.

response.writeHead(200, { 'Content-Type': 'text/html' });

response.end(data);

});

}

}).listen(62273, function () {

console.log('Server Running at http://127.0.0.1:62273');

});

 

 

method 속성을 사용한 페이지 구분

url 속성으로 페이지를 구분하는 것 이외에도 get 요청인지 post 요청인지에 따라 서로 다른 페이지를 제공하는 것도 굉장히 중요한 일이다. 이런 경우 request 객체의 method 속성을 사용하면 요청방식에 따라 페이지를 쉽게 구분할 수 있다.

 

 

// 모듈을 추출합니다.

var http = require('http');

 

// 모듈을 사용합니다.

http.createServer(function (request, response) {

if (request.method == 'GET') {

console.log('GET 요청입니다.');

} else if (request.method == 'POST') {

console.log('POST 요청입니다.');

}

}).listen(62273, function () {

console.log('Server Running at http://127.0.0.1:62273');

});

코드를 실행하고 웹브라우저로 접속하면 get 요청입니다 라고 뜬다.

아직 post요청은 수행 불가능.

 

 

get 요청 매개변수 추출

// 모듈을 추출합니다.

var http = require('http');

var url = require('url');

 

// 모듈을 사용합니다.

http.createServer(function (request, response) {

// 요청 매개변수를 추출합니다.

var query = url.parse(request.url, true).query;

 

// GET 요청 매개변수 출력

response.writeHead(200, { 'Content-Type': 'text/html' });

response.end('<h1>' + JSON.stringify(query) + '</h1>');

}).listen(62273, function () {

console.log('Server Running at http://127.0.0.1:62273');

});

웹브라우저에 http://127.0.0.1:62273/?name=haha&food=bread 입력하면

{"name":"haha","food":"bread"}

json 형식으로 출력된다.

 


post 요청 매개변수 추출

post 방식은 get 방식과 달리 데이터를 더 많이 담을 수 있고 보안 측면에서도 좋다. get 방식은 요청하면서 매개변수 형식으로 노출되어 데이터를 전달하지만 post 방식은 요청한 후 데이터를 별도로 전달하기 때문이다post 방식은 request 이벤트가 발생한 후 request 객체의 data 이벤트로 데이터가 전달 된다.


)

index.html

<!DOCTYPE html>

<html>

<head>

<title>Node.js Example</title>

</head>

<body>

<h1>Send Data With POST Method</h1>

<form method="post">

<table>

<tr>

<td><label>Data A</label></td>

<td><input type="text" name="data_a" /></td>

</tr>

<tr>

<td><label>Data B</label></td>

<td><input type="text" name="data_b" /></td>

</tr>

</table>

<input type="submit" />

</form>

</body>

</html>

 

module.js

// 모듈을 추출합니다.

var http = require('http');

var fs = require('fs');

 

// 모듈을 사용합니다.

http.createServer(function (request, response) {

if (request.method == 'GET') {

// GET 요청

fs.readFile('index.html', function (error, data) {

response.writeHead(200, { 'Content-Type': 'text/html' });

response.end(data);

});

} else if (request.method == 'POST') {

// POST 요청

request.on('data', function (data) {

response.writeHead(200, { 'Content-Type': 'text/html' });

response.end('<h1>' + data + '</h1>');

});

}

}).listen(62273, function () {

console.log('Server Running at http://127.0.0.1:62273');

});

 결과는 문자열 형태로 출력된다.

 


쿠키 추출

request 객체를 사용하여 쿠키를 추출하는 방법

request 객체의 headers 속성 안 cookie 속성에서 추출할 수 있다.

 

// 모듈을 추출합니다.

var http = require('http');

 

// 모듈을 사용합니다.

http.createServer(function (request, response) {

// GET COOKIE

var cookie = request.headers.cookie;

 

// SET COOKIE

response.writeHead(200, {

'Content-Type': 'text/html',

'Set-Cookie': ['name = RintIanTta', 'region = Seoul']

});

// 응답합니다.

response.end('<h1>' + JSON.stringify(cookie) + '</h1>');

}).listen(62273, function () {

console.log('Server Running at http://127.0.0.1:62273');

});

 

request 객체의 headers 속성에 있는 cookie 속성은 문자열이다

쿠키를 쉽게 사용하려면 쿠키를 분해해서 객체의 배열로 생성하는 것이 좋다.

 

// 모듈을 추출합니다.

var http = require('http');

 

// 모듈을 사용합니다.

http.createServer(function (request, response) {

// 쿠키가 있는지 확인

if (request.headers.cookie) {

// 쿠키를 추출하고 분해합니다.

var cookie = request.headers.cookie.split(';').map(function (element) {

var element = element.split('=');

return {

key: element[0],

value: element[1]

};

});

 

// 응답합니다.

response.end('<h1>' + JSON.stringify(cookie) + '</h1>');

} else {

// 쿠키를 생성합니다.

response.writeHead(200, {

'Content-Type': 'text/html',

'Set-Cookie': ['name = RintIanTta', 'region = Seoul']

});

 

// 응답합니다.

response.end('<h1>쿠키를 생성했습니다</h1>');

}

}).listen(62273, function () {

console.log('Server Running at http://127.0.0.1:62273');

});

반응형

'매일코딩 > Node.js ' 카테고리의 다른 글

[node.js] express 모듈 1  (4) 2017.03.12
[node.js] 외부모듈  (2) 2017.03.11
[node.js] 이벤트  (2) 2017.03.09
[node.js] 기본 내장모듈  (2) 2017.03.08
[node.js] 입문  (4) 2017.03.07

댓글