Node.js.32.App 제작-POST 방식으로 전송된 데이터 받기

목표

Post방식으로 전송된 데이터를 Node.js안에서 가져오기

 

---

form의 action을 http://localhost:3000/create_process 로 수정하고, pathname이 /create_process일 때 전송된 데이터를 받기 위해 조건문 블록을 추가한다.

    }else if(pathname === "/create_process"){
      response.writeHead(200);  //200: 파일을 성공적으로 전송하였음
      response.end("success");
    }

아래 코드를 추가하여 파일을 성공적으로 전송했다는 것을 보내게 되면 이제 Status는 200으로 뜬다.

 

Google에 Nodejs post data를 검색해보자.

How to process POST data in Node.js?

여기서 request는 아래 코드의 request이다.

var app = http.createServer(function(request, response) { ...

createServer의 콜백함수를 살펴보자. createServer는 웹 브라우저의 접속이 들어올 때마다 createServer의 콜백함수를 Nodejs가 호출한다. 이때 함수에 인자 두 개를 준다.

• request: 사용자가 요청할 때 웹 브라우저가 보내는 정보를 담음
• response: 응답할 때 우리가 웹 브라우저에게 전송할 정보를 담음

 

---

      request.on('data', function(data){

      });

request.on('data', ... : 웹 브라우저가 POST방식으로 데이터를 전송할 때, 데이터가 엄청 많으면 한 번에 처리하다가 컴퓨터에 무리가 간다. 그래서 Nodejs에서는 POST방식으로 전송되는 데이터가 많을 경우를 대비하여 request.on('data' 방식을 사용한다.

데이터는 들어올 때마다 'data'의 callback function이 호출된다. 예로 들어서 데이터가 100만큼 있으면 조각조각의 양들을 서버 속에서 수신할 때마다 콜백함수를 호출하도록 약속되어 있다. 그리고 호출할 때마다 data라는 인자를 통해 수신된 정보를 주기로 약속하고 있다.

      request.on('data', function(data){
        body = body + data;
      });

따라서 위와 같이 작성하면 수신된 data를 body에 추가된다.

 

그렇게 데이터가 조각조각 들어오다가 이제 더 이상 들어올 데이터가 없다면

      request.on('end', function(){

      });

'end'의 callback function이 호출된다. 즉, 'end'에 해당하는 콜백이 실행되면 정보수신이 끝났다고 생각하면 된다. 

var qs = require('qs');

qs모듈을 맨 위에 추가하고,

var post = qs.parse(body);

 qs모듈 중 parse()함수에 우리가 지금껏 저장한 body를 입력값으로 주면, 변수 post에 사용자로부터 전송된 post 데이터가 들어있다. 정말 들어있는지 console을 통해 확인해보자.

      request.on('end', function(){
        var post = qs.parse(body);
        console.log(body);
        console.log(post);
      });

나는 post와 body의 값 차이도 궁금해서 추가로 콘솔 찍어보았다.

• body: title=hi&description=bye
• post: { title: 'hi', description: 'bye' }

즉, 사용자로부터 받은 데이터를 추가한 body는 query string형태를 띄고,

qs.parse를 통해 body를 정리한 post는 Object 형태를 띈다. Object에서 일부 title 값만 가져오고 싶다면 post.title 작성하면 된다. 확인해보자.

      request.on('end', function(){
        var post = qs.parse(body);
        console.log(body);
        console.log(post);
        console.log(post.title);
        console.log(post.description);
      });

즉, 아래와 같이 활용할 수 있다.

      request.on('end', function(){
        var post = qs.parse(body);
        var title = post.title;
        var description = post.description;
      });

 

---

"

이처럼 'data'와 'end'를 우리는 이벤트라고 한다.

이를 이용하여 웹 브라우저로부터 POST방식으로 전송된 데이터를 가져오고, ('data')

query string 모듈의 parse()함수를 이용하여 정보를 객체화할 수 있다. ('end')

"