nodejs의 http 모듈을 가져와 웹서버를 구축한다.
전체적인 흐름은 http.createServer 를 통해 서버를 생성하면서 listen 메소드를 통해 3000번의 포트를 사용한다.
웹서버는 listen(3000)을 통해 3000번 포트에서 읽을 준비를 하며 사용자는 URL에 localhost:3000을 입력하면 서버는 response.end 메소드를 통해 template의 데이터들을 읽어 브라우저로 전송시켜준다.
즉, 서버는
1. listen을 통해 요청 대기상테에 들어가고,
2. 요청이 들어오면 creaServer 코드를 읽고,
3. end를 통해 데이터를 웹브라우저로 전송하게 된다.
var http = require('http');
var fs = require('fs');
var url = require('url');
// 필요한 nodejs 모듈을 가져온다.
http.createServer(function(request,response){
const URLQuery=new URL('localhost:3000'+request.url);
//request.url 까지 작성하여 쿼리스트링까지 가져온다.
var queryData=URLQuery.searchParams.get('id');
//쿼리스트링의 값을 가져온다 ex) /?id=HTML -> HTML을 가져옴
response.writeHead(200);
var template=
`<!doctype html>
<html>
<head>
<title>WEB1 - ${queryData}</title>
<meta charset="utf-8">
</head>
<body>
<h1><a href="/">WEB</a></h1>
<ol>
<li><a href="/?id=HTML">HTML</a></li>
<li><a href="/?id=CSS">CSS</a></li>
<li><a href="/?id=JavaScript">JavaScript</a></li>
</ol>
<h2>${queryData==null ? 'Hello World' : queryData}</h2>
//템플릿 리터럴에서 if문 쓰는게 까다로워서 그냥 삼항 연산자를 사용하였다.
<p>
${queryData==null ? fs.readFileSync(__dirname+'/index','utf-8') : fs.readFileSync(__dirname+'/'+queryData,'utf8',(err,data)=>{
data})}
//fs.readFileSync 함수는 절대경로를 적어줘야한다.
//쿼리스트링이 null 이면 index 파일을, 아니면 해당 쿼리스트링의 txt 파일을 가져오게 했다.
</p>
</body>
</html>
`;
response.end(template);
}).listen(3000);'Programming > JavaScript' 카테고리의 다른 글
| Open API 가져오기 (0) | 2021.08.08 |
|---|---|
| JSON이란? (0) | 2021.08.04 |
| Ajax 통신이란? (PHP) (0) | 2021.08.04 |
댓글