-
제로부터 시작하는 Node.js - 6. http 모듈 1편 (Http, Server, Request, Response)내가 보기 위해 쓰는 것/Node.js 2019. 11. 4. 17:55
이 챕터는 node.js로 웹서버개발을 목표로 하는 사람들에겐 가장 중요한 챕터입니다.
확실히 해야하고 내용도 기존 글들에 비해 방대하기 때문에 두편으로 나누려고 합니다.
HTTP(HyperText Transfer Protocol)은 TCP/IP를 기반에 둔 프로토콜입니다. 이 글의 목적이 프로토콜은 아니기 때문에 자세한 설명은 하지 않겠습니다. 다만 이 글에서 필연적으로 어느정도 이론적인 내용이 나올 수 밖에 없음을 알아주세요.
http모듈은 Node.js에서 가장 기본적이고 중요한 웹 모듈입니다. 웹서버와 클라이언트 생성등 관련된 모든 기능을 담당합니다.
node.js로 웹서버를 개발하는 것이 목표라면 잘 이해하고 넘어갑시다.* 꼭 알아가야할 개념
개념 설명 요청 웹 서버에 보내는 모든 요청을 말합니다. 응답 요청을 받은 웹 서버가 처리하는 작업을 말합니다. http모듈 http웹 서버와 관련된 모든 기능을 담은 모듈입니다. server객체 웹 서버를 생성할 때 사용하는 객체입니다. response객체 응답 메시지를 작성할 때 request이벤트 리스너의 두 번째 매개변수로 전달되는 객체입니다. request객체 응답 메시지를 작성할 때 request이벤트 리스너의 첫 번째 매개변수로 전달되는 객체입니다. 1. 요청(request)와 응답(response)
퀄리티 죄송합니다 CLIENT가 주소창에 https://www.naver.com을 입력했다면
naver주소로 요청을 보낸 것이다.
naver는 응답으로 메인 페이지를 렌더해준다.
요청과 응답은 이런 개념이다.
클라이언트와 서버가 계속해서 상호작용을 합니다. 클라이언트가 요청하는 방식에 따라서 HTTP웹 서버, HTTPS웹 서버가 구분됩니다.
2. server 객체
2-1. server 객체 메서드
http모듈에서 가장 중요한 객체는 server 객체입니다. http모듈의 createServer() 메서드를 사용하면 server객체를 생성할 수 있습니다. 메서드를 하나씩 살펴보기 전에 코드를 하나 작성해보겠습니다.
// http모듈을 추출합니다. const http = require('http') // 웹 서버를 생성합니다. const server = http.createServer() // 웹 서버를 3001 포트로 실행합니다. server.listen(3001, function(){ console.log('3001번 포트로 서버가 실행되었습니다.') })Terminal 에서는 콘솔로그가 잘 보이겠지만, 아직은 localhost:3001으로 접속해도 아무 일도 일어나지 않습니다.
아직 응답과 요청에 대한 처리 없이 서버생성만 있는 코드니까요.
천천히 하나하나 살펴보겠습니다.
server객체의 메서드는 아래와 같습니다.
메서드 설명 listen(port, callback) 서버를 첫번째 매개변수의 포트로 실행합니다. close(callback) 서버를 종료합니다. 2-2. server 객체 이벤트
server객체의 자주사용되는 이벤트입니다.
이벤트 설명 request 클라이언트가 요청할 때 발생하는 이벤트 connection 클라이언트가 접속할 때 발생하는 이벤트 close 서버가 종료될 때 발생하는 이벤트 checkContinue 클라이언트가 지속적인 연결을 하고 있을 때 발생하는 이벤트 upgrade 클라이언트가 http 업그레이드를 요청할 때 발생하는 이벤트 clientError 클라이언트에서 오류가 발생할 때 발생하는 이벤트 on 메서드를 이용해 server에 이벤트를 연결하는 예제입니다.
// http모듈을 추출합니다. const http = require('http') // 웹 서버를 생성합니다. const server = http.createServer() //server 객체에 이벤트를 연결합니다. server.on('request', function (code) { console.log('Request Event') }) server.on('connection', function (code) { console.log('Connection Event') }) // 웹 서버를 3001 포트로 실행합니다. server.listen(3001, function(){ console.log('3001번 포트로 서버가 실행되었습니다.') })
실행 직후엔 아무것도 없다. 인터넷을 켜고 http://localhost:3001을 접속하면...
이벤트가 발생했다.
* createServer()메서드의 매개변수로 request이벤트를 on메서드를 사용할 필요 없이 정의할 수 있습니다.
// 웹 서버를 생성하고 실행합니다. require('http').createServer(function(req, res){ // request, response res.writeHead(200, { 'Content-Type': 'text/html' }) res.end('<h1>Hello World...</h1>') })3. response 객체
3-1. response 작성
지금까지 서버를 열어보긴 했으나 접속했을 때 아무런 응답도 받지 못했습니다.
response 객체를 통해 응답 메시지를 작성해보겠습니다.
// 웹 서버를 생성하고 실행합니다. require('http').createServer(function(req, res){ // request, response res.writeHead(200, { 'Content-Type': 'text/html' }) res.end('<h1>Hello World...</h1>') }).listen(3001, function () { console.log('Server Running at http://127.0.0.1:3001') })response 객체를 사용하여 응답 메시지를 작성했으니 이번에는 접속했을 때 응답 메시지가 있을겁니다.
response 객체의 메서드는 아래와 같습니다.
메서드 설명 writeHead(statusCode, statusMessage, headers) 응답 헤더를 작성합니다. end(data, encoding, callback) 응답 본문을 작성합니다. 3-2. File System 모듈을 사용하여 HTML 문서 제공
자바스크립트 위에서 모든 HTML페이지 작성하는 것은 너무 힘든 일입니다.
HTML 문서를 클라이언트에게 제공해봅시다.
파일 구성입니다.
server.js 입니다.
const fs = require('fs') const http = require('http') const server = http.createServer(function (req, res) { // HTML파일을 읽습니다. fs.readFile('./index.html', function (err, data) { res.writeHead(200, { 'Content-Type': 'text/html' }) res.end(data) }) }).listen(3001, function () { console.log('server running at http://127.0.0.1:3001') })HTML 문서는 적당히 작성해줍시다. 저는 이렇게 작성했습니다.
더보기<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>My First Node.js Web</title>
</head>
<body>
<h1>Hello</h1>
<p>Node.js is so fun</p>
<a href="#">
<img src="https://upload.wikimedia.org/wikipedia/commons/thumb/d/d9/Node.js_logo.svg/1200px-Node.js_logo.svg.png" alt="node.js" width="300">
</a>
</body>
</html>
이제 결과를 확인해보겠습니다.
3-2. File System 모듈을 사용하여 이미지, mp3 파일 등 제공
res.writeHead(200, { 'Content-Type': 'text/html' })
Content-Type, text/html 이 부분에 대해서 궁금하실 수 있을 것 같습니다.
이 곳은 말그대로 응답으로 내놓을 컨텐트의 타입을 정의하는 곳입니다.
지금까지는 글, HTML문서를 제공했기 때문에 text/html로 작성했습니다.
하지만 이미지, mp3다운로드 등을 제공하고 싶을 수 있습니다.
아직 url을 사용해 페이지를 구분하는 법은 다루지 않았음으로
단일페이지에서만 다뤄보세요. Content-Type속성에 들어갈 MIME형식은 아래와 같습니다.
Content 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 파일 이는 MIME 형식에서 정의된 문자열입니다. MIME 형식은 굉장히 많아서 전부 나열할 순 없기에 자주 쓰이는 유명한 것만 나열했습니다. 필요에 따라 찾아보시면 되겠습니다.
1편은 여기까지입니다. 2편에서는 쿠키 생성, 페이지 이동, request 객체 등에 대해서 다루겠습니다.
'내가 보기 위해 쓰는 것 > Node.js' 카테고리의 다른 글
제로부터 시작하는 Node.js - 8. 패키지 매니저 npm, 외부모듈 (0) 2019.11.06 제로부터 시작하는 Node.js - 7. http 모듈 2편 (Cookie, Request, Page) (0) 2019.11.05 제로부터 시작하는 Node.js - 5. 이벤트 관리 (0) 2019.11.04 제로부터 시작하는 Node.js - 4. 기본 내장 모듈 (0) 2019.11.01 제로부터 시작하는 Node.js - 3. Node.js의 전역객체 (0) 2019.10.31
