正确编码查询字符串参数
本工具有两种模式。“组件”(encodeURIComponent)用于单个参数名或参数值;“完整 URL”(encodeURI)用于结构已经正确的完整 URL。混用两者是查询字符串出错的最常见原因。
计算示例
“完整 URL”模式保留了值里的 &,服务器因此读到两个参数而不是一个。
- 输入
- https://example.com/search?q=salt & pepper&page=2
- 结果 ·
encodeURI() - https://example.com/search?q=salt%20&%20pepper&page=2
服务器读取到的参数
- "q" = "salt "
- " pepper" = ""
- "page" = "2"
先用“组件”模式编码这个值,它就会保持为一个参数。
- 输入
- salt & pepper
- 结果 ·
encodeURIComponent() - salt%20%26%20pepper
https://example.com/search?q=salt%20%26%20pepper&page=2
服务器读取到的参数
- "q" = "salt & pepper"
- "page" = "2"
“组件”与“完整 URL”模式逐字符对比
| 字符 | 组件 | 完整 URL |
|---|---|---|
| : | %3A | : |
| / | %2F | / |
| ? | %3F | ? |
| # | %23 | # |
| & | %26 | & |
| = | %3D | = |
| + | %2B | + |
| ␠ | %20 | %20 |
| é | %C3%A9 | %C3%A9 |
工具的处理方式
- 用“组件”模式分别编码每个参数名和参数值,它会转义 & = ? # + 和 /。
- 把编码后的键值对按 名称=值 的形式用 & 连接,再放到 URL 的 ? 之后。
- “完整 URL”模式只用于整个 URL:它会保留 : / ? # & = + 不变,因此无法保护包含这些字符的值。