http 요청,응답 동작 테스트 / curl 과 Postman

 

백엔드 테스트 하는 방법?!

 

어제 git/github을 통해서 처음으로 다른 사람들과 같이 코딩을 해보았다. 나는 프론트, 다른 두 분은 백엔드였다.

근데 git으로 branch를 나눠서 하고 있는 와중에 의문점이 든게 프론트를 맡은 내가 html파일을 만들어주지 않았는데,

백엔드하시는 분들이 어떻게 브라우저 화면없이 각 라우터들의 동작을 확인하지 싶었다...

 

그래서 오늘은 백엔드가 이 요청/응답 동작을 어떻게 테스트 하는지에 대해 배웠다.

즉, html (화면)이 완성되기 전에 post 요청이 잘 받아지는지, 데이터 전달이 잘 되어는지 우리가 임의로 테스트가 가능하다.

 

우선 여러 방법이 있겠지만 curl 을 활용하는 법 그리고 postman 툴에 대해 알아보았다. 

 

1/ curl 

커맨드라인 상의 툴, 커맨드라인에서 http 패킷 및 데이터 전송을 도와주는 도구

apt-get install curl로 우분투에 설치가 가능하다.

 

http 패킷이 뭘까? 

클라이언트가 서버에게 요청할 때 보내는 데이터를 http 패킷 이라고 한다.

즉, 요청 헤더(req.headers) + 요청 바디(req.body) = http 패킷이다. 

 

우선, curl은 get 요청이 default 값이다.

그래서 curl http://localhost:3000 하면 해당 url의 html 파일이 출력되어서 나온다.

 

이때, 만약, localhost:3000에 대한 get 요청 router를 만들어두지 않으면?

그래도 그냥 html text가 출력된다.

대신 브라우저에서 get 응답을 못받았을 때 보여주는 Cannot GET도 찍혀나온다.

 

 

근데 이건 누가 줄까? express가 준다.

브라우저없이 요청/응답을 하고있는 상황인데 내용이 보인다는건 결국에 이 데이터는 express가 주는 것이다.

해당 라우터가 없을 땐 express가 자체적으로 던져주게끔 만들어져있다.

 

curl은 여러 옵션을 넣어서 활용이 가능하다. 그 중에서도 오늘은 -X, -d, -H를 배웠다. 

 

curl의 옵션들

-X : http 요청 메소드 정해줌
-d : 요청 body 나 요청 headers 로 보내줄 데이터를 쓸 수 있게 해준다.
-H : 요청 headers의 옵션들을 조작 가능하게 해준다. 

 

 

#1. curl -X 와 curl -d를 써보자 

 

router를 설정할 때 우리가 이렇게 같은 url이여도 요청메소드 get이냐 post냐에 따라서 다른 응답을 줬었다. 

 

app.get('/user/login', (req,res)=> 어쩌고저쩌고) : 로그인 화면을 렌더해주는 응답

app.post('/user/login',(req,res)=> 어쩌고저쩌고) : 로그인한 사용자 데이터를 가져오는 응답

 

브라우저에서 직접 확인해보는 방법말고 이렇게 curl에서 요청 메소드 옵션을 선택해서 테스트를 해볼수가 있다.

 

curl -X POST -d "name=yjlee" http://localhost:3000

localhost:3000로 받은 post 요청/응답을 테스트할거임
post요청으로 받은 클라이언트의 입력 데이터가 요청 headers가 아니라, 요청 body에 들어간다.

즉, name=yjlee 라는 텍스트(데이터)는 요청 body에 실어서 서버에게 보낼 것이다.  

 

그래서 잘받았나확인해보려고 post 라우터 상에서 req.body를 출력해보면?

undefined로 뜬다. 

 

 

왜냐면, 현재 body-parser(미들웨어)가 없어서 req.body를 해석하지 못한다.

 

 

그래서 상기 미들웨어를 넣어주면?

POST요청으로 들어온 데이터(req.body)가 파싱되어서 출력됨을 확인할수 있다.

 

 

이때, JSON.stringify() api를  써주면?

 

JS 값이나 객체를 JSON 문자열로 변환해준다.

 

(key값에 쌍따옴표가 붙는다) 

 

 

#2. curl -H 옵션 사용해보자 

 

우리는 curl의 -H 옵션으로 req.headers (요청 헤더)에 내용을 추가/조작해서 보낼수가 있다

 

 

 

content-type이 application/x-www-form-urlencode 일 때는 쿼리스트링대로 객체가 출력되었으나,

content-type을 JSON으로 조작하고 실행하면, 빈 객체가 출력된다. 

 

이말인즉슨 이 미들웨어 app.use(express.urlencoded({extended:true,}) 는
요청 쪽 body 데이터가 있을 때마다 실행하는 게 아니라 
요청 헤더 내용 중 content-type이 application/x-www-form-urlencode 일때만 실행된다.

 

 

이 때, 아래의 json으로 해석해주는 미들웨어 코드를 넣어주면, req.body가 출력이 된다.

미들웨어 app.use(express.json())은
요청 헤더 내용 중 content-type이 application/json 일 때 실행된다.

 

 

app.use(express.json()) 는 요청 body영역에 있는 string을  json형태로 나오게해준다.

 

2/ POSTMAN

 

프론트엔드, 백엔드 같이 개발시작했는데,

백엔드가 먼저 완성됐지만, post router에 대한 결과값을 알고 싶은데, 화면을 나타내줄 html이 없다면?

 

curl을 사용하지만.. 살짝 귀찮다.. 그래서 GUI 화면으로 확인할수있는 프로그램이 있다

그게 바로 POSTMAN 이다.