Not Found 구현
홈페이지에서 잘못된 경로를 입력했을 때 뜨는 Not Found 페이지를 구현해보자
var http = require('http');
var fs = require('fs');//fs module (= File System module) 이란, 파일 처리와 관련된 전반적인 작업을 하는 모듈을 말한다.
var url = require('url');
var app = http.createServer(function (request, response) {
var _url = request.url;
var queryData = url.parse(_url, true).query; //query string을 불러 온다.
var pathname = url.parse(_url, true).pathname;
var title = queryData.id;
if (pathname === '/') {
fs.readFile(`data/${queryData.id}`, 'utf8', function (err, description) {
var template = `
<!doctype html>
<html>
<head>
<title>WEB1 - ${title}</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>${title}</h2>
<p>
${description}
</p>
</body>
</html>
`;
response.writeHead(200);
response.end(template);//이 코드가 사용자가 실행하고 싶은 파일을 넣는다.
//javascript를 통해서 우리가 읽어드려야 하는 파일을 만든 것이다.
// 사용자가 생성한 파일을 전송한다.
})
} else {
response.writeHead(404);
response.end('Not found');
}
});
app.listen(3000); //포트 번호를 3000번으로 지정위 코드 중 Not Found페이지를 만드는 것만 설명해본다.
먼저 pathname을 알아야한다.
console.log(url.parse(_url, true));입력하면 다음과 같은 결과가 출력된다.
여기서 pathname을 찾는 코드를 작성한다.
var pathname = url.parse(_url, true).pathname;그리고 조건문을 써서 pathname이 /와 같다면 우리가 원하는 웹페이지를 출력하고 그렇지 않다면 Not Found 페이지를 출력하는 것이다.
if (pathname === '/') {
fs.readFile(`data/${queryData.id}`, 'utf8', function (err, description) {
var template = `
<!doctype html>
<html>
<head>
<title>WEB1 - ${title}</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>${title}</h2>
<p>
${description}
</p>
</body>
</html>
`;
response.writeHead(200);
response.end(template);//이 코드가 사용자가 실행하고 싶은 파일을 넣는다.
//javascript를 통해서 우리가 읽어드려야 하는 파일을 만든 것이다.
// 사용자가 생성한 파일을 전송한다.
})
} else {
response.writeHead(404);
response.end('Not found');
}결과는 다음과 같다.
안녕하세요 프론트엔드 개발자입니다. 글을 이전 중입니다.