URL 인코딩은 웹 개발에서 매우 중요한 작업 중 하나입니다. 브라우저는 URL에서 일부 문자를 특정 형식으로 변환하여 서버가 정확하게 이해할 수 있도록 처리합니다. 자바스크립트에서는 URL을 인코딩하거나 디코딩하는 데 사용할 수 있는 다양한 내장 함수들이 있습니다.
이 글에서는 자바스크립트를 사용하여 URL을 인코딩하는 방법과 각각의 함수가 어떤 상황에서 유용한지 알아보겠습니다.
1. encodeURI 함수
encodeURI는 전체 URL을 인코딩하는 데 사용됩니다.
이 함수는 URL의 구성 요소(예: :, /, ?, &)를 유지하면서 나머지 문자를 인코딩합니다.
See the Pen encodeURI 함수 by saladent (@saladent) on CodePen.
특징
- URL 전체를 인코딩할 때 적합합니다.
- URL 구문에 필요한 문자는 인코딩하지 않습니다.
2. encodeURIComponent 함수
encodeURIComponent 함수는 URL의 특정 부분(예: 쿼리 파라미터 값)을 인코딩하는 데 적합합니다. 이 함수는 모든 특수 문자를 인코딩하므로 URL의 일부만 안전하게 인코딩하려는 경우에 유용합니다.
See the Pen encodeURIComponent 함수 by saladent (@saladent) on CodePen.
특징
- 구성 요소별 인코딩에 적합합니다.
- &, = 등 특수문자를 모두 인코딩합니다.
3. 디코딩 함수
인코딩된 URL을 다시 원래의 문자열로 복원하려면 decodeURI와 decodeURIComponent 함수를 사용할 수 있습니다.
See the Pen 디코딩함수 by saladent (@saladent) on CodePen.
4. escape와 unescape (사용하지 말아야 할 함수)
과거에는 escape와 unescape 함수가 URL 인코딩에 사용되었지만, 현재는 표준에서 제외되었으며 사용을 권장하지 않습니다. 대신 위의 encodeURI와 encodeURIComponent를 사용해야 합니다.