요약(Summary)
URI로 데이터를 전달하기 위해서 문자열을 인코딩
문법(Syntax)
encodeURIComponent(string)
인자(Parameters)
인자명 | 데이터형 | 필수/옵션 | 설명 |
---|---|---|---|
string | string | 필수 | 인코딩할 문자열 |
반환값(Return)
string, 인코딩된 문자열을 반환
설명(Description)
웹을 통해서 데이터를 전송할 때 특정 문자들은 특수한 기능으로 사용된다.
예를들어, http://a.com?name=egoing&job=programmer 에서
&job=programmer 중 '&'는 하나의 파라미터가 끝나고 다음 파라미터가 온다는 의미이다.
그런데 다음과 같이 job의 값에 &가 포함된다면 시스템은 job의 값을 제대로 인식할수 없게 된다.
http://a.com?name=egoing&job=programmer&blogger
이런 문제를 회피하기 위해서 다음과 같이 치환해준다.
http://a.com?name=egoing&job=programmer%26blogger
그럼 시스템에서는 %26을 &로 해석하고 의도대로 해석할 수 있게 된다.
이러한 처리를 이스케이핑(escaping)라고 부른다.
escape | encodeURI | encodeURIComponent | |
---|---|---|---|
대상 |
다음을 제외한 모든 문자열 ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuvwxyz 1234567890 @*-_+./ |
인터넷 주소에서 사용하는 특수문자는 변환하지 않는다. : ; / = ? & |
모든 문자를 변환 |
용도 | encodeURIComponent 를 사용 |
인터넷 주소 전체를 인코딩할 때 |
주소를 파라미터로 사용할 때 예) 'http://opentutorials.org/?uri='+encodeURIComponent(url); |
예제 |
alert(escape('http://opentutorials.org?title=생활코딩&코딩생활')) http%3A//opentutorials.org%3Ftitle%3D%uC0DD%uD65C%uCF54%uB529%26%uCF54%uB529%uC0DD%uD65C |
alert(encodeURI('http://opentutorials.org?title=생활코딩&코딩생활')) http://opentutorials.org?title=%EC%83%9D%ED%99%9C%EC%BD%94%EB%94%A9&%EC%BD%94%EB%94%A9%EC%83%9D%ED%99%9C |
alert(encodeURIComponent('http://opentutorials.org?title=생활코딩&코딩생활')) http%3A%2F%2Fopentutorials.org%3Ftitle%3D%EC%83%9D%ED%99%9C%EC%BD%94%EB%94%A9%26%EC%BD%94%EB%94%A9%EC%83%9D%ED%99%9C |
예제(Example)
var title = '생활코딩&코딩생활'; var str = 'http://opentutorials.org?title='+encodeURIComponent(title); alert(str);
참고