URL 인코더 / 디코더

주소창에 한글이 들어간 링크를 복사했더니 %ED%95%9C%EA%B8%80 같은 알 수 없는 문자열로 바뀐 경험이 한 번쯤 있을 것입니다. 검색어에 공백이 들어가면 %20이나 +로 바뀌고, 이메일 주소나 특수문자가 포함된 값을 링크로 전달하면 갑자기 페이지가 엉뚱하게 동작하기도 합니다. 이 모든 현상의 배경에는 URL 인코딩(퍼센트 인코딩) 이라는 규칙이 있습니다. URL은 정해진 글자만 안전하게 담을 수 있는 그릇이라서, 그 밖의 문자는 약속된 방식으로 변환해 주어야 의미가 깨지지 않습니다. 이 글에서는 퍼센트 인코딩이 무엇인지, 어떤 문자를 어떻게 바꾸는지, 쿼리스트링은 어떻게 처리하는지, 그리고 실무에서 자주 저지르는 실수까지 차근차근 정리합니다. 직접 변환해 보고 싶다면 URL 인코더 / 디코더를 함께 열어 두고 읽으면 이해가 훨씬 빠릅니다.

한눈에 보기

• URL 인코딩(퍼센트 인코딩)은 URL에 직접 쓸 수 없는 문자를 % + 16진수 2자리로 바꾸는 규칙입니다.
• 공백은 %20으로, 쿼리스트링에서는 관례적으로 +로도 표현합니다.
• 한글은 먼저 UTF-8 바이트로 바꾼 뒤 각 바이트를 퍼센트로 인코딩합니다. 예: "한" → %ED%95%9C.
• 예약문자(? & = / # 등)가 값 안에 들어가면 반드시 인코딩해야 URL 구조가 깨지지 않습니다.
• 자바스크립트에서는 값 하나는 encodeURIComponent, 전체 URL은 encodeURI로 구분해서 씁니다.

공백은 %20과 + 중 무엇이 맞나요? 둘 다 쓰이지만 위치가 다릅니다. 경로 부분에서는 %20이 표준이고, 쿼리스트링에서는 +도 공백으로 해석되는 관례가 있습니다. 헷갈린다면 %20을 쓰는 편이 대부분의 환경에서 안전합니다.

한글 한 글자가 왜 %XX 세 묶음으로 바뀌나요? 한글은 UTF-8에서 한 글자가 보통 3바이트로 표현되기 때문입니다. 퍼센트 인코딩은 바이트 단위로 동작하므로 3바이트짜리 글자는 %ED%95%9C처럼 세 개의 묶음으로 나타납니다.

encodeURI와 encodeURIComponent는 어떻게 구분하나요? 완성된 전체 URL을 정리할 때는 구조 문자를 보존하는 encodeURI를, 쿼리 값처럼 URL의 한 조각을 인코딩할 때는 예약문자까지 모두 바꾸는 encodeURIComponent를 사용합니다.

인코딩된 주소를 다시 원래대로 보려면 어떻게 하나요? 디코딩하면 됩니다. %ED%95%9C 같은 문자열을 입력하면 원래 글자로 되돌릴 수 있습니다. URL 인코더 / 디코더에서 인코딩과 디코딩을 모두 바로 확인할 수 있습니다.

왜 처음부터 한글을 그냥 주소에 쓰면 안 되나요? 브라우저 주소창은 보기 편하게 한글을 그대로 보여 주기도 하지만, 실제로 서버에 전송될 때는 인코딩된 형태로 바뀝니다. 링크를 복사하거나 프로그램에서 직접 다룰 때는 인코딩 규칙을 따라야 의미가 안전하게 전달됩니다.

URL 인코딩은 한 번 원리를 이해하면 그리 복잡하지 않습니다. "URL에 못 쓰는 문자는 % + 16진수로 바꾼다", "한글은 UTF-8 바이트로 인코딩한다", "값과 전체 URL은 다른 함수로 처리한다"는 세 가지만 기억하면 대부분의 상황에 대응할 수 있습니다. 직접 변환 결과를 눈으로 확인하면 가장 빠르게 익숙해지니, 지금 URL 인코더 / 디코더에 한글이나 특수문자를 넣어 보며 어떻게 바뀌는지 확인해 보세요.