了解空格的编码方式:%withencodeURI 与 +withURL

您可以使用encodeuri 或url 对查询字符串进行编码。最近,我注意到 url 对空格的编码不同。我将讨论为什么他们以不同的方式处理编码。在深入讨论该主题之前,我将向您展示如何使用每种方法进行编码。

用法

1. 编码uri

// 'https://www.google.com/search?q=programming%20language'encodeuri('https://www.google.com/search?q=programming language')

您可以使用encodeuri 函数对uri 进行编码。然而,。它不会对属于 uri 有效部分的部分字符进行编码,因此您可能需要使用encodeuricomponent 函数来正确编码查询字符串或 uri 中的其他组件。

例如,假设您有一个值为
的查询字符串 qhttps://www.google.com/search?q=& 是什么意思?.

// 'https://www.google.com/search?q=what%20is%20the%20meaning%20of%20&?'encodeuri('https://www.google.com/search?q=what is the meaning of &?')

了解空格的编码方式:%withencodeURI 与 +withURL

&(& 符号)未按应有的方式转换为 &。因为 &(& 符号) 可以是 uri 的有效部分。因此,对查询字符串使用encodeuricomponent 总是更安全。

const url = encodeuri('https://google.com/search');const querystring = `?q=${encodeuricomponent('what is the meaning of &?')}`;// 'https://google.com/search?q=what%20is%20the%20meaning%20of%20%26%3f';url+querystring;

了解空格的编码方式:%withencodeURI 与 +withURL

由于encodeurix和相关函数将uri视为字符串,因此您必须处理特殊字符,例如?和你自己。或者,您可以使用 url 来简化流程。

2. 网址

使用 url 进行编码时,需要分别处理基本 url 和查询字符串。

了解空格的编码方式:%withencodeURI 与 +withURL

const url = 'https://www.google.com/search?q=programming language';// 'https://www.google.com/search?q=programming language'url.tostring();

如果使用 url 构造函数一次对所有内容进行编码,如上例所示,查询字符串可能无法正确编码。

const url = new url('https://www.google.com/search');url.searchparams.set('q', 'programming language');// 'https://www.google.com/search?q=programming+language'url.tostring();

了解空格的编码方式:%withencodeURI 与 +withURL

通过 url 对象的 searchparams 属性设置查询字符串,可以设置查询字符串。

在这种情况下,空格将转换为 。在解释为什么会发生这种情况之前,让我们用另一个查询字符串对其进行测试,看看它如何处理其他特殊字符。

const url = new url('https://www.google.com/search');url.searchparams.set('q', 'what is the meaning of &?');// 'https://www.google.com/search?q=what+is+the+meaning+of+%26%3f'url.tostring();

其他特殊字符按预期编码。

现在,让我们深入探讨为什么会出现这些差异。

编码

1. 编码uri

encodeurix 函数根据 rfc2396 进行编码。 uri 不仅仅是互联网上的一个位置;它可以引用任何类型的资源。这就是为什么它被称为 uri(统一资源标识符)而不是 url(统一资源定位符)。

2. 网址

url api 根据 rfc3986 进行编码,这是更新的 uri 规范。

如果您需要使用encodeuri来实现此行为,请参阅此。 – rf3986 的encodeuricomponent 编码)。

urlsearchparams 遵循百分比编码规则进行编码。根据文档,它用“ ”替换空格。

虽然我在 rfc 中找不到此行为的规范,但 mdn 的encodeuricomponent 文档指出:

比格设计 比格设计

比格设计是135编辑器旗下一款一站式、多场景、智能化的在线图片编辑器

比格设计 124 查看详情 比格设计

对于 application/x-www-form-urlencoded,空格将被 替换,因此人们可能希望在encodeuricomponent() 替换之后额外用 替换 。

这解释了为什么 urlsearchparams 中的空格被替换为“ ”,因为它遵循 application/x-www-form-urlencoded 标准。

您可能已经注意到,url 和 urlsearchparams 遵循不同的 rfc。

让我们看一些例子。

url = new url('http://[2001:db8::1]:8080/resource?v=key:value');// 'http://[2001:db8::1]:8080/resource?v=key:value'url.tostring();

如图所示,url 不对括号和冒号进行编码,因为它们是 ipv6 地址的一部分。但是,即使冒号是查询字符串的一部分,它也不会被编码为 :。它与百分比编码表不同。

这意味着您需要分别对 url 和查询字符串进行编码。

url = new url('http://[2001:db8::1]:8080/resource');url.searchparams.set('v', 'key:value');// 'http://[2001:db8::1]:8080/resource?v=key%3avalue'url.tostring();

了解空格的编码方式:%withencodeURI 与 +withURL

现在,url 和查询字符串已正确编码。

结论

encodeuri、encodeuricomponent、url 和 urlsearchparams 函数各自有不同的用途,您应该根据您的具体需求使用它们。

encodeuri:根据 rfc2396 对 uri 进行编码。它不会对属于 uri 有效部分的字符进行编码。如果您需要根据 rfc3986 对 uri 进行编码,请参阅此 mdn 文档。

encodeuricomponent:根据 rfc2396 对 uri 的组件进行编码,例如路径、片段或查询字符串。它包含未由encodeuri 编码的字符。

url:根据 rfc3986 对 web url 进行编码。

urlsearchparams:根据 application/x-www-form-urlencoded 标准对参数进行编码。

如果需要将 (加号)替换为 ,可以手动执行,如下所示:

url.search = url.search.replace(/+/g, '%20');

在使用 web 开发、restful api 或 web url 时,url 是可靠的选择。此外,它遵循 rfc3986,它比 rfc2396 更新。

希望您觉得这有帮助。

编码快乐!

以上就是了解空格的编码方式:%withencodeURI 与 +withURL的详细内容,更多请关注创想鸟其它相关文章!

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。
如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至 chuangxiangniao@163.com 举报,一经查实,本站将立刻删除。
发布者:程序猿,转转请注明出处:https://www.chuangxiangniao.com/p/396710.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2025年11月6日 17:51:12
下一篇 2025年11月6日 17:55:25

相关推荐

发表回复

登录后才能评论
关注微信