[Node.js] ejs 파일에서 변수를 불러오지 못할 경우 에러 처리 방법

이번에는 ejs 파일에 있는 변수를 찾을수 없을때 에러처리 방법을 설명드리겠습니다.
ejs로 웹서버를 만드실때 필수로 알고 계셔야 합니다.
에러 처리를 안해줬을 때 서버측 오류로 변수전달이 실패되면 사이트가 죽어버리는 상황이 발생할 수 있기 때문입니다.

설명을 시작하기 전에 ejs 파일로 변수 전송하는 방법을 이해하지 못하셨다면

이 글을 참고하셔서 ejs 변수 전달에 대해서 이해하시고 이 글을 보시면 되겠습니다.

기존 에러처리를 하지 않은 코드

현재 이렇게 index.ejs 파일이 구성되어 있습니다. 이 상태에서 express 서버로 접속하게 되면

위 사진과 같이 정상적으로 랜더링 된 모습을 볼 수 있죠. 그런데 만약 서버측 (오른쪽 index.js) 에서 어떠한 오류로 인해 변수를 전달하지 못했다면 어떻게 될까요?

오류 예시를 위해 des 변수를 서버측에서 지운 모습

위 사진과 같이 ejs 에러가 표시되고 node js 서버가 강제종료됩니다. 이제부터 변수를 찾지 못하였을때 아무것도 표시가 안되게 구문을 변경해 보겠습니다.

저는 <%=title %> 이 부분을 아래와 같이 변경해 줬습니다.

 <% if (locals.title) { %>
            <%= title %>
          <% } %>

ejs 구문으로 if 문으로 변경하였고 변수 앞에 locals. 라는 조건을 넣어줬습니다. 여기서 핵심은 locals 입니다. locals 를 붙여줌으로써 ejs 파일에서 변수를 불러오지 못하였을 경우에 if 문 안에 있는 값을 읽지 않고 넘어갈 수 있게 처리한 것입니다.

ejs 파일에 구문을 변경한 모습

이제 다시한번 express 앱으로 접속해 보겠습니다.

정상적으로 잘 표시됩니다. 이제 한번 서버측 (오른쪽 index.js) 에서 title 변수를 지워보겠습니다.

결과는 위 사진과 같이 오류가 발생하지 않고 title 변수를 랜더링 하지 않게 하여 express 서버가 꺼지지 않았습니다.

근데 여기서 저렇게 표시되면 사용자는 어떤 문제인지 모르겠죠? 그래서 전 설명을 따로 추가했습니다.

else 문을 추가하여 title 변수를 불러오지 못했을때 “제목을 불러오지 못함” 이라는 텍스트를 출력하게 하였습니다. 이렇게 처리하면 어떤 부분에서 오류가 발생했는지 찾기 쉬워지고 변수가 랜더링되지 않아 레이아웃이 깨지는 상황이 생지기 않게 할 수 있습니다.

제목을 불러오지 못함 텍스트가 정상적으로 출력됨

결과는 title 변수를 불러오지 못했기 때문에 정상적으로 “제목을 불러오지 못함” 텍스트가 표시된 것을 볼 수 있습니다.

이렇게 해서 express + ejs 서버에서 ejs 파일 변수 에러처리를 하는 방법을 알아봤습니다.

이해가 안되시는 부분 , 오류 및 틀린부분은 언제든지 댓글에다가 적어주시면 감사하겠습니다.

감사합니다!

0 0 votes
Article Rating
Subscribe
Notify of
guest

0 Comments
Inline Feedbacks
View all comments