[Node] Express 서버 만들기 - 3 / post 함수

[Node] Express 서버 만들기 - post 함수

내용이 이어지므로 이전 게시글 내용을 이해하고 있어야 합니다.

[공유/Node] - [Node] Express 서버 만들기 - 2 / get 함수

 

이번 게시글에서 알아볼 내용은 post 함수입니다. get은 무언가를 서버로부터 가져온다라는 개념이면 post는 서버로 무엇을 넣는다는 개념으로 이해하시면 편합니다.

 

우선 서버에 post 요청이 오는 경우 처리할 수 있도록 코드를 추가하도록 하겠습니다. 해당 함수는 클라이언트에서 보낸 데이터를 출력하고 응답으로 html을 돌려주는 함수입니다.

app.post("/", (req, res) => {
    console.log("req.body", req.body);
    res.send(`<h1>HTML H1</h1>`);
});

그 다음 postman을 이용하여 서버로 post 요청을 하였습니다.

postman에서 정상적으로 json 데이터를 보냈지만 서버에서는 해당 데이터를 확인할 수 없습니다. 왜 그럴까? 서버에서 해당 데이터를 파싱할 수 있는 장치가 없습니다. (middlerware)

 

json 데이터를 파싱할 수 있는 방법은 쉽습니다. body-parser 패키지를 설치해줍니다.

명령어 : yarn add body-parser

 

그리고 bodyParser를 import 해준 후 app.use(bodyParser.json())을 해줍니다. 최종 코드는 아래와 같습니다.

import express from "express";

const PORT = 3000; // 서버에 사용할 포트 번호
const app = express();

app.use(express.json());

app.get("/", (req, res) => {
  console.log("req.query", req.query);
  res.send(`<h1>HTML H1</h1>`);
});

app.post("/", (req, res) => {
  console.log("req.body", req.body);
  res.send(`<h1>HTML H1</h1>`);
});

app.listen(PORT, () =>
  console.log(`Express server : http://localhost:${PORT}`)
);

이제 정상적으로 body가 파싱되어 데이터가 보이는 것을 확인할 수 있습니다. 그런데 이제 body-parser package를 사용하지 않아도 됩니다. express에서 지원하기 떄문에 app.use(express.json())으로 수정하시면 됩니다.

 

사실 이번 게시글에서 상세히 다루진 않지만 body의 데이터에 따라 header의 content-type이 달라져야합니다. 해당 content-type을 기반으로 body에 어떤 데이터가 있는 지 알고 파싱을 해야하기 때문입니다. 그냥 지금은 이런 게 있구나 정도만 이해하시면 될 것 같습니다.

참고

코드는 해당 github에서 다운 받으시면 됩니다.링크 : 이동하기

마지막

해당 내용은 틀릴 수도 있다는 것을 감안하여 봐주세요. 틀린 내용 및 오탈자 수정 요청 환영입니다.