URL 인코더/디코더

URL encode/decode 및 컴포넌트 변환

URL encode/decode 및 컴포넌트 변환
?
입력
출력

도구 설명

URL 인코더/디코더 정보

URL Encoder/Decoder는 URL에서 안전하게 쓸 수 없거나 예약된 의미가 있는 문자를 퍼센트 인코딩하고, 인코딩된 문자열을 읽기 쉬운 텍스트로 되돌립니다.

쿼리 매개변수, 비영어 경로, 콜백 URL, 로그에서 복사한 URL 조각을 확인할 때 유용하며 모든 변환은 브라우저 안에서 처리됩니다.

URL Encoder/Decoder 사용 방법

  1. 전체 URL, 쿼리 매개변수 값 또는 인코딩할 텍스트를 붙여 넣습니다.
  2. 「Encode」를 눌러 공백, 비영어 문자, 기호를 안전한 퍼센트 인코딩으로 바꿉니다.
  3. 「Decode」를 눌러 %E4%B8%AD%E6%96%87 같은 문자열을 원래의 읽기 쉬운 텍스트로 되돌립니다.
  4. 매개변수 하나만 처리할 때는 전체 쿼리 문자열이 아니라 값만 인코딩해 &와 =의 구조를 유지하세요.

주요 사용 사례

  • 검색어, 콜백 URL, 리디렉션 매개변수를 URL에 넣기 전에 인코딩해 &, ?, # 때문에 값이 끊기지 않게 합니다.
  • API 로그의 퍼센트 인코딩된 경로나 쿼리 문자열을 읽기 쉬운 텍스트로 디코딩합니다.
  • OAuth redirect_uri, Webhook 콜백, 공유 링크의 이중 인코딩 문제를 확인합니다.
  • 프런트엔드의 encodeURIComponent 출력과 백엔드가 실제로 받은 값을 비교합니다.

퍼센트 인코딩, 쿼리 매개변수와 흔한 실수

URL의 ?, &, =, #, / 같은 문자는 구조적 의미가 있습니다. 퍼센트 인코딩은 바이트를 %HH로 표시해 이런 문자를 URL 구조가 아닌 데이터로 전달하게 합니다.

  • 공백: 보통 %20을 사용하며 폼 인코딩에서는 +가 쓰이기도 합니다.
  • 비영어 문자와 이모지: 먼저 UTF-8 바이트로 변환된 뒤 퍼센트 표기로 작성됩니다.
  • encodeURI와 encodeURIComponent: 전자는 URL 구조 문자를 유지하고, 후자는 단일 매개변수 값에 더 적합합니다.
  • 이중 인코딩: %25E4는 기존 퍼센트 기호가 다시 인코딩되었을 가능성을 뜻합니다.

URL 인코더/디코더 자주 묻는 질문

전체 URL과 매개변수 하나 중 무엇을 인코딩해야 하나요?
대부분은 매개변수 값만 인코딩합니다. 전체 URL을 처리하면 :, /, ?, & 같은 구조 문자까지 이스케이프되어 링크가 잘못 해석될 수 있습니다.
공백이 %20 또는 +로 보이는 이유는 무엇인가요?
%20은 일반적인 퍼센트 인코딩입니다. +는 application/x-www-form-urlencoded 폼 규칙에서 흔히 사용됩니다.
디코딩 후에도 퍼센트 기호가 남는 이유는 무엇인가요?
이중 인코딩되었거나 원래 값에 퍼센트 기호 자체가 포함되었을 수 있습니다. 이중 인코딩임을 확인한 경우에만 한 번 더 디코딩하세요.
URL-safe Base64에도 URL 인코딩이 필요한가요?
+와 /를 사용하지 않아 필요성이 낮지만, 쿼리 문자열에 넣기 전에 = 패딩이나 다른 특수 문자를 확인하세요.
입력이 업로드되나요?
아니요. 인코딩과 디코딩은 브라우저 안에서 실행되며 입력은 wetool.site로 전송되지 않습니다.

URL 인코딩과 Base64의 차이

URL 인코딩은 문자를 URL 안에서 안전하게 쓰기 위한 방식입니다. Base64는 바이트를 텍스트로 표현하는 방식입니다. 토큰, 이미지, 바이너리 데이터에서 둘 다 나타날 수 있지만 목적은 다릅니다.

encodeURI와 encodeURIComponent 비교

URL 인코딩 오류는 대부분 「전체 URL」과 「단일 매개변수 값」을 같은 방식으로 처리할 때 발생합니다.

  • 전체 URL: encodeURI는 : / ? & = #을 구조 문자로 유지하므로 이미 조합된 링크에 적합합니다.
  • 매개변수 값: encodeURIComponent는 &, =, ?, #을 인코딩하므로 search, redirect_uri, callback 같은 값에 적합합니다.
  • 폼 규칙: application/x-www-form-urlencoded에서는 공백을 +로 쓰기도 하며, 일반적인 퍼센트 인코딩에서는 보통 %20을 사용합니다.

URL 인코딩 디버깅 점검표

백엔드가 잘못된 URL 매개변수를 받으면 브라우저, 프런트엔드, 게이트웨이, 백엔드 각 계층에서 인코딩이나 디코딩이 몇 번 수행되었는지 확인합니다.

  • %25는 기존 퍼센트 기호가 다시 인코딩되었을 가능성을 뜻하므로 이중 인코딩을 의심할 단서가 됩니다.
  • redirect_uri 안에 자체 쿼리 문자열이 있으면 내부의 ?, &, =은 데이터로 인코딩해야 합니다.
  • 디코딩한 사용자 입력을 HTML이나 리디렉션 URL에 직접 넣지 말고 프로토콜 허용 목록과 출력 이스케이프를 적용하세요.