GET 방식의 요청과 응답
웹 브라우저에서 웹 서버로 요청을 보내는 방식은 크게
get방식과post방식이 있다.get방식은 URL에 queryString 형태로 데이터를 담아 웹 서버에게 요청을 보내는 방식이다.
app.get("/" , (req,res) => {
let name = req.query.name;
res.render('index.html', { birdName: name});
});위와 같은 형태로 파일이 작성되어 있다고 했을 때 app.get() 메소드의 콜백함수에게 전달된 req객체를 이용하면 get방식으로 요청이 들어왔을 때 querySring에 있는 데이터를 가져와서 html 파일에서 사용할 수 있다. URL과 queryString은 ?를 구분자로 그 내용이 나뉘게 되는데 웹 브라우저의 주소창에 localhost:3000/birds/?name=blackbird 를 입력해서 웹 서버에게 요청을 보내면 app.get() 메소드의 콜백함수 안에 있는 req 객체를 이용해 queryString으로 전달된 데이터를 받아올 수 있다.
POST 방식의 요청과 응답
post 방식의 요청은 URL에 queryString을 붙여서 데이터를 전달하는 get방식과 달리 HTTP 패킷의 Body 영역에 queryString 형태로 데이터를 담아서 요청을 보내는 방식이다.
<form method="post" action="/birds">에 의해 input 박스에 입력된 내용들을 가지고 post 방식으로 서버에게 요청을 보내면 app.post() 메소드를 통해 요청을 받을 수 있다.
app.post("/birds", (req,res) => {
res.send("POST 방식입니다.");
});앞서 얘기한 것과 같이 post 방식의 요청은 URL에 queryString을 붙인 형태가 아닌 HTTP 패킷의 Request Body 부분에 queryString 형태로 데이터를 담아서 내용을 전달한다.
req.body 속성을 사용해 body 영역의 데이터를 가져오기 위한 방법으로 외부 라이브러리를 이용하는 방법과 express에 내장된 함수를 이용하는 방법이 있다.
app.use(express.urlencoded({extended : true})
app.post("/birds", (req,res) => {
const name = req.body;
res.send(`POST /birds response ${req.body.name}`)
});다음과 같은 구문을 추가하면 post 방식의 요청이 들어왔을 때 Request Body 영역의 데이터를 가져올 수 있도록 하는 세팅 작업을 해줘야만 한다. 해당 방법은 express에 내장된 함수를 이용하는 방법이다.
console.log(req.body)를 통해서 express가 Body 영역에 담겨있는 데이터를 제대로 가져오고 있는지 확인할 수 있다.
참고 🔗
"외부 라이브러리를 이용하는 방법은 body-parse라는 패키지를 이용하자 !"
