[EXPRESS in Node.js] 에러 미들웨어 - 사용자 Exception 이 404 핸들러로 빠지는 현상

안녕하세요 깍돌이입니다.

오늘은 Express.js의 에러 핸들러 처리에 대해서 작성하려고 합니다.

사실 기존에는 관련 내용 작성이 안되어있었는데 사실 검색하면 워낙 많이들 나오는 내용이라 작성하지 않았습니다.

기본적인것들로 블로그 포스팅을 다 채우고 싶지 않았습니다. ( 조회수는 많이 늘어날텐데 ㅎㅎ;;)

초창기에 기본적인거 쓴건 히스토리용으로 냅두고 있습니다.

 

그외에는 작업하면서 경험한것들 잊어 버리지 않기 위해서 작성하고 있습니다.

 

그럼 금일은 뭐때문에 작성하게 되었냐면 Express.js의 ERROR 처리를 위한 Middleware처리는 2개의 방법이 있습니다.

 

ERROR Middleware 500 

기본적인 500 에러입니다. express.js의 서버에서 오류가 났을 경우 흔히들 볼수있는 Internal Server Error 오류입니다.

그래서 express.js에서는 해당 에러를 처리하기 위해서

Express Router Controller안에 있는 next라는 함수를 통해서 해당 next에 error객체를 넣어서 넘기고있습니다. 

Express의 error객체를 next에 넘겨 버리게 되면 기본적인 Middleware패턴에서 해당 에러 객체를 가진 함수로 넘어가게 됩니다.

 

 

app.ts 의 구현부는 아래와 같습니다.

 

 

ERROR Middleware 404 

기본적으로 Express는 middleware 패턴이라는 것을 알고 있다는 것을 감안하고 작성하겠습니다.

 

위의 Express Router 안에서 예외처리를 하는 catch 문에서 next(error) 를 사용을 했다는 것은 기본적으로 Express에서 선언된 Router가 매치가 됐다는 뜻입니다.

 

예를들어

http://localhost:5555/testRouter

http://localhost:5555/testNotExist

로 요청시에

 

Express에 router.get('/testRouter') 만 있다면 아래의 testNotExist는 매치가 되지 않습니다. 

그렇기 때문에 결국 Express에서 선언되는 Middleware중 매치되는 것을 찾지 못하고 가장 마지막 Middleware로 가게되는데요

 

 

그래서 가장 마지막 생성된 함수의 Middleware 함수로 넘어가게되고 해당 함수에서는 매치된 값을 찾지 못하였다는 에러 메시지를 res객체를 통해 반환하는 함수가 됩니다.

그래서 404 와 그 외 내부 예외처리를 통한 500 에러 크게 2가지로 나눌 수 있습니다.

 

이슈상황

그래서 이슈상황이 뭐냐! 네 위에 설명과 다르게 동작하는 경우 입니다.

 

네 맞습니다. next에 error 객체를 넣어서 넘겼을 경우 Middleware (500) 에러 함수(ERROR 객체가 선언된 함수 ) 로 넘어가져야 합니다. 

그런데 위의 상황에서는 404 ( 라우트가 매치 되지않았을 경우 ) 로 넘어가게 됩니다.

 

물론 둘다 오류의 상황은 맞기 때문에 상관없지 않나? 라고 생각 할수 있습니다.

 

하지만 개발하였을때 예상하지 못한 동작의 흐름에 생겼을 경우는 코드를 작성한 사람의 문제일 확률이 매우 높고 앞으로도 제대로 알지 못하는 케이스가 발생가능하기 때문에 해당 원인을 찾아보고자 했습니다.

 

 

Express.js 홈페이지

500 에러 함수 설명

라우트 맨 마지막에 선언 하여야 하며 -> OK

err 에 대한 인수가 있어야합니다. -> OK 

 

 

"next() 함수로 어떠한 내용을 전달하는 경우('route'라는 문자열 제외), Express는 현재의 요청에 오류가 있는 것으로 간주하며, 오류 처리와 관련되지 않은 나머지 라우팅 및 미들웨어 함수를 건너뜁니다. 이러한 오류를 어떻게든 처리하기 원하는 경우, 다음 섹션에 설명된 것과 같이 오류 처리 라우트를 작성해야 합니다."

 

-> 조금 잘못알고 있었네요 next 함수로 어떠한 내용 전달시 요청 오류로 간주하고 나머지 라우팅 건너 뜀 ( 여튼 OK )

 

제가 사용하고있는 형태는 기본 오류 핸들러 ( 404가 아닌 모든 오류를 받아서 처리함 ) 로 보이는데 특이사항은 없어 보입니다.

 

그럼 원인은 하나일거같습니다. next로 error를 넣지 않는건가?

 

에러가 발생한 로직입니다.

HTTP 요청 중 URL 오류가 발생해서 해당 axios.get  부분에서 catch 로 빠진 부분인데요  실제로 에러 객체를 reject하였고

 

하나씩 모든 에러를 따라가다보니

 

중간에 reject를 error가 아닌 error.message 

ERROR객체가 아닌 string으로 한 부분이 있었습니다... ㅜ

황급히 수정시  

 

역시 코드를 거짓말을 하지 않습니다...

 

사실 잠깐 그냥 봤을때는 원인이 잘 안보였는데 포스팅 을 하면서 한땀한땀 찾아가다보니 복병을 발견했네요.. 

 

다시 이런일 없기를 바라면서 히스토리로 남겨놓겠습니다.

 

감사합니다.