도구 소개
인코딩 버그는 API 결함의 단골 원인입니다. 공백으로 바뀌는 플러스 기호, 값 안의 앰퍼샌드 때문에 쪼개지는 파라미터, 두 번 인코딩된 리다이렉트 URL 등이 그렇습니다. 이 도구는 자주 쓰는 세 가지 인코딩을 명확히 구분합니다. Component 모드는 단일 값용 encodeURIComponent와, Full URI 모드는 URL 전체용 encodeURI와, Form 모드는 브라우저가 HTML 폼을 전송하는 방식과 동일합니다. 쿼리 파서는 모든 파라미터를 순서대로 디코딩된 형태와 원본 형태로 보여 주며, 많은 도구가 조용히 합쳐 버리는 tag=a&tag=b 같은 중복 키도 그대로 유지합니다. URL 분해에는 fetch()와 같은 브라우저의 WHATWG URL 파서를 사용합니다.
사용 방법
- Encode 또는 Decode와 인코딩 모드를 선택한 뒤 텍스트를 붙여 넣습니다.
- Swap으로 출력을 다시 입력에 넣어 왕복 변환을 확인합니다.
- Query parser로 전환해 중복되거나 비어 있는 파라미터를 포함한 모든 파라미터를 살펴봅니다.
- URL breakdown에서 프로토콜, 호스트, 포트, 경로 세그먼트, 쿼리, 프래그먼트를 각각 확인합니다.
URL 인코더 / 디코더 자주 묻는 질문
encodeURI 대신 encodeURIComponent를 써야 하는 경우는 언제인가요?
쿼리 값 하나나 경로 세그먼트 하나처럼 단일 조각에는 encodeURIComponent를 사용하세요. & = ? / #까지 이스케이프하기 때문입니다. encodeURI는 해당 문자들을 그대로 두므로, 구조가 이미 올바른 전체 URL에만 사용하세요.
+가 때때로 공백을 의미하는 이유는 무엇인가요?
HTML 폼과 많은 쿼리 문자열에서 쓰는 application/x-www-form-urlencoded 데이터에서는 +가 공백을 나타냅니다. 경로에서는 +가 문자 그대로의 플러스 기호입니다. 값에 +가 들어갈 수 있다면 %2B로 인코딩하세요.
“Malformed percent-encoding” 오류는 무슨 뜻인가요?
% 뒤에는 16진수 두 자리가 와야 하고, 인접한 이스케이프와 함께 유효한 UTF-8을 이루어야 합니다. 단독 %나 %E2%82처럼 잘린 멀티바이트 시퀀스는 디코딩할 수 없습니다.