MiServe DevTools

我的贴纸

把工具固定在这里,会保存在此浏览器中。

URL 编码 / 解码与解析

对单个值、完整 URL 或表单数据进行百分号编码或解码,并把任意 URL 拆分成各个组成部分和查询参数。

在浏览器中运行。粘贴的内容不会被上传。

关于此工具

什么是百分号编码

URL 只能包含有限的一组 ASCII 字符,其中一些还有特定用途:? 开始查询部分,& 分隔参数,# 开始片段。其他字符,以及作为普通数据使用的保留字符,都要把每个字节写成百分号加两位十六进制数字。空格变成 %20,而 é 在 UTF-8 中占两个字节,会变成 %C3%A9。具体规则见 RFC 3986。

解码就是反过来。如果百分号后面不是两位十六进制数字,或者转义后的字节不是有效的 UTF-8,解码就会失败;工具会指出出错的序列及其位置。

该用哪种模式

组件适用于 URL 中的单个部分:一个查询值、一个路径段,或作为参数传递的重定向 URL。它会转义 /、?、& 和 =,因此这个值不会被误认为 URL 结构的一部分。

完整 URL 适用于只需要处理空格和非 ASCII 字符的完整地址。它不会改动结构字符,这也意味着当值本身包含这些字符时,它保护不了这个值。它同样会转义 %,所以对已经编码过的 URL 再运行一次会造成重复编码;它还会转义主机中 IPv6 地址两侧的方括号。解码时,此模式会让结构字符的转义(如 %2F 和 %26)保持原样。

表单即 application/x-www-form-urlencoded 格式,浏览器提交 HTML 表单时使用它,无论数据放在查询字符串还是请求体中,空格都写成 +。解码时,只有在此模式下 + 才会被读作空格。

URL 是如何解析的

如果输入是绝对 URL,工具会用浏览器自带的 URL 解析器读取它;否则,如果输出是绝对 URL,就读取输出。这个解析器也是浏览器处理链接和 fetch 时用的那个。表格列出协议、凭据、主机、端口、路径和片段,以及每个查询参数解码后的键和值。解析器会对读到的内容进行规范化。例如在 Web URL 中,它会把协议和主机转为小写,解析路径中的 . 和 .. 段,并对空格等字符进行百分号编码,所以各部分可能与输入时略有不同。http 或 https URL 中的国际化域名会以 ASCII(Punycode)形式显示,因为解析器就是这样存储的。

如果 URL 没有写明端口,而工具知道该协议的默认端口,就会显示这个默认值,例如 https 的 443。

常见问题

encodeURI 和 encodeURIComponent 有什么区别?

encodeURI 用于完整的 URL,不会改动 : / ? # & 和 = 等字符。encodeURIComponent 用于 URL 中的单个值,这些字符也会被转义。查询值要用 encodeURIComponent,否则值里的 & 或 = 会破坏查询字符串。

空格应该编码成 %20 还是 +?

%20 在 URL 的任何位置都有效。只有在 application/x-www-form-urlencoded 数据中,+ 才表示空格;HTML 表单就是用这种格式在查询字符串或请求体中发送字段的。在路径中,+ 就是普通的加号。

为什么解码含有百分号的值时会报错?

百分号总是表示转义序列的开始,所以百分号本身必须写成 %25。像“100% free”这样的文本不是有效的百分号编码输入,因为百分号后面没有跟两位十六进制数字。

我粘贴的 URL 会被发送到服务器吗?

不会。编码、解码和解析都由浏览器标签页中的 JavaScript 完成。此工具不会用你输入的内容发出任何网络请求。

编码分类的其他工具