https://nodejs.org/api/http.html
node js의 레퍼런스 페이지를 가보면 node js코드에서 사용할 수 있는 수많은 패키지를 볼 수 있다. 이 중 하나를 이용하면 손쉽게 서버를 생성할 수 있다.
HTTP패키지는 들어오는 요청을 수신하고 그에 대한 응답을 보내는 등의 특정 기능을 제공한다. 이제 이 패키지를 이용하여 요청을 처리하고 응답을 보내는 자바스크립트 코드를 작성할 수 있다.
require는 node js에 내장된 특수한 함수로 파라미터로 패키지 이름을 받는다. 이를 통해 수많은 유틸리티 메서드와 기능을 불러올 수 있다.
const http = require('http');
const server = http.createServer();
server.listen(3000);
const server = http.createServer();createServer 메서드는 http패키지의 메서드로, 내부적으로 필요한 모든 서버 기능이 포함된 객체를 반환한다. 이제 요청과 그에 대한 응답을 할 수 있는 서버가 만들어졌다.
server.listen(3000);이제 만들어진 server객체에 내장 메서드 listen을 사용하면 포트 번호에서 수신 대기를 개시한다. 파라미터로는 포트 번호를 받는다.
포트
-모든 컴퓨터에는 기본적으로 포트가 존재한다. 포트란 네트워크 트래픽에 대한 진입점으로, 내 컴퓨터에서 다른 컴퓨터로 보내진 http요청을 서버에서 다루기 위해서는 이러한 진입점이 반드시 필요하다.
-기본 포트 번호는 80이나 443이다. 80은 아무런 암호화를 거치지 않고, 443은 암호화된 요청을 보낸다.
위에서
server.listen(3000);포트 번호를 3000이라고 설정한 이유는 작업 중 로컬 개발 시스템에서 실행 중인 다른 서비스 등과 충돌을 피하기 위해서이다.
결국 지금까지 한 일은 서버를 생성하고 포트 3000에서 들어오는 요청을 수신하는 것이다. 하지만 아직 요청이 들어왔을 때 어떤 동작을 취해야 하는지를 알려주지 않았다.
이제
function handleRequest(request, response){
response.stastusCode = 200;
response.end('<h1>Hello world!</h1>');
};handleRequest라는 함수를 생성하고(파라미터로는 request와 response 두 가지 줬는데, 이는 node js에서 자동으로 반환하는 값들이다. 이름처럼 request는 요청, response는 응답과 관련 있다.) 받은 요청에 대한 응답에 해당하는 response라는 객체에 점 표기법으로 statusCode라는 속성을 200으로 설정한다. (+request를 req, response를 res로 줄여쓰는게 더 편할 듯)
statusCode속성은 브라우저에게 요청이 성공했는지에 대한 여부를 알려준다. 성공했다면 이 값은 200이다. 만약 실패한다면 에러 코드 404, 401, 500 중 하나가 되는데, 404는 이전부터 봐온 친숙한 에러코드라 뭔가 반가웠다. 404는 존재하지 않는 URL에 접근하려 할 때 나오는 에러다.
그 후 end메서드를 사용했는데, 이 메서드는 응답 준비를 끝낸 다음 파라미터로 받은 데이터를 클라이언트에게 전달해준다. 여기서는 '<h1>Hello world!</h1>'라는 동적 html코드를 직접 지정해줬으나 따로 파일을 보낼 수도 있다고 한다.
이제 vs code 터미널에서 node app.js로 실행해보면 아무것도 뜨지 않는다. 서버가 돌아가는 중이기 때문이다.
브라우저 주소창에 localhost:3000이라고 입력하면(위에서 포트번호를 3000으로 설정했기 때문에 3000) 서버에서 응답으로 보낸 'Hello world!'이 있는 페이지를 볼 수 있다.
추가사항
입력된 url이 localhost:3000/currenttime일 때의 응답을 설정해주고 싶다면 url속성을 사용하면 된다. request는 node js에서 생성된 객체이므로 url속성을 사용할 수 있다. url은 전체 url을 의미하는게 아니라 도메인과 포트의 뒷부분만 포함한다고 한다. 즉 'localhost:3000/currenttime'에서 ‘/currenttime’만 포함.
그래서 handleRequest함수에 if문을 추가하여 localhost:3000/currenttime일 때와 localhost:3000일 때의 응답을 다르게 만들 수 있다.
function handleRequest(request, response) {
if (request.url === "/currenttime") {
response.stastusCode = 200;
response.end("<h1>" + new Date().toISOString() + "</h1>");
} else if (request.url === "/") {
response.stastusCode = 200;
response.end("<h1>hello world!</h1>");
}
}response.end('<h1>' + new Date().toISOString() +'</h1>');에서 new생성자를 사용하여 Date라는 날짜 객체를 생성하고(이 객체는 현재의 timestamp를 반환한다) 여기에 toISOString이라는 메서드를 사용하여 날짜 객체를 문자열로 변환하였다. 이게 별 의미가 없어보여도 처음으로 요청에 따라 동적인 html을 제공했다는 점에서 나에겐 진보라고 할 수 있다.
이제 서버를 열고 실험해보면
정말로 url에 따라 응답이 바뀌는 것을 볼 수 있다. 신기하다.
