JavaScript의 encodeURI() 함수는 URI(Uniform Resource Identifier)를 나타내는 문자열을 인자로 받아, 문자열 내의 특정 문자들을 1~4개의 숫자 조합과 이스케이프 시퀀스(escape sequence)로 대체하여 인코딩하는 함수입니다. URL에 공백이나 한글, 키릴 문자처럼 ASCII 범위를 벗어난 문자가 포함된 경우, 브라우저와 서버 사이에서 해당 값을 안전하게 전달할 수 있도록 변환해 주는 역할을 합니다.
인코딩되지 않는 문자
encodeURI()는 URL 전체를 다루기 때문에, URI의 구조를 유지하는 데 필수적인 예약 문자(reserved characters)는 인코딩하지 않고 그대로 둡니다. 인코딩 대상에서 제외되는 문자는 다음과 같습니다.
- 예약 문자: ; / ? : @ & = + $ , #
- 비예약 문자: 영문 알파벳(A-Z, a-z), 숫자(0-9), - _ . ! ~ * ' ( )
문법(Syntax)
encodeURI() 함수의 기본 문법은 다음과 같습니다.
encodeURI('https://www.qries.com/');
사용 예제
다음 예제는 키릴 문자 'шеллы'가 포함된 두 개의 URL을 encodeURI()로 인코딩한 후 화면에 출력하는 코드입니다.
<html>
<head>
<title>JavaScript Example</title>
</head>
<body>
<script type="text/javascript">
var result1 = encodeURI('https://www.qries.com/?x=шеллы');
document.write(result1);
document.write("<br>");
var result2 = encodeURI('https://www.tutorialspoint.com/?x=шеллы');
document.write(result2);
</script>
</body>
</html>
실행 결과
키릴 문자가 % 기호로 시작하는 퍼센트 인코딩(percent-encoding) 형태로 변환된 것을 확인할 수 있습니다.
https://www.qries.com/?x=%D1%88%D0%B5%D0%BB%D0%BB%D1%8B https://www.tutorialspoint.com/?x=%D1%88%D0%B5%D0%BB%D0%BB%D1%8B
encodeURI()와 encodeURIComponent()의 차이점
두 함수는 이름이 비슷하지만 인코딩 범위가 다르므로 용도에 맞게 선택해서 사용해야 합니다.
- encodeURI(): URL 전체를 인코딩할 때 사용하며, ? / : & = 처럼 URI 구조를 구성하는 예약 문자는 그대로 유지합니다.
- encodeURIComponent(): 쿼리 스트링의 파라미터 값처럼 URI의 일부(구성 요소)를 인코딩할 때 사용하며, 예약 문자까지 포함해 더 넓은 범위의 문자를 인코딩합니다.
또한 encodeURI()로 인코딩된 문자열을 다시 원래 상태로 되돌리려면 decodeURI() 함수를 사용하면 됩니다.