[Node.js] REST

REST(REpresentational State Transfer)의 줄임말이며, 서버의 자원을 정의하고 자원에 대한 주소를 지정하는 방법을 가리킨다. html, css 등과 같이 파일의 주소를 가리키는 역할을 한다고 보면 될 것 같다.

 

HTTP의 메소드로 책에서는 총 6가지를 알려준다.

 

GET : 서버 자원을 가져오고 싶을 때 사용

POST : 서버에 자원을 새로 등록하고자 할 때 사용

PUT : 서버의 자원을 요청에 들어 있는 자원으로 치환하고자 할 때 사용

PATCH : 서버 자원의 일부만 수정하고자 할 때 사용

DELETE : 서버의 자원을 샂게하고자 할 때 사용

OPTIONS : 요청을 하기 전에 통신 옵션을 설명하기 위해 사용

 

이 메소드들을 통해서 통신을 할 때 어떤 목적인지에 대해서 유추가 가능하다. 그리고 이것저것 다양하게 막 코드를 썼는데 현재는 Node.js를 공부 중이니 다른 것보다 서버관련해서만 코드를 리뷰해보겠다.

 

const http = require('http');
const { resourceUsage } = require('process');
const fs = require('fs').promises;

const users = {};

http.createServer(async (req, res) => {
    try{
        console.log(req.method, req.url);
        if(req.method === 'GET'){
            if (req.url === '/'){
                const data = await fs.readFile('./restFront.html');
                res.writeHead(200, {'Content-Type' : 'text/html; charset=utf8'});
                return res.end(data);
            } else if(req.url === '/about'){
                const data = await fs.readFile('./about.html');
                res.writeHead(200, {'Content-Type' : 'text/html; charset=utf8'});
                return res.end(data);
            } else if(req.url === '/users'){
                res.writeHead(200, {'Content-Type' : 'text/plain; charset=utf8'});
                return res.end(JSON.stringify(users));
            }

            try {
                const data = await fs.readFile(`.${req.url}`);
                return res.end(data);
            } catch (err){

            }
        }
...

 

일단 http 와 fs는 하도 많이 봤지만 fs에 promises형식으로 사용할 수 있도록 선언을 해주었다. 그리고 users에는 POST를 통해서 등록한 정보가 들어갈 예정이다.

 

일단 GET method일 때의 반응이다. GET은 요청을 하는 method니 버튼을 누르거나 혹은 정보를 보내거나 여러가지에 대처한다. 여기서는 '/' , '/about' , '/users' 이렇게 총 3가지로 나누어서 매칭을 했다.

 

'/'일 때는 restFront.html이라고 하여 home을 나타내는 html의 data를 받아서 res.end(data)를 통해서 html을 띄워준다.

'/about'도 마찬가지로 ./about.html을 띄워준다.

'/users'는 위의 2가지와는 다르게 text/plain을 통해서 JSON 만을 넘겨준다. 이 때 넘겨주는 자료는 users이며 users에 추가 혹은 삭제, 수정이 일어나면 변경이 일어난 users를 JSON 형식으로 넘겨주는 역할을 한다.

 

그리고 try{...}catch(err){...}는 res.end()가 일어나지 않고 오류가 발생했을 때 그거에 적합한 오류 페이지를 띄워준다.

 

...
	else if(req.method === 'POST'){
            if(req.url === '/user'){
                let body = '';
                req.on('data', (data) => {
                    body += data;
                });
                return req.on('end', () => {
                    console.log('POST 본문(Body):', body);
                    const { name } = JSON.parse(body);
                    const id = Date.now();
                    users[id] = name;
                    res.writeHead(201);
                    res.end('등록 성공');
                });
            } 
...

 

이어서 위의 GET와 다르게 정보를 등록하는 POST method이다. 위의 GET에서의 users는 현재의 users 데이터를 가져오는 역할을 하며 여기서는 갱신된 users를 서버로 보내는 역할을 한다.

요청이 끝이나면 JSON.parse를 통해서 body를 나누어 name에 현재시간을 id로 가지는 JSON파일을 users에 저장한다.

 

...
	else if(req.method === 'PUT'){
            if(req.url.startsWith('/user/')){
                const key = req.url.split('/')[2];
                let body = '';
                req.on('data', (data) => {
                    body += data;
                });
                return req.on('end', () => {
                    console.log('PUT 본문(Body):', body);
                    users[key] = JSON.parse(body).name;
                    return res.end(JSON.stringify(users));
                });
            }
...

 

이번에는 PUT이다. PUT은 users에서 수정할 때 사용하며 JSON 파일에서 수정하려는 정보를 가지고 와서 정보를 수정한 후 users에 저장한다. 그리고 생신된 내용을 return 한다.

 

...
	else if(req.method === 'DELETE'){
            if(req.url.startsWith('/user/')){
                const key = req.url.split('/')[2];
                delete users[key];
                return res.end(JSON.stringify(users));
            }
        }
        res.writeHead(404);
        return res.end('NOT FOUND');
    } catch(err){
        console.log(err);
        res.writeHead(500, {'Content-Type' : 'text/html; charset=utf8'});
        res.end(err.message);
    }
})
    .listen(8082, () => {
        console.log('8082포트에서 서버 대기 중입니다.');
    });

 

마지막으로 DELETE이다. DELETE는 이름답게 정보를 삭제하는 역할을 한다. users에서 key를 기준으로 정보를 찾아서 delete를 통해서 users의 내요을 지웠다. 그리고 갱신된 내용을 return 한다.

 

그 밑은 처리되지않은 method가 들어오면 404를 띄우고 아니고 오류가 나면 오류 message를 띄운다. 그리고 8082포트로 서버가 실행되도록 하였다.

 

 

이렇게 개발자 도구를 이용해서 오른쪽 밑의 다양한 자원을 확인하면서 결과를 확인할 수 있다.

여기서 사용자를 추가하면

 

추가를 하면 위의 js파일은 불러오기라서 제외하고 POST method인 user를 통해서 사용자를 등록하고 users를 GET으로 가지고 와서 users에 정보를 추가한 모습이다.

 

 

users를 눌러보면 이렇게 확인이 가능하다.

about을 눌러보면

 

 

이렇게 페이지가 뜨면서 GET으로 about 주소와 css만을 요청하였다. 여기서는 추가, 삭제, 수정이 일어나지 않고 그냥 가져오기만 했기 때문에 GET만이 존재하는 것을 알 수 있다.

 

이렇게 REST 서버를 만들어보았다. 현재 users에 저장된 데이터는 데이터베이스를 사용하거나 혹은 로컬에 저장된 것이 아니라 서버에서 저장된 것이기 때문에 서버를 끄게된다면 사라지는 정보이다. 영구저장을 위해서는 데이버테이스가 필요하다.