URL 인코딩/디코딩

URL에 포함된 특수문자, 한글 등을 퍼센트 인코딩하거나 원본으로 디코딩합니다.

입력

인코딩에는 encodeURIComponent, 디코딩에는 decodeURIComponent를 사용합니다. 전체 URL보다 파라미터 값 한 조각을 입력하는 용도이며, 이미 인코딩된 값을 다시 인코딩하면 결과가 달라집니다.

URL에는 영문, 숫자, 일부 특수문자만 안전하게 사용할 수 있습니다. 한글이나 예약 문자를 포함하려면 브라우저와 서버가 같은 값으로 해석하도록 퍼센트 인코딩으로 변환해야 합니다.

둘 다 공백을 나타내지만 쓰이는 위치가 다릅니다. `%20`은 일반 URL 경로나 표준 인코딩에서 쓰이고, `+`는 주로 폼 전송이나 쿼리스트링의 `application/x-www-form-urlencoded` 규칙에서 사용됩니다.

전체 URL을 다룰 때는 구조 문자를 남기는 `encodeURI`를 쓰고, 쿼리 파라미터 값처럼 한 조각만 안전하게 바꿀 때는 거의 모든 특수문자를 인코딩하는 `encodeURIComponent`를 써야 합니다.

URL 인코딩이 필요한 이유는?

URL에는 영문, 숫자, 일부 특수문자만 사용할 수 있습니다. 한글이나 특수문자를 URL에 포함하려면 %XX 형태로 인코딩해야 합니다.

%20과 +의 차이는 무엇인가요?

둘 다 공백을 나타내지만, %20은 URL 경로에서, +는 쿼리스트링(폼 데이터)에서 주로 사용됩니다.

encodeURI와 encodeURIComponent의 차이는?

encodeURI는 전체 URL을 인코딩하되 :, /, ? 등은 유지합니다. encodeURIComponent는 모든 특수문자를 인코딩하므로 쿼리 파라미터 값에 사용합니다.

한글 URL은 왜 길어지나요?

UTF-8에서 한글 1자는 3바이트이고, 각 바이트가 %XX 형태(3자)로 변환되므로 한글 1자가 9자로 늘어납니다.

입력한 데이터가 서버로 전송되나요?

아닙니다. 모든 처리가 브라우저에서 이루어집니다.