유틸리티

URL 인코딩이란, 한글 주소 깨짐 원인과 해결법

카카오톡에 링크를 보냈더니 한글 부분이 %ED%95%9C%EA%B8%80로 바뀌어 있다. 깨진 게 아니라 인코딩된 것이다. URL에는 한글을 직접 넣을 수 없어서 브라우저가 자동으로 변환한 결과다.

URL 인코딩이 필요한 이유

URL은 원래 ASCII 문자(영문, 숫자, 일부 특수문자)만 허용하는 규격이다. 한글, 공백, 특수문자처럼 ASCII에 포함되지 않는 문자는 퍼센트 인코딩(%XX 형식)으로 변환해야 한다.

한글 인코딩
"한글"을 UTF-8로 인코딩하면 %ED%95%9C%EA%B8%80이 된다. 한글 한 글자당 3바이트, %XX 3개로 표현된다.
공백 인코딩
URL에서 공백은 %20으로 변환된다. 검색어에 띄어쓰기가 있으면 주소에 %20이 들어가는 이유다.
특수문자 인코딩
&, =, ? 같은 문자는 URL에서 특별한 의미를 가진다. 이런 문자를 데이터로 보내려면 %26, %3D, %3F로 인코딩해야 한다.

인코딩과 디코딩 차이

방향입력출력용도
인코딩안녕하세요%EC%95%88%EB%85%95...URL에 한글 포함시킬 때
디코딩%EC%95%88%EB%85%95...안녕하세요인코딩된 주소를 읽을 때

실무에서 URL 인코딩이 필요한 경우

  • API 호출 — 쿼리 파라미터에 한글이나 특수문자가 포함되면 인코딩해야 서버가 제대로 인식한다
  • 리다이렉트 URL — 로그인 후 원래 페이지로 돌아가는 URL을 파라미터로 넘길 때, URL 안에 URL이 들어가므로 이중 인코딩이 필요하다
  • 이메일/메신저 공유 — 한글이 포함된 링크를 보낼 때 자동 인코딩되어 상대방에게 깨져 보일 수 있다
  • 크롤링/스크래핑 — 수집한 URL에 인코딩된 한글이 섞여 있으면 디코딩해서 원래 텍스트를 추출해야 한다

개발 중에 인코딩/디코딩이 필요하면 URL 인코딩 변환 도구에 텍스트를 붙여넣으면 된다. encodeURIComponent 옵션을 켜면 슬래시나 콜론까지 전부 인코딩되고, 끄면 URL 구조 문자는 그대로 유지된다. 입출력 크기도 같이 표시되어서 인코딩 후 문자열 길이가 얼마나 늘어나는지 확인하기 좋다.

TIP JavaScript에서는 encodeURIComponent()decodeURIComponent()를 쓰면 되지만, 빠르게 확인만 하고 싶을 때는 웹 도구가 더 편하다. 특히 이중 인코딩 여부를 눈으로 확인할 때 유용하다.

%ED%95%9C%EA%B8%80이 "한글"이라는 걸 알면 더 이상 깨진 링크처럼 보이지 않는다.