你什么时候应该使用转义而不是encodeURI / encodeURIComponent？escape（）encodeURI（）encodeURIComponent（）

javascript query-string encoding

2022-08-29 22:00:04

对要发送到 Web 服务器的查询字符串进行编码时 - 何时使用，何时使用或：escape()encodeURI()encodeURIComponent()

使用转义：

escape("% +&=");

或

use encodeURI（） / encodeURIComponent（）

encodeURI("http://www.google.com?var1=value1&var2=value2");

encodeURIComponent("var1=value1&var2=value2");

答案 1

escape（）

不要使用它！在B.2.1.2节中定义转义，附件B的介绍文本说：escape()

...本附件中规定的所有语言特征和行为都具有一个或多个不良特征，在没有传统用法的情况下，将从本规范中删除。...
...程序员在编写新的 ECMAScript 代码时不应使用或假设这些功能和行为的存在。

行为：

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/escape

特殊字符的编码方式除外：@*_+-./

字符的十六进制形式（其代码单位值为 0xFF 或更小）是一个两位数的转义序列：。%xx

对于具有较大代码单位的字符，将使用四位数格式。这在查询字符串（如 RFC3986 中所定义）中是不允许的：%uxxxx

query       = *( pchar / "/" / "?" )
pchar         = unreserved / pct-encoded / sub-delims / ":" / "@"
unreserved    = ALPHA / DIGIT / "-" / "." / "_" / "~"
pct-encoded   = "%" HEXDIG HEXDIG
sub-delims    = "!" / "$" / "&" / "'" / "(" / ")"
              / "*" / "+" / "," / ";" / "="

仅当百分号后跟两个十六位数时才允许，不允许使用百分比后跟。u

encodeURI（）

当您需要一个有效的 URL 时，请使用 encodeURI。拨打此电话：

encodeURI("http://www.example.org/a file with spaces.html")

获取：

http://www.example.org/a%20file%20with%20spaces.html

不要调用 encodeURIComponent，因为它会破坏 URL 并返回

http%3A%2F%2Fwww.example.org%2Fa%20file%20with%20spaces.html

请注意，encodeURI 与 encodeURIComponent 一样，不会转义 ' 字符。

encodeURIComponent（）

如果要对 URL 参数的值进行编码，请使用 encodeURIComponent。

var p1 = encodeURIComponent("http://example.org/?a=12&b=55")

然后，您可以创建所需的URL：

var url = "http://example.net/?param1=" + p1 + "&param2=99";

你会得到这个完整的网址：

http://example.net/?param1=http%3A%2F%2Fexample.org%2F%Ffa%3D12%26b%3D55&param2=99

请注意，encodeURIComponent 不会对该字符进行转义。一个常见的错误是用它来创建html属性，例如，这可能会遭受注入错误。如果要从字符串构造 html，请使用代替属性引号，或者添加额外的编码层（可以编码为 %27）。'href='MyUrl'"''

有关此类编码的更多信息，您可以检查：http://en.wikipedia.org/wiki/Percent-encoding

答案 2

和之间的区别正好是 11 个字符，由 encodeURIComponent 编码，但不是由 encodeURI 编码：encodeURI()encodeURIComponent()

Table with the ten differences between encodeURI and encodeURIComponent

我用Google Chrome中的consor.table轻松生成了这个表，代码如下：

var arr = [];
for(var i=0;i<256;i++) {
  var char=String.fromCharCode(i);
  if(encodeURI(char)!==encodeURIComponent(char)) {
    arr.push({
      character:char,
      encodeURI:encodeURI(char),
      encodeURIComponent:encodeURIComponent(char)
    });
  }
}
console.table(arr);