URL Encoder / Decoder이란?
URL 인코더/디코더는 일반 텍스트와 URL 안전한 퍼센트 인코딩 형식 간에 변환하는 필수 웹 개발 도구입니다. URL에 공백, 특수 기호 또는 악센트 문자와 이모지와 같은 비 ASCII 문자가 포함되면 제대로 인코딩하지 않으면 손상됩니다. 이 도구는 URL 모드(전체 URL 인코딩)와 구성 요소 모드(개별 쿼리 매개변수 값 인코딩) 모두 완전히 지원하는 즉시 인코딩과 디코딩을 제공하며, 여러 문자열을 동시에 처리하는 일괄 모드도 제공합니다. RFC 3986에서 정의한 모든 표준 퍼센트 인코딩 작업을 처리합니다. 웹 개발자, API 통합자, SEO 전문가 및 쿼리 문자열, 리디렉션 또는 URL 기반 데이터 전송을 다루는 모든 사람에게 필수적입니다. 브라우저 내에서 완전히 작동하여 빠르고 프라이빗합니다.
이 계산기를 사용해야 할 때
- 공백, 기호 또는 비ASCII 문자가 포함된 쿼리 파라미터가 있는 URL을 만들고 있을 때
- 퍼센트 인코딩된 URL을 디코딩하여 실제 내용을 읽어야 할 때
- 인코딩되지 않은 특수 문자 때문에 API가 URL을 거부하고 있어 디버깅 중일 때
- 사용 전에 정리해야 하는 사용자 제출 URL을 처리하고 있을 때
- 여러 URL 세그먼트를 한 번에 배치 인코딩하거나 디코딩해야 할 때
- 파라미터를 올바르게 인코딩해야 하는 리디렉션 또는 콜백 URL을 구성하고 있을 때
단계:
- 인코딩하거나 디코딩할 텍스트/URL을 입력하거나 붙여 넣으세요.
- 인코딩 또는 디코딩 모드를 선택하세요.
- 변환 버튼을 클릭하세요.
- 애플리케이션에서 사용할 결과를 복사하세요.
공식
인코딩: 안전하지 않은 문자 → % + 2자리 16진수 코드 ➡ 디코딩: %XX → 원래 문자
사용 사례
- URL에 안전한 쿼리 문자열 만들기
- API 요청 파라미터 처리
- 인코딩된 URL 디버깅
- URL 친화적인 슬러그와 경로 만들기
주요 이점
- 타yping과 동시에 실시간 인코딩과 디코딩
- URL 모드와 구성 요소 모드 모두 지원
- 여러 문자열을 동시에 인코딩 또는 디코딩하는 일괄 모드
- Unicode와 이모지를 포함한 모든 특수 문자 처리
- 100% 브라우저 기반 — 서버로 데이터가 전송되지 않음
- 인코딩이 입력을 중복하거나 잘라내지 않았는지 확인하는 시각적 문자 수
전문가 팁
- URL에 포함하기 전에 항상 사용자 생성 URL 매개변수를 인코딩하세요
- JavaScript에서 개별 쿼리 매개변수 값에 encodeURIComponent()를 사용하세요
- 사용자에게 표시하기 전에 URL을 디코딩하여 가독성을 높이세요
- 이중 인코딩에 주의: %25 뒤에 더 많은 16진수가 보이면 URL이 두 번 인코딩된 것일 수 있습니다
- 쿼리 문자열을 작성할 때는 구성 요소 모드를, 전체 URL 경로나 전체 URL을 인코딩할 때는 URL 모드를 사용하세요
피해야 할 일반적인 실수
- 이미 인코딩된 URL을 인코딩하여 이중 인코딩, %20이 %2520으로 변환
- 잘못된 인코딩 컨텍스트 사용 — URL 모드와 구성 요소 모드가 동일한 입력에 대해 다른 출력 생성
- +가 application/x-www-form-urlencoded 데이터에서만 공백을 나타내는 것을 잊음
- 비ASCII 문자를 올바르게 처리하지 않음 — 퍼센트 인코딩 전에 항상 UTF-8 인코딩을 확인하세요
주요 용어 설명
- 퍼센트 인코딩: URL에서 문자를 인코딩하는 표준 메커니즘, 안전하지 않은 문자를 % 뒤에 두 자리 16진수 ASCII 코드로 대체
- 쿼리 문자열: URL의 ? 문자 뒤에 있는 부분, &로 구분된 키-값 쌍을 포함
- 예약 문자: :, /, ?, #, [, ], @, !, $, &, (, ), *, +, ,, ;, = — RFC 3986에 따라 URL 구문에서 특별한 의미를 가진 문자
- 구성 요소 모드 대 URL 모드: 구성 요소 모드는 더 많은 문자를 인코딩하고 개별 값용; URL 모드는 URL 구조를 보존하고 전체 경로용
관련 개념
- 퍼센트 인코딩: 안전한 URL 전송을 위해 안전하지 않은 문자를 %와 두 자리 16진수 ASCII 코드로 바꾸는 메커니즘
- 쿼리 문자열: ? 문자 뒤에 오는 URL의 일부로, & 문자로 구분된 키-값 쌍을 포함
- 예약 문자: RFC 3986에 따라 URL 구문에서 특별한 의미를 갖는 :, /, ?, #, [, ], @, !, $, &, (, ), *, +, ,, ;, = 같은 문자
- URL 안전 문자: URL에서 인코딩이 필요 없는 비예약 문자(문자, 숫자, -, _, ., ~)
- encodeURIComponent vs. encodeURI: encodeURIComponent는 개별 값에 대해 문자, 숫자, _*-.~를 제외한 모든 것을 인코딩하고, encodeURI는 전체 URL에 대해 URL 구조 문자를 보존하는 JavaScript 함수
예시
'Hello World & Friends!' 인코딩 → 'Hello%20World%20%26%20Friends%21'. 'search%3Fq%3Dhello+world' 디코딩 → 'search?q=hello world'.
결과 해석 방법
인코더는 안전하지 않은 URL 문자(공백, &, ?, #, 비ASCII 등)를 각 문자가 %와 두 자리 16진수 코드가 되는 퍼센트 인코딩 형식으로 변환합니다. 디코더는 이 과정을 반대로 수행하여 원래 읽을 수 있는 텍스트를 복원합니다. 문자 수는 인코딩이 입력을 예기치 않게 중복하거나 잘라내지 않았는지 확인하는 데 도움이 됩니다.
컴포넌트 모드는 더 넓은 범위의 문자를 인코딩하며 개별 쿼리 파라미터 값을 인코딩하도록 설계되었습니다. URL 모드는 인코딩 대상이 더 엄격하며 전체 URL 경로 또는 전체 URL을 인코딩하도록 설계되었습니다. 쿼리 문자열을 만들 때는 컴포넌트 모드를, 전체 URL을 인코딩할 때는 URL 모드를 사용하세요.
배치 모드를 사용하면 여러 줄을 한 번에 인코딩하거나 디코딩할 수 있어 처리할 URL이나 파라미터 목록이 있을 때 유용합니다. 각 줄은 별도의 입력으로 처리되며 모든 결과가 함께 표시되어 쉽게 복사할 수 있습니다.