URL 인코딩에 encodeURI 또는 encodeURIComponent를 사용해야합니까?
URL 인코딩에이 두 가지 방법 중 어떤 것을 사용해야합니까?
실제로하고 싶은 것에 달려 있습니다.
encodeURI는 입력이 인코딩이 필요한 일부 문자를 가질 수있는 완전한 URI라고 가정합니다.
encodeURIComponent는 모든 것을 특별한 의미로 인코딩하므로 다음과 같은 URI 구성 요소에 사용합니다.
var world = "A string with symbols & characters that have special meaning?";
var uri = 'http://example.com/foo?hello=' + encodeURIComponent(world);
URL 구성 요소 (querystring 매개 변수)에 넣을 문자열을 인코딩하는 경우을 호출해야합니다 encodeURIComponent
.
기존 URL을 인코딩하는 경우을 호출하십시오 encodeURI
.
xkr.us 는 예제와 함께 훌륭한 토론을합니다. 요약을 인용하려면 :
escape () 메소드는 서버 측의 공백으로 해석되고 필드에 공백이있는 양식으로 생성 된 + 문자를 인코딩하지 않습니다. 이 단점과이 함수가 비 ASCII 문자를 올바르게 처리하지 못하기 때문에 가능할 때마다 escape ()를 사용하지 않아야합니다. 가장 좋은 대안은 일반적으로 encodeURIComponent ()입니다.
escape ()는 다음을 인코딩하지 않습니다 : @ * / +
encodeURI () 메소드는 URL의 일부인 querystring과 반대로 URI를 인코딩한다는 점에서 escape ()보다 약간 더 전문화되어 있습니다. URI를 사용하고 특정 문자를 인 코드하지 않고 유지해야하는 자원에 사용할 문자열을 인코딩해야하는 경우이 방법을 사용하십시오. 이 메소드는 URI 내의 유효한 문자이므로 '문자를 인코딩하지 않습니다.
encodeURI ()는 인코딩하지 않습니다 : ~! @ # $ & * () = : /,;? + '
마지막으로, 대부분의 경우 URI의 단일 구성 요소를 인코딩 할 때 encodeURIComponent () 메소드를 사용해야합니다. 이 메소드는 일반적으로 URI의 특수 문자로 인식되는 특정 문자를 인코딩하여 많은 구성 요소가 포함될 수 있습니다. 이 메소드는 URI 내의 유효한 문자이므로 '문자를 인코딩하지 않습니다.
encodeURIComponent ()는 인코딩하지 않습니다 : ~! * () '
다음은 요약입니다.
escape ()는 @ * _ +-를 인코딩하지 않습니다. /
사용하지 마십시오.
encodeURI ()는 AZ az 0-9를 인코딩하지 않습니다. , /? : @ & = + $-_. ! ~ * '() #
입력이 ' https://searchexample.com/search?q=wiki ' 와 같은 완전한 URL 인 경우이를 사용하십시오.
- encodeURIComponent ()는 AZ az 0-9-_를 인코딩하지 않습니다. ! ~ * '() 입력이 완전한 URL의 일부인 경우에 사용하십시오. 예 :
const queryStr = encodeURIComponent(someString)
encodeURIComponent () : 해당 인수가 URI의 일부 (예 : 프로토콜, 호스트 이름, 경로 또는 쿼리 문자열) 인 것으로 가정합니다. 따라서 URI 부분을 구분하는 데 사용되는 문장 부호 문자를 이스케이프합니다.
encodeURI () : 기존 URL을 인코딩하는 데 사용됩니다
차이 사이 encodeURI
및 encodeURIComponent
:
encodeURIComponent(value)
주로 queryString 매개 변수 값을 인코딩하는 데 사용되며의 모든 해당 문자를 인코딩합니다 value
. encodeURI
프로토콜 접두사 ( http://
) 및 도메인 이름을 무시합니다 .
매우 드문 경우이지만 ! *
다음 과 같은 추가 문자를 인코딩하기 위해 수동 인코딩을 구현하려는 경우 (일반적인 경우 인코딩 할 필요는 없지만) 다음 과 같이 사용할 수 있습니다.
function fixedEncodeURIComponent(str) {
return encodeURIComponent(str).replace(/[!*]/g, function(c) {
return '%' + c.charCodeAt(0).toString(16);
});
}
( 소스 )
다른 답변은 목적을 설명합니다. 각 함수 가 실제로 변환 할 문자는 다음과 같습니다 .
control = '\x00\x01\x02\x03\x04\x05\x06\x07\x08\x09\x0A\x0B\x0C\x0D\x0E\x0F'
+ '\x10\x11\x12\x13\x14\X15\x16\x17\x18\x19\x1A\x1B\x1C\x1D\x1E\x1F'
+ '\x7F'
encodeURI (control + ' "%<>[\\]^`{|}' )
encodeURIComponent(control + ' "%<>[\\]^`{|}' + '#$&,:;=?' + '+/@' )
escape (control + ' "%<>[\\]^`{|}' + '#$&,:;=?' + "!'()~")
위의 모든 문자는 퍼센트 16 진수 코드로 변환됩니다. 공백 %20
, 퍼센트 %25
, 등. 아래 문자는 변경되지 않습니다.
함수 가 변환하지 않는 문자는 다음과 같습니다 .
pass_thru = '*-._0123456789ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz'
encodeURI (pass_thru + '#$&,:;=?' + '+/@' + "!'()~")
encodeURIComponent(pass_thru + "!'()~")
escape (pass_thru + '+/@' )
일반적으로 사용 encodeURIComponent
합니다. 그것이 더 구체적으로 사용된다고 생각하는 긴 이름을 두려워하지 마십시오. 저에게 가장 일반적으로 사용되는 방법입니다. 또한 encodeURI를 사용하여 테스트하지 않았으므로 제대로 인코딩 된 것 같습니다. 아마도 사용하려는 것이 아니며 이름 필드에서 "Fred"를 사용하는 간단한 테스트를 수행해도 효과가 있습니다. 나중에 앰퍼샌드 또는 해시 태그 추가와 같은 고급 텍스트를 사용하면 실패합니다. 그 이유에 대한 다른 답변을 볼 수 있습니다.
'development' 카테고리의 다른 글
기기가 iPhone X인지 감지 (0) | 2020.04.07 |
---|---|
malloc + memset이 calloc보다 느린 이유는 무엇입니까? (0) | 2020.04.06 |
"정적 컨텍스트에서 비 정적 메소드를 참조 할 수 없음"의 이유는 무엇입니까? (0) | 2020.04.06 |
Android-SDK 버전 23 업데이트 후 ACTION-VIEW 인 텐트 필터를 사용하여 하나 이상의 활동 추가 (0) | 2020.04.06 |
윈도우에서 포트 포워딩 (0) | 2020.04.06 |