【问题标题】：Should I use encodeURI or encodeURIComponent for encoding URLs?我应该使用 encodeURI 还是 encodeURIComponent 来编码 URL？
【发布时间】：2011-05-31 06:10:48
【问题描述】：

这两种方法中的哪一种应该用于编码 URL？

【问题讨论】：

另见stackoverflow.com/a/3608791/632951
一个主要区别是encodeURI 不会编码/ 所以：encodeURIComponent("ac/dc") => ac%2Fdc 和encodeURI("ac/dc") => ac/dc
这可能会有所帮助："encodeURIComponent() and encodeURI() encode a URI by replacing URL reserved characters with their UTF-8 encoding....They differ because encodeURI does not encode queryString or hash values...URLs do not allow many special characters, like spaces or slashes. However these special characters are part of life, so URL encoding was invented."Source
另见标题为encodeURIComponent differs from encodeURI as follows的特定部分：developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/…

标签： javascript

【解决方案1】：

这取决于你真正想要做什么。

encodeURI 假定输入是一个完整的 URI，其中可能包含一些需要编码的字符。

encodeURIComponent 将对具有特殊含义的所有内容进行编码，因此您可以将其用于 URI 的组件，例如

var world = "A string with symbols & characters that have special meaning?";
var uri = 'http://example.com/foo?hello=' + encodeURIComponent(world);

【讨论】：

【解决方案2】：

如果您要对字符串进行编码以放入 URL 组件（查询字符串参数），则应调用 encodeURIComponent。

如果您要对现有 URL 进行编码，请致电 encodeURI。

【讨论】：

如果我使用 ajax 如何解码传递给 php 的 url？
你没有。网络服务器会自动执行此操作。
@Aditya：这取决于你在做什么。
@slaks 。我通过 get 传递参数，所以我想在 php 中检索它们。
好吧。当我说 webserver 会执行此操作时，我可能说得有点仓促，但是您用来读取表单数据的任何库都会为您处理它。

【解决方案3】：

xkr.us 进行了精彩的讨论，并附有示例。引用他们的总结：

escape() 方法不编码 + 字符，它是解释为服务器端的空间以及由字段中带有空格的表格。由于这个缺点和这个函数无法处理非 ASCII 字符的事实正确地，您应该尽可能避免使用 escape() 。这最好的选择通常是 encodeURIComponent()。

escape() 不会编码：@*/+

encodeURI() 方法的使用比 escape() 更专业一些因为它对 URI 进行编码，而不是查询字符串，后者是 URL 的一部分。当您需要将字符串编码为用于任何使用 URI 并需要某些字符的资源保持未编码。请注意，此方法不编码 ' 字符，因为它是 URI 中的有效字符。

encodeURI() 不会编码：~!@#$&*()=:/,;?+'

最后，在大多数情况下应该使用 encodeURIComponent() 方法在对 URI 的单个组件进行编码时。此方法将编码某些通常被识别为特殊字符的字符 URI，以便可以包含许多组件。注意这个方法不编码 ' 字符，因为它是 URI。

encodeURIComponent() 不会编码：~!*()'

【讨论】：

最近学习了。 TOMCAT 9 服务器更注重您可以发送到 URL 的内容。在需要编码的内容中有“空格”的情况下，encodeURIComponent() 似乎效果更好。 Tomcat 8 不在乎，但 9 更特别。
换句话说，如果您尝试将文件名转换为 URL 并且文件名中包含 #，encodeURI 将失败

【解决方案4】：

这是一个摘要。

escape() 不会编码 @ * _ + - 。 /

不要使用它。
encodeURI() 不会对 A-Z a-z 0-9 进行编码； , / ? ：@ & = + $ - _ 。！ ~ * ' ( ) #

当您的输入是完整的 URL（如“https://searchexample.com/search?q=wiki”）时使用它
encodeURIComponent() 不会对 A-Z a-z 0-9 - _ 进行编码。！ ~ * ' ( ) 当您的输入是完整 URL 的一部分时使用它例如 const queryStr = encodeURIComponent(someString)

