개념 및 사용 방법
encodeURI()
함수는
URL 구조를 정의하는 일부 특수문자를 제외한 URL을 인코딩합니다.
이 함수는 주로 전체 URL 문자열을 인코딩할 때 사용합니다.
특징
- URL에서 프로토콜, 도메인, 경로 구분자(
/
,:
,?
,&
,#
) 등 특수한 의미를 갖는 문자들은 인코딩하지 않습니다. - 따라서, 실제로 URL 구조가 보존되어야 할 경우에 적합합니다.
- URL 전체를 인코딩할 때는 적합하지만,
- 프로토콜, 도메인, 경로, 쿼리 값 등 각 URL 구성 요소를 개별적으로 인코딩할 때는 적합하지 않습니다. 이런 경우에는
encodeURIComponent()
함수를 사용해야 합니다.
알아두세요!
encodeURI()
는 전체 URL 구조를 유지하면서 인코딩하도록 설계되어 있어, /
, :
, ?
, &
, #
같은 문자를 그대로 둡니다. 하지만 이런 문자가 포함된 각 개별 구성 요소를 인코딩할 때는 문제가 발생할 수 있습니다. 예를 들어 경로 값에 &가 들어가면 쿼리 구분자로 오해될 수 있으므로, 그런 경우에는 철저히 인코딩해야 하는 encodeURIComponent()
함수가 필요합니다.
기본 예제
const uri = "https://www.example.com/?x=샘플 값";
const encoded = encodeURI(uri);
console.log(encoded);
// 출력: "https://www.example.com/?x=%EC%83%98%ED%94%8C%20%EA%B0%92"
encodeURI()
함수의 형식은 다음과 같습니다.
구문
encodeURI(uri);
매개변수
uri |
인코딩하려는 전체 URL입니다. 이 함수는 URL의 구성 요소 중에서 일부 특수 문자를 제외하고 인코딩합니다. |
---|
반환 값
주어진 문자열을 URI로 인코딩한 새로운 문자열을 반환합니다.
encodeURI()
함수에서 인코딩되지 않는 문자
- 알파벳 문자 (A-Z, a-z)
- 숫자 (0-9)
;
,
/
?
:
@
&
=
+
$
-
_
.
!
~
*
'
(
)
#
이 목록에 나열되지 않은 다른 문자들(띄어쓰기 포함)은 모두 %
다음에 해당 문자의 유니코드 값을 16진수로 표현한 형식으로 인코딩됩니다.
예제
const uri = "https://example.com/search?query=Hello, world!&page=1";
const encodedUri = encodeURI(uri);
console.log(encodedUri);
// 출력: "https://example.com/search?query=Hello,%20world!&page=1"
이 예제에서 encodeURI()
함수는 uri
변수에 저장된 URI를 인코딩합니다. 인코딩되지 않는 특수문자는 :
, /
, ?
, &
, =
, !
등입니다.
주의할 점
encodeURI()
만 사용해서는 XMLHttpRequest
와 같은 올바른 HTTP GET
및 POST
요청을 형성할 수 없습니다. 왜냐하면 &
, +
및 =
문자가 인코딩되지 않아서 GET
및 POST
요청에서 특수 문자로 처리되기 때문입니다. 반면에 encodeURIComponent()
함수는 이러한 특수 문자도 인코딩합니다.
명세서
명세서 사양 | |
---|---|
encodeURI()
|
ECMAScript Language Specification #sec-encodeuri-uri |
브라우저 호환성
함수 |
데스크탑 Chrome
|
데스크탑데스크탑 Edge
|
데스크탑 Firefox
|
Safari
|
---|---|---|---|---|
encodeURI()
|
1 | 12 | 1 | 1.1 |