公众号旧文
一个 URL 是由哪些部分组成的？
我们每天都在浏览网页，
但却很少观察浏览器地址栏里的那一串 URL。
例如下面这个地址：
https://www.851004721.xyz:443/blog/index.html?id=1#top
│ │ │ │ │ │
协议 域名 端口 路径 参数 锚点这一串字符，每一部分都有自己的职责。
理解了 URL 的组成，以后分析网站、排查问题、开发程序都会容易得多。
第一部分：协议（Scheme）
https://这部分告诉浏览器：使用什么协议去访问这个网站。
最常见的有：
httphttpsftpsshmailto
其中 http 是普通网页协议。
而 https 是在 HTTP 的基础上增加了 TLS 加密，也就是浏览器小锁头。
现在几乎所有正规网站都已经使用了 HTTPS，协议决定了客户端如何与服务器通信，是 URL 最前面的组成部分。
第二部分：域名（Host）
www.851004721.xyz域名就是服务器的名字。
浏览器并不能直接认识域名，它会先进行 DNS 查询，把域名解析成 IP 地址，例如：
www.851004721.xyz
↓
156.231.xxx.xxx然后浏览器再去连接对应的服务器。
实际上，URL 中这里也可以直接写 IP，例如：
https://8.8.8.8/不过绝大多数网站都会使用域名，因为域名更容易记忆。
第三部分：端口（Port）
:443端口可以理解为服务器上的房间号。
同一台服务器可以同时运行很多服务，例如：
| 服务 | 默认端口 |
|---|---|
| HTTP | 80 |
| HTTPS | 443 |
| SSH | 22 |
| FTP | 21 |
| MySQL | 3306 |
例如：
https://example.com:443/这里访问的是 HTTPS 默认端口。
由于 443 是 HTTPS 的默认端口，因此实际上下面两个地址完全等价：
https://example.com/和
https://example.com:443/浏览器会自动补上默认端口，所以很多网站都不会写出来。
第四部分：路径（Path）
/blog/index.html路径表示：访问服务器上的哪个资源。
例如：
/表示网站首页。
/news/表示新闻栏目。
/images/logo.png表示图片。
/blog/index.html表示 blog 目录下的 index.html。
可能会有人以为路径一定对应服务器上的真实文件，但实际上并不是。
现在大量网站都使用动态路由，例如：
/user/1001此时未必存在一个叫做 1001 的文件，而可能是程序根据 URL 动态生成页面。现代 Web 框架通常会把路径映射到程序中的路由，而不是文件系统。
第五部分：参数（Query）
?id=1参数以 ? 开始。
作用是：给服务器额外提供一些信息。
例如：
?id=1表示查看编号为 1 的文章。
多个参数之间使用 & 分隔：
?id=1&page=2&lang=zh-CN服务器收到请求后，就可以读取这些参数：
id = 1
page = 2
lang = zh-CN很多搜索页面就是利用参数工作的，例如：
?q=ChatGPT表示搜索 ChatGPT。
参数会随着 HTTP 请求一起发送给服务器，因此服务器能够读取并根据参数返回不同内容。
第六部分：锚点（Fragment）
#top实际上锚点不会发送给服务器。
浏览器请求网页时，请求的是：
https://www.851004721.xyz/blog/index.html?id=1服务器根本不知道后面还有：
#top网页下载完成以后，浏览器才会根据：
#top滚动到页面中对应的位置。
例如：
#chapter3跳到第三章。
#comments跳到评论区。
#footer跳到底部。
因此，锚点更多是浏览器内部定位页面内容的一种机制，而不是服务器处理请求的一部分。
把整个 URL 连起来理解
再来看一次这个地址：
https://www.851004721.xyz:443/blog/index.html?id=1#top浏览器的工作流程如下：
- 使用 HTTPS 协议建立安全连接。
- 查询 www.851004721.xyz 的 IP 地址。
- 连接服务器 443 端口。
- 请求 /blog/index.html。
- 把参数 id=1 一起发送给服务器。
- 收到网页后，再根据 #top 自动滚动到页面顶部对应的位置。
整个过程环环相扣，最终把你想看的内容准确展示出来。