[javascript] 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 ()는 인코딩하지 않습니다 : ~! * () ‘


답변

다음은 요약입니다.

  1. escape ()는 @ * _ +-를 인코딩하지 않습니다. /

    사용하지 마십시오.

  2. encodeURI ()는 AZ az 0-9를 인코딩하지 않습니다. , /? : @ & = + $-_. ! ~ * ‘() #

    입력이 ‘ https://searchexample.com/search?q=wiki ‘ 와 같은 완전한 URL 일 때 사용하십시오.

  3. encodeURIComponent ()는 AZ az 0-9-_를 인코딩하지 않습니다. ! ~ * ‘() 입력이 완전한 URL의 일부인 경우에 사용하십시오. 예 :
    const queryStr = encodeURIComponent(someString)

답변

encodeURIComponent () : 인수가 URI의 일부 (예 : 프로토콜, 호스트 이름, 경로 또는 쿼리 문자열) 인 것으로 가정합니다. 따라서 URI 부분을 구분하는 데 사용되는 문장 부호 문자를 이스케이프합니다.

encodeURI () : 기존 URL을 인코딩하는 데 사용됩니다


답변

차이 사이 encodeURIencodeURIComponent:

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 +              '+/@'          )