【讨论】：

这是一个很好的答案，因为它准确地说明了他们的工作。但是我仍然有一个关于我应该使用哪个以及何时使用的问题。如果我的 URI 组件是一个完整的 URL 怎么办？然后我应该使用上面的规则 2 或规则 3 还是两者都像 encodeURIComponent ( encodeURI (theCompleteURI ))
如果您想将完整的 URL 放入查询参数中，请使用 encodeURIComponent 例如https://example.test/?url=https%3A%2F%2Fexample.test%2fhome

【解决方案5】：

encodeURI 和 encodeURIComponent 用于不同的目的。
有些区别是

encodeURI 用于对完整 URL 进行编码，而 encodeURIComponent 用于对 URI 组件进行编码，例如一个查询字符串。
有11个字符不是用encodeURI编码的，而是用encodeURIComponent编码的。列表：

Character	encodeURI	encodeURIComponent
#	#	%23
$	$	%24
&	&	%26
+	+	%2B
,	,	%2C
/	/	%2F
:	:	%3A
;	;	%3B
=	=	%3D
?	?	%3F
@	@	%40

注意：
encodeURIComponent 不编码 -_.!~*'()。如果要对这些字符进行编码，则必须将它们替换为相应的 UTF-8 字符序列

如果您想了解有关 encodeURI 和 encodeURIComponent 的更多信息，请查看参考链接。 Reference Link

【讨论】：

【解决方案6】：

encodeURIComponent() ：假设它的参数是一部分（例如协议、主机名、路径或查询字符串）一个 URI。因此，它转义了用于分隔 URI 各个部分的标点符号。

encodeURI()：用于对已有的url进行编码

【讨论】：

【解决方案7】：

`encodeURI` 和`encodeURIComponent` 的区别：

encodeURIComponent(value)主要用于对queryString参数值进行编码，对value中每个适用的字符进行编码。 encodeURI 忽略协议前缀 (http://) 和域名。

在非常非常罕见的情况下，当您想要实现手动编码来编码其他字符（尽管它们在典型情况下不需要编码）时，例如：! *，那么你可能会使用：

function fixedEncodeURIComponent(str) {
  return encodeURIComponent(str).replace(/[!*]/g, function(c) {
    return '%' + c.charCodeAt(0).toString(16);
  });
}

(source)

【讨论】：

你不应该转义 url 中的那些字符。
正如引用的文档所说：“这些字符没有正式的 URI 分隔用途”
@caesarsol 那么，我应该编辑我的答案吗？让我知道你的想法，因为我不明白引用的文档是什么意思..
对这些字符进行编码是没有用的，除非你在做一些超出正常 URL 编码用例的事情:)

【解决方案8】：

其他答案描述了目的。以下是每个函数将实际转换的字符：

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 + ' "%<>[\\]^`{|}' + '#$&,:;=?' +       "!'()~")

以上所有字符都转换为百分比十六进制代码。空格到%20，百分号到%25等。下面的字符不变。

以下是函数不会转换的字符：

pass_thru = '*-._0123456789ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz'

encodeURI         (pass_thru + '#$&,:;=?' + '+/@' + "!'()~")
encodeURIComponent(pass_thru +                      "!'()~")
escape            (pass_thru +              '+/@'          )

【讨论】：

【解决方案9】：

通常使用encodeURIComponent。不要害怕长名字以为它的用途更具体，对我来说这是更常用的方法。也不要因为你测试过而使用 encodeURI 并且它似乎编码正确，这可能不是你想要使用的，即使你在名字字段中使用“Fred”的简单测试有效，你会发现稍后当您使用更高级的文本（例如添加＆符号或主题标签）时，它将失败。您可以查看其他答案以了解原因。

【讨论】：

encodeURI 和encodeURIComponent 的区别：

`encodeURI` 和`encodeURIComponent` 的区别：