express: 413 payload too large 에러 해결하기

 

얼마 전 회사에서 express로 백엔드 개발을 하다가 프론트엔드의 요청에 대해서 413 에러가 발생하였습니다.

 

이에 대한 해결 방법을 간단하게 공유해보도록 하겠습니다.

 

문제점

 

먼저 알아볼 내용은 413 에러가 어떤 에러인지 파악하는 것이었습니다.

 

HTTP 상태 코드에서 413 상태 코드는 Payload Too Large 상태를 의미하는 것으로 요청 Entity가 서버에 정의된 제한보다 크다는 것을 의미합니다. (Request Entity Too Large라는 의미이기도 합니다.)

 

즉  request 크기가 서버에서 제한해놓은 사이즈보다 크다는 것을 나타내는 것입니다.

 

따라서 해당 제한을 풀어주면 문제는 자연스럽게 해결됩니다.

 

제가 구축한 Rest API 서비스는 EC2(리눅스)에 express 서버가 띄워져 있고 이를 Nginx에서 받아서 Reverse proxy를 통해 호스팅을 하고 있었는데요,

 

따라서 먼저 앞단의 Nginx 쪽 옵션의 reqest 용량 제한을 풀어서 이를 해결해보려고 시도해보았습니다.

 

Nginx에서의 client_max_body_size로 사이즈 제한 풀어주기

 

Nginx에서 request의 용량 제한을 풀기 위해서는 client_max_body_size 설정을 바꿔주면 됩니다.

 

client_max_body_size를 설정하게 되면 request의 Content-Length 값이 설정된 값을 넘을 수 없습니다.

 

client_max_body_size의 기본값은 1M이고, 이를 넘은 요청이 들어오면 414 에러가 발생합니다.

 

따라서 이를 10M로 변경하여 용량 제한을 10M로 바꾸어 주었습니다.

 

nginx.conf 파일

 

client_max_body_size를 0으로 설정하면 업로드 용량 제한을 아예 풀어줄 수도 있습니다.

 

 

위처럼 Nginx 설정을 했는데도 413 에러는 해결되지 않았는데요, 문제는 nodejs 웹서버에서 발생할 수도 있다고 생각해보고 실제 express로 구현된 nodejs서버에서 해결법을 한번 찾아보았습니다.

 

Express에서의 사이즈 제한 풀어주기

 

보통 nodejs에서 request의 내용을 파싱 하여 라우터가 이용할 수 있도록 보통 두 가지 파서를 등록하게 되는데요

 

body-parser의 json 파서와 urlencoded 파서입니다.

(body-parser는 express v4.16.0 버전 이후부터는 express 자체 패키지에 포함되어있습니다.

 

nodejs에서 413 payload too large 에러는 파서가 읽을 수 있는 데이터 허용치보다 request가 보낸 데이터의 크기가 클 때에도 발생합니다.

 

기본값으로는 json파서와 urlencoded 파서는 100kb만 파싱 할 수 있도록 설정되어 있는데요, 아래와 같이 파서 옵션 중 limit 옵션을 이용하여 최대 파싱 허용 용량을 설정할 수 있습니다.

 

app.use(express.json({limit: '100mb'}));
app.use(express.urlencoded({limit: '100mb', extended: false}));

 

마무리

 

413 에러에 대해 원인을 알아보고 nginx와 nodejs 서버에서 어떻게 이를 처리하는지 간단하게 알아보았습니다.

 

앞으로도 express 개발 중 만나는 에러에 대한 해결법을 간략하게 블로그에 업로드할 예정입니다.

 

감사합니다.

 

참고

 

HTTP 응답코드 413(PayloadTooLargeError: request entity too large) 원인, 해결

 

[Node.js] PayloadTooLargeError: request entity too large