URL 인코딩

관련 추천

URL 인코딩이란 무엇인가요?

사용 사례

• API 매개변수 디버깅: encodeURIComponent와 encodeURI 출력 차이를 비교하여 인터페이스 서명 불일치 문제 해결
• 로그 디코딩: 로그의 URL 인코딩 내용을 일괄 디코딩하여 가독성 있는 텍스트로 복원
• URL 구성: Query Only 모드로 키 이름은 유지하고 값만 인코딩하여 수동 조합으로 인한 형식 오류 방지
• 프론트엔드 개발: 인코딩 하이라이트로 어떤 문자가 이스케이프되는지 이해하기 쉬워 페이지 이동 및 리디렉션 디버깅에 도움
• 데이터 마이그레이션: 레거시 시스템에서 내보낸 URL 인코딩 데이터를 일괄 처리하여 새 형식으로 변환

이용 방법

1. 인코딩/디코딩할 URL 또는 텍스트를 입력하거나 붙여넣기
2. 인코딩 방향(인코딩/디코딩)과 인코딩 모드(Component / URI / full / RFC 3986) 선택
3. 여러 줄 데이터를 처리하려면 배치 모드를 활성화하고, 매개변수 값만 인코딩하려면 Query Only를 활성화
4. 하이라이트된 결과를 확인하고 인코딩된 문자열을 복사하여 API 요청이나 URL 구성에 사용

주요 기능

• 네 가지 인코딩 모드: encodeURIComponent / encodeURI / full / RFC 3986 원클릭 전환, 각 규칙의 출력 차이를 실시간으로 비교
• 인코딩 하이라이트: 이스케이프된 %XX 문자를 실시간으로 하이라이트 표시, 호박색 마크로 인코딩 결과를 한눈에 파악
• 배치 모드: 여러 줄 일괄 인코딩/디코딩 지원, 각 줄을 독립적으로 처리. 로그나 일괄 데이터 처리에 적합
• Query Only 모드: URL 매개변수 값 부분(등호 뒤 내용)만 인코딩하고 키 이름, 기호, 경로 구조는 그대로 유지
• 실시간 디바운스: 300ms 자동 인코딩/디코딩, 버튼 클릭 필요 없이 입력하면 즉시 결과 표시
• 문자 수 카운트: 입력 문자 수를 실시간으로 표시, API 매개변수 길이 제한 확인에 편리

코드 예제

// encodeURIComponent: 개별 매개변수 값 인코딩 (가장 일반적)
const param = encodeURIComponent('장삼&리스');
console.log(param); // %E5%BC%A0%E4%B8%89%26%E6%9D%8E%E5%9B%9B

// encodeURI: 전체 URL 인코딩 (:/?#&= 등 구조 문자 보존)
const url = encodeURI('https://example.com/search?q=안녕하세요 세계');
console.log(url);

// 디코딩
const decoded = decodeURIComponent(param);
console.log(decoded); // 장삼&리스

