URL(URI) 中的编码与乱码(下)--查询字符串(query string)中的编码

在上篇中, 初步谈论了 URL 中含有中文字符时的转义编码, 提到了所使用的编码是 utf-8.

不过你可能会有点疑问, 一定都是要用 utf-8 编码吗? 还是因为页面编码本身是 utf-8 的缘故呢? 毕竟在那个例子中, 页面的编码也恰好是 utf-8.

在 GBK 编码页面下的 URL 转义

这次, 将继续测试页面编码是 gbk 时的情况, 如下:

<!DOCTYPE html>
<html>
<head>
<meta charset="GBK">
<title>带中文的 URL（GBK）</title>
</head>
<body>
	测试带中文的 URL，页面编码为：GBK
	<br> 中文链接：
	<a href="你好/index.html">你好/index.html</a>
	<br> 中文链接并带有中文查询字符串：
	<a href="你好/index.html?s=你好">你好/index.html?s=你好</a>
</body>
</html>

打开时, 是正常的:

gbk 编码页面中文 url 浏览器测试

当然, 你可能会想, 打开前, 还不知道页面的编码呢, 那么事实上也是如此, 此时请求的 url 依然是 utf-8 编码的:

gbk 编码页面中文 url request header

那么继续点击其中的"你好/index.html"链接时呢? 结果页面还是 OK 的:

中文路径 url 从 gbk 页面发出浏览器测试

查看其发出的 url:

中文路径 url 从 gbk 页面发出 request header

尽管此时在 gbk 编码的页面发出此请求, 但它的编码还是 utf-8.

那么是否就可以得出结论, 即 url 中的编码始终是用 utf-8 呢? 然而事情没有那么简单, 正像你看到页面中还有一个链接, 下面那个带有中文 查询字符串 的链接:

你好/index.html?s=你好

在 gbk 页面下点击它时是怎样的情况呢? 在此之前, 先要对 URL 中的结构做些了解.

URL 中的结构简介

多数的 URI 结构可以这样去划分:

<scheme>://:@<host>:<port>/<path>;?<query>#<frag>

下面从一些例子中具体介绍各个部分的含义. 一个具体例子:

https😕/xiaogd.net:443/?p=1699

其中:

scheme（协议, 方案）为 https；
host（主机名, 域名）为 xiaogd.net,
端口（port）为 443；
query（查询字符串）为 p=1699.

这是上一篇文章的一个短连接（short link）, 点击它会重定向到上一篇章中(已失效).

注: 这个例子中, 没有用户名, 密码, 没有路径（path）（也可以认为有一个路径, 就是根路径"/"本身）, 没有 params, 也没有 frag. https 协议的默认端口即为 443, 通常可以省略.

其中查询字符串 query strings, uri 规范中的标准叫法为 query component（查询组件）, 用分隔符问号 “?” 与其它部分隔开, 具体内容可以由多个 键值对 组成, 中间由 “&” 符号分隔, 键与值之间用分隔符等号 “=” 隔开:

如: http://localhost/foo?userid=9527&gender=male 中的查询字符串有两个键值对:

userid=9527
gender=male

另一个例子:

http😕/exp.xiaogd.net:80/demo/css/stroke-animate/stroke-animation.html

其中, 路径 path 为 /demo/css/stroke-animate/stroke-animation.html.

注: http 协议的默认端口即为 80, 通常可以省略；如果不是 80 就不能省略, 如测试常用的 8080 端口, 就要显式地在 url 中带上, 这一端口来自于 web server 启动时所绑定（监听）的那个.

frag（fragments, 片段, 分段）是页面内的链接（锚点）, 位于最后, 用井号（#）跟其它部分隔开, 严格地讲它不属于 url 的一部分, 它的值通常即为页面内某个标题元素的 id. 一个具体例子:

https://www.xiaogd.net/md/url-charset-encoding-and-mojibake-1#tomcat_与_URIEncoding_设置

点击它与点击 https://www.xiaogd.net/md/url-charset-encoding-and-mojibake-1/ 都是跳到同一个页面, 但它会滚动到页面内的某个元素下（通常为某个子标题）, 跟你打开这个页面单击那个目录下的标题类似:

url fragments 页内链接示例

其实上图目录下的就是这种页面内的锚点（frag）, 分享一个比较长的页面时, 这种方式能够更加精准地定位到页内的某个段落上, 免得别人去翻找.

你可以亲自点击上述两个链接看看结果有什么不同!

其它的一些例子如:

ftp://anonymous@ftp.prep.ai.mit.edu/pub/gnu
ftp://anonymous:my_passwd@ftp.prep.ai.mit.edu/pub/gnu
http://joe:joespasswd@www.joes-hardware.com/sales_info.txt
ftp://prep.ai.mit.edu/pub/gnu;type=d
http://www.joes-hardware.com/hammers;sale=false/index.html;graphics=true

包含有其它一些协议, 如 ftp；还有用户名, 密码的例子, 以及 param 的例子.