关于此工具
这款免费的 URL 编码器 / 解码器将文本进行百分号编码,使其可以安全地用在 URL 或查询字符串中,也能把编码后的 URL 还原成可读文本。
它正确处理 UTF-8,因此带音标的字母、表情符号和非拉丁文字都能编码和解码而不会损坏。全部在您的浏览器中运行,不上传任何内容。
什么是百分号编码
URL 只允许包含一小部分字符。其他一切——空格、引号、&、#、?、带音标的字母、所有中文或阿拉伯文——都必须先改写才能传输。
百分号编码的做法是把一个字符替换成 % 加上它的字节值的十六进制表示。空格变成 %20,与号变成 %26,问号变成 %3F。思路与 Base64 相同——让棘手的数据能通过挑剔的通道——只是逐字符进行,因此结果大体上仍然可读。
由于编码的是字节,一个在 UTF-8 中占用多个字节的字符会产生多个转义序列。é 占两个字节,变成 %C3%A9。一个汉字通常占三个字节,变成三个转义序列。一个表情符号占四个字节。这就是含中文的 URL 编码后看起来那么长的原因。
为什么重要:`&` 的问题
这就是这款工具要防止的错误,几乎每个人都会遇到一次。
查询字符串用 & 和 = 分隔它的值:
/search?q=coffee&page=2
现在假设有人搜索 Bed & Breakfast。直接放进去:
/search?q=Bed & Breakfast&page=2
服务器现在看到的是三个参数——q 是 Bed ,然后是一个毫无意义的参数 Breakfast,再然后是 page。搜索悄无声息地返回了错误的结果。先对值进行编码就正常了:
/search?q=Bed%20%26%20Breakfast&page=2
由此得出规则:对每个值编码,而不是对整个 URL 编码。 构成查询字符串结构的 & 和 = 必须保持原样;值内部的 & 则不能。
编码一个值,还是整个 URL
这是让人绊倒的区别,也是 JavaScript 里存在两个不同函数的原因。
encodeURIComponent 几乎编码所有字符,包括 /、?、#、& 和 =。用它处理 URL 的某一个片段——搜索词、文件名、重定向目标、令牌。大多数情况下需要的是它,这款工具做的也是它。
encodeURI 不动那些构成结构的字符,因为它假定你交给它的是一个完整且已经正确的 URL,只需要清理其中不合法的字符。用它处理整个 URL,绝不要用在单个值上。
用 Component 版本编码整个 URL,每个 / 都会变成 %2F,地址就失效了。用 URI 版本编码一个值,你的 & 会原样通过并破坏查询字符串。清楚自己要做哪一种,就是全部诀窍。
与 HTML 转义不是一回事
百分号编码和 HTML 转义看起来相似,解决的却是不同的问题。
百分号编码(%20、%26)让文本在 URL 中安全。HTML 转义(&、<)让文本在 HTML 文档中安全。打印在页面上的 URL 可能两者都需要,而且顺序固定——先为 URL 编码,再把结果为 HTML 转义。
还有一个众所周知的怪异之处:+ 有时表示空格。这是 HTML 表单留下的痕迹,application/x-www-form-urlencoded 用 + 代替 %20。大多数服务器在查询字符串中两者都接受,但路径中的 + 表示真正的加号。如果空格在意料之外的地方变成了 +,原因就是表单编码器。
使用方法
- 把文本或 URL 粘贴到输入框
- 用按钮编码或解码
- 交换,把结果送回输入框
- 复制结果
值得注意
- 编码值,而不是整个 URL。 把完整地址送进编码器会把每个 / 变成 %2F,地址随之失效。
- 绝不要编码两次。 % 本身会被编码为 %25,所以第二次会把 %20 变成 %2520,空格就丢了。这是链接莫名其妙失效最常见的原因。
- 保留字符带有含义——包括 :、/、?、#、@、&、=、+ 和 $。它们在 URL 中合法,但出现在值内部时必须编码。
- 非保留字符永远不会被编码: A–Z、a–z、0–9、-、_、. 和 ~。
- 十六进制的大小写没有区别。 %3f 和 %3F 相同,惯例是使用大写。
- 单独的 % 无效。 如果解码失败,找一找后面没有跟两位十六进制数字的 %——往往说明字符串被截断了。
常见问题
URL 里的 %20 是什么意思?
是空格。空格不允许出现在 URL 中,因此被百分号编码为 %20:% 后面的 20 是空格字节值的十六进制表示。有时也会看到空格写成 +,那是表单编码留下的习惯;在查询字符串中两者都能被理解,但在路径中只有 %20 是正确的。
我应该编码整个 URL 还是只编码一部分?
只编码其中的部分。对每个要放进 URL 的值——搜索词、文件名、重定向地址——分别编码,而构成 URL 结构的 ://、/、?、& 和 = 保持不动。编码完整的 URL 会把斜杠变成 %2F,地址就无法解析了。
为什么编码之后我的链接坏了?
几乎都是重复编码造成的。% 这个字符本身会被编码为 %25,所以对已经编码过的字符串再编码一次,%20 就变成了 %2520。解码时得到的是字面上的 %20 而不是空格。再次编码前,先解码一次看看手上到底是什么。
为什么一个带音标的字母会变成好几个 % 代码?
因为百分号编码处理的是字节,不是字母。在 UTF-8 中 é 占两个字节,所以变成 %C3%A9。大多数中文、日文和韩文字符占三个字节,变成三个转义序列;表情符号占四个字节。这不是出错,只是字符本身的大小如此。
URL 编码和 HTML 转义有什么区别?
它们保护的位置不同。URL 编码(%26)让文本在网址中安全。HTML 转义(&)让文本在 HTML 页面中安全。打印在页面上的链接可能两者都需要,并且有先后顺序。把其中一个用在另一个该用的地方,原来的问题依然存在。
我的文本会被发送到服务器吗?
不会。编码和解码都在您的浏览器中完成,粘贴的内容不会离开您的设备。断开网络连接后工具依然可用。
相关工具
- Base64 编码 / 解码 — 在令牌和 data URL 中不断遇到的另一种编码
- JSON 格式化 — 整理并检查那些查询字符串里常带的 JSON
- JWT 解码器 — 读取通过 URL 送达的令牌
- 提取邮箱和网址 — 从一段文字中取出全部链接