// RFC 3986 호환 (~ 인코딩 안 함)
function rfc3986Encode(str) {
  return encodeURIComponent(str).replace(/[!'()*]/g, c => '%' + c.charCodeAt(0).toString(16).toUpperCase());
}

// URLSearchParams API (현대적인 방식, 자동 인코딩 처리)
const params = new URLSearchParams({ name: '장삼', city: '북경' });
console.log(params.toString());
// name=%E5%BC%A0%E4%B8%89&city=%E5%8C%97%E4%BA%AC

from urllib.parse import quote, unquote, urlencode, quote_plus

# quote: encodeURIComponent와 유사
encoded = quote('장삼&리스')
print(encoded)  # %E5%BC%A0%E4%B8%89%26%E6%9D%8E%E5%9B%9B

# RFC 3986 모드 (~ 인코딩 안 함, 기본값)
print(quote('hello~world'))  # hello~world

# quote_plus: 공백을 +로 인코딩 (폼 형식)
print(quote_plus('hello world'))  # hello+world

# 디코딩
print(unquote(encoded))  # 장삼&리스

# urlencode: 쿼리 문자열 구성
params = urlencode({'name': '장삼', 'city': '북경'})
print(params)
# name=%E5%BC%A0%E4%B8%89&city=%E5%8C%97%E4%BA%AC

import java.net.URLEncoder;
import java.net.URLDecoder;
import java.net.URI;
import java.nio.charset.StandardCharsets;

public class URLEncodeExample {
    public static void main(String[] args) throws Exception {
        // URL 인코딩 (URLEncoder는 폼 형식, 공백은 +가 됨)
        String encoded = URLEncoder.encode("장삼&리스", "UTF-8");
        System.out.println(encoded);
        // %E5%BC%A0%E4%B8%89%26%E6%9D%8E%E5%9B%9B

        // 디코딩
        String decoded = URLDecoder.decode(encoded, "UTF-8");
        System.out.println(decoded); // 장삼&리스

        // 전체 URL 구성 (URI 클래스가 자동으로 인코딩 처리)
        URI uri = new URI("https", "example.com", "/search", "q=안녕하세요", null);
        System.out.println(uri.toASCIIString());
    }
}

자주 묻는 질문

용어집

퍼센트 인코딩(Percent-encoding)

URL 인코딩의 정식 명칭. % 뒤에 두 자리 16진수로 문자를 표현하는 인코딩 방식입니다. 예를 들어 공백은 %20, 중국어 '中'은 %E4%B8%AD으로 인코딩됩니다.Wikipedia - 퍼센트 인코딩

encodeURIComponent

JavaScript 내장 함수. A-Z a-z 0-9 - _ . ! ~ * ' ( ) 외의 모든 문자를 인코딩합니다. URL 쿼리 매개변수의 개별 값을 인코딩할 때 가장 많이 사용됩니다.

encodeURI

JavaScript 내장 함수. URL 구조 문자(: / ? # [ ] @ ! $ & ' ( ) * + , ; =)를 보존하고 정말 인코딩이 필요한 문자만 인코딩합니다. 전체 URL을 인코딩할 때 사용합니다.

RFC 3986

URI 일반 구문에 관한 최신 IETF 표준(2005년). URL 인코딩 규칙을 정의하고 있으며 물결표 ~를 비예약 문자(인코딩 불필요)로 분류합니다. 구 RFC 2396과 RFC 1738을 대체합니다.RFC 3986

예약 문자(Reserved Characters)

URL에서 특별한 의미를 가지는 문자(: / ? # [ ] @ ! $ & ' ( ) * + , ; = 등). 이러한 문자는 데이터로 사용할 때는 인코딩해야 하지만 구조적 위치에서는 인코딩해서는 안 됩니다.

비예약 문자(Unreserved Characters)

URL의 어떤 위치에서도 인코딩 없이 사용할 수 있는 안전한 문자. A-Z, a-z, 0-9, -, _, ., ~(RFC 3986 기준)가 포함됩니다.

쿼리 문자열(Query String)

URL의 ? 뒤 부분으로 key=value 쌍으로 구성되며 &로 구분됩니다. 예를 들어 ?name=장삼&age=20에서 name=장삼과 age=20이 두 개의 매개변수입니다.

URLSearchParams

최신 브라우저가 제공하는 API. URL 쿼리 문자열을 쉽게 구성하고 파싱할 수 있으며 인코딩과 디코딩을 자동으로 처리합니다. 수동으로 문자열을 조합하는 것보다 안전하고 신뢰할 수 있습니다.

application/x-www-form-urlencoded

HTML 폼의 기본 제출 형식. 공백이 %20이 아닌 +로 인코딩되는 점이 encodeURIComponent와 다릅니다. 서버 사이드 프레임워크는 보통 두 형식을 모두 자동으로 처리합니다.

UTF-8 인코딩

웹 표준 문자 인코딩. URL 인코딩에서는 비ASCII 문자(중국어, 이모지 등)를 먼저 UTF-8 바이트 시퀀스로 변환한 다음 각 바이트를 %XX 형식으로 인코딩합니다.

네 가지 인코딩 모드 문자 이스케이프 비교

자주 사용되는 URL 예약 문자 퀵 레퍼런스

Authoritative References

• ReferenceRFC 3986 - Uniform Resource Identifier (URI): Generic Syntax
• ReferenceRFC 1738 - Uniform Resource Locators (URL)
• ReferenceMDN Web Docs - encodeURIComponent()
• ReferenceMDN Web Docs - encodeURI()
• ReferenceWikipedia - 퍼센트 인코딩