Joi 폼으로 날린 데이터 못받아오는 문제 (Undefined) :: 트러블 슈팅

Joi 폼데이터 Undefined 문제

 

목차

- 문제 상황

- 문제 원인

- 문제 해결

- 결론

- 참고자료

 

문제 상황

조이를 사용해 유효성 검증 미들웨어를 만들었고 포스트맨으로 form 데이터 요청을 날렸는데 데이터를 아예 받아오지 못하는 문제 발생

아래 콘솔에 찍힌 value값을 보면 분명히 폼으로 전송했는데도 불구하고 객체 안에 아무 값도 들어있지 않은 것을 볼 수 있다.

폼으로 날리면 위처럼 required 조건에 걸려서 에러메시지가 뜨는데

이렇게 json 바디로 날리면

nickname을 잘 받아와서 다음 조건까지 가는 것을 볼 수 있다.

 

왜 폼데이터로 날린 값만 못받아올까?

 

 

문제 원인

문제를 해결할 수 있는 힌트는 body-parser 공식 문서에 나와있었다. body-parser 가 multipart bodies를 다루지 않기 때문에 발생하는 문제

위 이미지는 멀터 공식문서의 일부를 캡쳐해온 사진이다. 해석을 해보면 이렇다.

body-parser는 multipart bodies를 다루지 않는다. 멀티파트 데이터의 경우 너무 광범위하고 복잡하다. 멀티파트 바디를 다루기 위해서는 아래 모듈을 사용해야한다.
- busboy 그리고 connect-busboy
- multiparty 그리고 connect-multiparty
- formidable
- multer

 

나는 이미 멀터 미들웨어를 구축해 놓았기 때문에 멀터를 사용해서 멀티파트 바디를 다루도록 하겠다. " 클라이언트에서 전송한 데이터를 읽기 위해 서버는 multer을 통해 reqest 값을 얻어야 함 "이게 핵심이다.

 

 

 

문제 해결

multer middleware를 거쳐서 joi validation 검사를 수행하도록 미들웨어 거치는 순서를 바꿔주면 된다.

 

변경 전 코드

router.post(
    '/', 
    authMiddleware, 
    validationMiddleware(userValidation.user), 
    representProfileUpload, 
    this.userControllers.getRepeuiredUserInfo 
);

 

변경 후 코드

router.post(
    '/',
    authMiddleware,
    representProfileUpload, 
    validationMiddleware(userValidation.user),
    this.userControllers.getRepeuiredUserInfo 
);

 

참고 자료

힌트가 된 개발자 커뮤니티 글

https://okky.kr/articles/656251

OKKY - Node.js에서 FormData가 undefined인 문제 해결좀 부탁드립니다 ㅠㅠ

body-parser 공식 문서

https://www.npmjs.com/package/body-parser#readme

body-parser