본문으로 건너뛰기
Ink·tab

percent-encoding · component / uri

URL 에 끼울 때 필요한 percent-encoding. 디코딩도 양방향.

인코딩 결과
hello%20world%20%26%20%EC%95%88%EB%85%95

브라우저 안에서만 처리됩니다. 네트워크 전송 없음.

언제 쓰나

URL 의 쿼리스트링에 한글·공백·특수문자를 끼워야 할 때. 또는 서버 로그에서 본 %E3%81%82%E3%81%84 같은 문자열을 사람이 읽는 형태로 풀어볼 때.

componentURI vs uri

두 가지 인코딩 범위가 있습니다.

  • componentURIencodeURIComponent 와 같습니다. : / ? # & = 같은 reserved 문자도 이스케이프합니다. 쿼리 값·경로 조각·POST 본문용.
  • uriencodeURI 와 같습니다. reserved 문자는 그대로 두고 공백· 비-ASCII 만 이스케이프합니다. 전체 URL 문자열을 재정렬하지 않을 때.

대부분의 경우 componentURI 를 쓰면 됩니다. URL 한 줄을 통째로 인코딩하고 싶을 때만 uri 모드.

디코딩

%xx 시퀀스가 아닌 잘못된 입력이 섞이면 디코딩이 실패합니다. 이때는 오류 메시지가 나오고, 어디서 문제가 났는지 직접 확인할 수 있도록 입력 원문을 그대로 두고 표시만 멈춥니다.

쿼리 안 토큰 · 키 안전

encodeURIComponent · encodeURI 두 범위 모두 stdlib 직접 호출. 한글 · 이모지 · 인증 토큰을 포함한 URL 모두 페이지 안에서만 처리됩니다.

자주 묻는 질문

encodeURIComponent 와 encodeURI 의 차이는?
encodeURIComponent 는 더 엄격 — `/` `?` `#` `&` 등 URL 구조 문자도 인코딩. encodeURI 는 URL 구조를 유지하며 위험 문자만 인코딩. 쿼리 값은 component, 전체 URL 은 URI 권장.
한글·이모지도 안전하게 처리되나요?
네. UTF-8 바이트 단위로 % 시퀀스 변환. `한글` 같은 문자는 `%ED%95%9C%EA%B8%80` 식으로 표현됩니다.
디코딩 시 잘못된 % 시퀀스는 어떻게 되나요?
에러 메시지로 표시되어 어디에서 문제가 났는지 확인 가능합니다. 부분 디코딩이 아닌 전체 실패로 처리해 잘못된 결과 사용을 방지합니다.