http 모듈로 서버 만들기

YOONIVERSE·2023년 10월 8일
0

http 모듈로 서버 만들기

통신의 요청(request)과 응답(response)을 구현하려면 Node.js의 기본 모듈인 http 모듈을 사용해서 구현할 수도, 확장 모듈인 express를 사용해서 구현할 수도 있다.


const http = require('http');

http.createServer((req, res) => {
})
	.listen(8080, () => {
  		console.log('8080포트에서 서버 연결 중..')
	});

터미널창에 node 폴더경로/실행파일.js
=> 8080포트에서 서버 연결 중.. 이라는 글자가 뜬다.
크롬창에서 localhost:8080 연결하면 로딩만 되고 뜨질 않는다.
서버는 실행되고 있으나, 이벤트리스터에 request도 response도 등록해주지 않았기 때문에 계속 로딩이 되는 것이다.


const http = require('http');

http.createServer((req, res) => {
  res.writeHead(200, { 'Content-Type': 'text/html; charset=utf-8' });
  res.write('<h1>Node.js로 서버 만들기</h1>');
  res.end('<p>3장 http모듈 공부 중입니다.</p>')
})

    .listen(8080, () => {
      console.log('8080포드에서 서버 연결 중..');
    });

.createServer() 함수는 말 그대로 서버를 만드는 함수이다.
이 함수 안에 인자로 콜백 함수를 넣고 이 콜백 함수에는 요청에 대한 응답, 즉 어떤 이벤트를 받았을 때 실행해야 하는 작업을 작성해주면 된다.
이 콜백 함수의 파라미터에는 두 가지 객체를 넣는데, 하나는 요청에 관한 정보를 담는 request를 줄여 주로 req 라고 표기하고, 다른 하나는 응답에 관한 정보를 담고 response를 줄여 주로 res 라고 표기한다.

res.writeHead() 는 응답에 대한 정보(헤더)를 기록하는 함수이고 파라미터로 요청 코드와 콘텐츠의 타입을 넣어준다.
res.write() 에는 파라미터로 클라이언트에 보낼 데이터를 넣어주면 된다. 여기서는 <h1>Node.js로 서버만들기</h1> 을 보내주었다.

res.end() 는 응답을 종료하는 메서드이고, 여기에 넣은 파라미터까지 전달하고, 응답을 종료한다.

마지막으로 createServer() 함수 뒤에 .listen() 을 붙여 클라이언트와 연결한 포트번호와 서버가 연결되면 실행할 콜백 함수를 넣는다.

listen() 메서드에 콜백을 넣는 대신 listening 이벤트 리스너를 붙여 사용할 수도 있고, 오류를 핸들링해주는 이벤트 리스너를 붙여줄 수도 있다.
오류를 처리할 때 주의할 점은 오류가 발생해도 꼭 응답 콜백 함수를 작성해주어야 한다는 점이다.
만약, 오류가 발생한 후 실행할 응답이 없다면 서버는 응답이 오길 계속 기다리게 되고 결국에는 timeout 오류를 발생한다.

res.end() 함수는 요청에 대한 응답을 보내주는 함수인데, 비슷한 것으로는 res.sendFile, res.send, res.json이 있다. 하나의 요청에는 한 개의 응답만 보내주어야 한다.

src/server/test.html 파일과 src/server/test.js 파일을 만들었다.
test.js 파일을 실행하면
[Error: ENOENT: no such file or directory, open './test.html'] 오류가 발생하였다.
경로 문제 인듯해서, test.js 파일의 fs.readFile 부분의 경로설정을 절대경로로 설정하였다.
절대경로로 설정하는 방법은 __dirname+'파일이름' 이다.
=> test.js 파일의 6번줄의 설정을 절대경로로 변경해줬다.

실행화면

req.url이 '/' 라는 뜻은 우리가 localhost:8080 뒤의 주소가 /라는 뜻이다. 즉, 기본 페이지라는 뜻이 된다.
여러 url을 설정해주고 req.url 이 기본 페이지일 때 기본 index.html 을 띄우고, req.url 이 회원가입 페이지일 때 signUp.html 을 띄우는 식으로 req.url 을 이용하여 여러 페이지를 생성할 수 있게 된다.
이렇게 요청을 보낼 때, 주소를 통해 내용을 표시하는 것은 'REST'라고 한다.

이렇게 뒤에 붙는 주소에 따라 요청을 정의할 수 있도록 주소체계를 구조화하여 만든 웹 서버를 "'RESTful' 하다" 라고 한다.
이는 '라우팅'을 통해 구현할 수 있다.

실행화면

윈도우즈는 <f12>
맥은 <option>+<command>+i 단축키를 통해 개발자 도구를 열 수 있다.
개발자 도구의 [network] 를 클릭.
그리고 일단 새로고침을 한번하면 요청이 오는 url이 보이는데 현재 localhost/ 밖에 만들지 않았으므로 이를 클릭해준다.
그렇게 되면 Header, Preview, Response, Initiator, Timing에 관한 정보를 볼 수 있고, 온갖 네트워크 통신에 관한 내용을 개발자 도구를 통해 확인할 수 있다.

profile
스텝이 꼬이면 그것이 바로 탱고 💃

0개의 댓글