18.[Node.js] GET, POST 요청

  클라이언트가 HTTP 서버를 요청할 때 우리는 URL과 Method를 사용한다. URL은 앞서 말했듯이 서버의 도메인과 파일 디렉토리를 지정해 주는 역할을 한다. 반면에 Method는 요청 방석을 정해주고 크게 2가지 메소드를 사용하게 된다. 바로 GET과 POST이다. GET 

1. GET 요청 처리

- GET 요청이란?

  GET 요청은 서버로 부터 정보를 조회하는데 사용한다. 가장 큰 특징은 서버에 요청하는 Query String에 우리가 전달하려는 데이터가 담기게 된다. 클라이언트가 서버에 대한 정보를 단순히 가져와 보고 싶은 경우에 GET을 사용하게 된다.

- GET 요청의 특징

• 서버 데이터 조회를 위해 사용
• Query String에 우리가 전달하려는 정보가 담기게 됨
• String 길이에 제한이 있으므로 많은 양의 데이터를 전송할 수 없음
• 중복된 요청이 발생하게 되는 경우 캐시 사용
• 동일한 데이터를 전송하는 경우 같은 결과값을 전달 받음

 

- GET 요청 확인

  GET 요청이 http 서버에서 어떻게 작용되는지 확인해보자. http 서버를 만들고 요청 객체(req)의 method가 'GET'인 경우 응답 객체(res)의 헤더에 200번 응답코드를 전달하고, 'hello world'를 출력한다. 그렇지 않는 경우 404 응답 코드를 전달하고 'Not Found Page'를 전달한다. Postman을 통해 두번의 요청을 보내보자. 

const http = require('http');
 
http.createServer(function (req, res) {
    let { url, headers, method } = req
 
    if(method === 'GET') {
        res.writeHead(200);
        res.end('hello world');
    }
 
    res.writeHead(404);
    res.end('Not Found Page!');
 
}).listen(3000, function(){
    console.log('server on : 3000port')
});

<GET 요청 결과>

<POST 요청 결과>

- GET 요청 응용

  GET 요청은 데이터에 있는 정보를 조회하기 위해서 사용한다. 또한 해당 데이터는 앞서 말한대로 Query에 있는 정보 전달로 구현된다. 다음과 같은 구문을 통해 우린 서버에서 원하는 정보를 전달 할 수 있다.

const http = require('http');
var url = require('url');
 
http.createServer(function (req, res) {
    let _url = req.url
    let query = url.parse(_url,true).query;
 
    if(req.method === 'GET') {
        res.writeHead(200, { 'Content-Type' : 'text/html' });
        res.end("name=" + query.name + " / team=" + query.team); 
         
    }
    res.writeHead(404);
    res.end('Not Found Page!');
 
}).listen(3000, function(){
    console.log('server on : 3000port')
});

  위와 같은 웹 서버를 구현했다. _url에 우리가 입력하게 된 url 정보를 담고 query에는 사용자가 url을 통해 입력하게 되는 GET 형식의 변수가 담기게 될 것이다. 그리고 qurey에는 두가지 변수인 name과 team이 담긴다. 위와 같이 변수를 선언하고 GET 형식의 요청을 실행한다.

1) http://localhost:3000/?name=Rudy%20Gobert&team=Utah%20Jazz

• name = Rudy Gobery
• team = Utah Jazz

2) http://localhost:3000/?name=Andrew%20Wiggins&team=Golden%20States%20Warriors

• name = Andrew Wiggins
• team = Golden States Warriors

2. POST 요청 처리

- POST 요청이란?

  POST 요청은 우리가 서버에 있는 데이터를 변화시키기 위해 사용된다. 서버에 전달하려는 데이터가 Body에 담겨 직접 전달된다. 따라서 GET 방식보다 보안성이 더 좋다.

- POST 요청의 특징

• 서버에 있는 데이터 변경을 위해 사용
• Body에 정보가 담겨 서버에 전달되 보안성이 좋음
• GET 방식 보다 많은 양의 데이터 전송이 가능
• 같은 데이터를 전송해도 서버의 상태나 변경 여부에 따라 다른 결과값이 출력 될 수 있음

- POST 요청 확인

  POST 요청 역시 method가 POST인지 확인하는 방법으로 요청에 대한 검사를 진행할 수 있다.

const http = require('http');
 
http.createServer(function (req, res) {
    let { url, headers, method } = req
 
    if(method === 'POST') {
        res.writeHead(200);
        res.end('hello world');
    }
 
    res.writeHead(404);
    res.end('Not Found Page!');
 
}).listen(3000, function(){
    console.log('server on : 3000port')
});
 

<GET 요청 결과>

<POST 요청 결과>

- POST 데이터 전달

  POST를 통해 요청 객체에 body에 들어가는 데이터를 전달할 수 있다. 다음과 같은 구조로 POST 데이터를 보내게 된다면 Parsing이 가능하다.

const http = require('http');
 
http.createServer(function (req, res) {
    let { url, headers, method } = req
    let body = {};
 
    
    req.on('data', (data) => {
        data.toString().split('&').map(item => {
            let s = item.split('=')
            let key = s[0]
            let value = s[1]
            body[key] = value
        })
    }).on('end', () => {
        for(let i = 0; i < 10 ; i++){
            console.log(i)
        }
        
    }).on('error',(err) => {
        console.log(err)
    });
 
    if(method === 'POST') {
        res.writeHead(200);
    }
 
    res.writeHead(404);
    res.end('Not Found Page!');
 
}).listen(3000, function(){
    console.log('server on : 3000port')
});
 

- POST 응용 예제

  POST에서 데이터가 어떤 식으로 전달 되는지 알아보자. 다음과 같이 POST 메소드를 사용할 때 데이터를 다음과 같이 읽는다. 요청 객체 (req)에서 data를 읽는 함수는 chunk이다. chunk function을 통해 데이터를 받고, querystring 형태로 받은 데이터를 각각의 데이터와 변수로 나누기 위해 아래와 같이 선언한다.

var data = queryString.parse(chunk.toString());

  이 과정을 통해 data 부분에 각각의 변수 별로 데이터를 담을 수 있게 되었다. 전체 Node.js 코드는 아래와 같을 것이다.

const http = require('http');
 
var queryString = require('querystring');
 
http.createServer(function (req, res) {
    if(req.method === 'POST') {
        req.on('data', function(chunk) {
            
            var data = queryString.parse(chunk.toString());
            console.log("Name :" + data.pname);
            console.log("Team :" + data.team);
            res.writeHead(200, {'Content-Type':'text/html'});
            res.end('name: ' + data.pname + ' / team: ' + data.team);
        });
    }
 
}).listen(3000, function(){
    console.log('server on : 3000port')
});
 

  이제 POST 요청을 통해 데이터를 전달하자 POSTMAN의 parms 기능을 통해 body 데이터를 선언하고 POST 요청을 하면 다음과 같은 결과를 볼 수 있다.

<POST 요청 결과>

<Node.js Terminal>

  데이터 변화 확인을 위한 로그는 아래와 같이 나온다.