웹개발 및 최신 테크 소식을 전하는 블로그, 웹이즈프리

HOME > webdevetc

[nodejs] 서버 인코딩 Header utf-8 설정하기, 한글 이슈 해결

Last Modified : 2023-11-07 / Created : 2022-06-13
9,309
View Count
최근 nodejs를 사용하여 백엔드 api 서버를 구축하였습니다. 구축 후 확인해보니 브라우저에서 한글 인코딩이 깨져서 나타나는 이슈가 발생하였더군요. 원인과 해결 방법에 대하여 간략히 알아보겠습니다.



# nodejs 서버에 인코딩 설정하기


우선 원인을 생각해보니 아무래도 한글 깨짐 현상은 보통 인코딩을 설정하지 않아 발생한 이슈일꺼라 생각했습니다. 그래서 response header에 인코딩을 급하게 설정 후 다시 확인해보니 정상 동작하는 것을 확인했습니다. 역시 인코딩 문제가 확실했습니다. 문제를 해결한 nodejs에서 response 응답 헤더를 utf-8로 설정하는 방법에 대하여 간략하게 알아봅니다.


! nodejs 응답 헤더 utf-8 설정하기


웹브라우저에서 한글이 깨지는 경우 가장 먼저 확인하는 것이 바로 인코딩입니다. 인코딩 이슈가 발견되었다면 어디서 발생했는지 그 대상을 찾아야 하는데요 ~ 대부분 데이터베이스의 인코딩 문제이거나 아니면 백엔드 언어에서의 인코딩 설정 문제일 것 입니다.

- 데이터베이스 인코딩 설정
- 백엔드 서버 언어의 인코딩 설정

제 웹사이트는 기존에 다른 언어인 Python에서 nodejs 환경으로 마이그레이션하였습니다. 이 전의 파이썬 환경에는 잘 동작했기 때문에 새로 구축한 nodejs express에서의 인코딩 설정 부분이 미설정되어 한글이 깨져보이는 것이라 바로 생각할 수 있었죠.


charset과 content-type 값을 nodejs response header에 설정하기

이슈 수정을 위해서 nodejs expresss 응답 헤더를 설정하는 방법을 알아봅니다. 일단 브라우저에서 개발자 도구를 열고 response header를 설정해보니 설정된 값이 없었습니다. 그래서 헤더의 Charset과 함께 Content-Type을 설정 후 아래와 같이 기존 코드에 추가하였습니다.

@ testApi.js
function apiTest(req, res) {
  ...
  res.writeHead(200, { 'Content-Type': 'text/html; charset=utf-8' })
  res.end('성공')
}

위 코드는 현재 웹이즈프리에 사용하는 api의 일부 코드입니다. 기존에 없던 response 응답 헤더를 추가하기 위해서 res.writeHead()을 사용하였고 값으로 컨텐츠 타입과 charset을 추가하였습니다. 그 결과 깨져보이던 '성공'이라는 한글 문자가 정상적으로 보이게 되었습니다. (변경하기 이전에는 깨져서 어떤 글인지 알 수 없었죠.)


# 마치면서 요약 및 정리


이제 해결된 내용을 다시 정리하면 아래와 같이 요약 가능합니다!

- express를 사용한 nodejs 환경에서 한글 깨짐 현상 발견
- res.writeHead()를 사용하여 Content-type과 charset을 추가, 설정함(utf-8)
- 한글 깨짐 이슈 해결


여기까지 간략하게 알아본 nodejs 응답 헤더 설정 방법이었습니다.

Previous

Post thumbnail Facebook 페이지의 콘텐츠를 graph API를 사용하여 불러오자

Next

Apache2 permission error 해결하기 Post thumbnail