本文详细讲解了前端开发所需的网络基础知识，涵盖 OSI 七层模型中的物理层、数据链路层、网络层、传输层及应用层。重点阐述了 MAC 地址与 IP 地址的区别、子网掩码的作用、ARP 协议原理，以及 TCP 与 UDP 协议的差异与应用场景。通过三次握手、四次挥手等机制分析，帮助开发者理解网络通信的核心流程，并补充了 DNS 与 HTTP 基础及常见端口知识，为前端性能优化和调试打下基础。
在 OSI 七层参考模型中，每一层都有特定的功能。理解这些层级对于前端开发者排查网络问题、优化性能至关重要。
我们从最底层开始。电脑要组网，第一件事是建立物理连接，可以使用光缆、电缆、双绞线或无线电波等方式。这一层被称为'物理层'，它规定了网络的电气特性，主要负责传送 0 和 1 的电信号。
单纯的 0 和 1 没有任何意义，必须规定解读方式：多少个电信号算一组？每个信号位有何意义？这就是'数据链路层'的功能，它在'物理层'的上方，确定了 0 和 1 的分组方式。
数据链路层有三个主要目的：
ARP 叫做地址解析协议，是用 IP 地址换 MAC 地址的一种协议。RARP 则叫做逆地址解析协议。数据链路层的协议很多，最常用的以太网（Ethernet）协议，还有令牌环、FDDI、PPP 协议（ADSL 宽带）以及 loopback 协议等。
早期的时候，每家公司都有自己的电信号分组方式。逐渐地，一种叫做'以太网'（Ethernet）的协议占据了主导地位。
以太网规定，一组电信号构成一个数据包，叫做'帧'（Frame）。每一帧分成两个部分：标头（Head）和数据（Data）。
[图片：以太网帧结构图]
'标头'包含数据包的一些说明项，比如发送者、接受者、数据类型等等；'数据'则是数据包的具体内容。
'标头'的长度固定为 18 字节。'数据'的长度最短为 46 字节，最长为 1500 字节。因此，整个'帧'最短为 64 字节，最长为 1518 字节。如果数据很长，就必须分割成多个帧进行发送。
上面提到，以太网数据包的'标头'包含了发送者和接受者的信息。那么，发送者和接受者是如何标识呢？
以太网规定，连入网络的所有设备都必须具有'网卡'接口。数据包必须是从一块网卡传送到另一块网卡。网卡的地址就是数据包的发送地址和接收地址，这叫做 MAC 地址。
MAC（Medium Access Control）地址是在 IEEE802 标准中定义的规范。凡是符合 IEEE802 标准的网卡都必须拥有一个 MAC 地址。
每块网卡出厂的时候都有一个全世界独一无二的 MAC 地址，长度是 48 个二进制位，通常用 12 个十六进制数表示。
前 6 个十六进制数是厂商编号，后 6 个是该厂商的网卡流水号。有了 MAC 地址，就可以定位网卡和数据包的路径了。
注意：不是任意一个网卡都拥有 MAC 地址。比如 SDH 网络接口卡就没有 MAC 地址，当然也不遵循 IEEE802 标准。
MAC 地址我们称为物理地址或者硬件地址。在生产网卡时，我们就会在每个网卡的 ROM（Read Only Memory）中烧录 BIA 地址（Burned-In Address，固化地址）。这个烧录的 BIA 地址是不能被更改的，只能被读取出来。MAC 地址工作在第二层数据链路层。长度是 48 比特（6 字节），由 16 进制的数字组成，分为前 24 位和后 24 位：
BIA 只是 MAC 地址的一种，更准确说，MAC 地址是一种单播 MAC 地址。MAC 地址一共分三类：单播 MAC 地址、组播 MAC 地址、广播 MAC 地址。
第一个字节的倒数第二位是 1 的 MAC 地址，这一位表示 MAC 地址是全球唯一地址还是本地地址，0 表示全球唯一地址，1 表示本地唯一地址。这一位也叫 G/L 位。
对于网络设备上固化的 MAC 地址，因为它唯一标识这个设备，所以只能是单播地址，也就是 MAC 帧里面的 Source 地址第 48 位只能为 0。
MAC 地址是有 48bit。为了方便，通常采用十六进制数的方式标识一个 MAC 地址。每两个十六进制数 1 组（即一个字节）。一共六组，中间使用'-'或者'：'来连接。也可以使用每四位十六进制一组。
[图片：MAC 地址格式示例]
定义地址只是第一步，后面还有更多的步骤：
首先：一块网卡怎么会知道另一块网卡的 MAC 地址？回答是有一种 ARP 协议，可以解决这个问题。这个留到后面介绍，这里只需要知道，以太网数据包必须知道接收方的 MAC 地址，然后才能发送。
其次：就算有了 MAC 地址，系统怎样才能把数据包准确送到接收方？回答是以太网采用了一种很'原始'的方式，它不是把数据包准确送到接收方，而是向本网络内所有计算机发送，让每台计算机自己判断，是否为接收方。
上图中，1 号计算机向 2 号计算机发送一个数据包，同一个子网络的 3 号、4 号、5 号计算机都会收到这个包。它们读取这个包的'标头'，找到接收方的 MAC 地址，然后与自身的 MAC 地址相比较，如果两者相同，就接受这个包，做进一步处理，否则就丢弃这个包。这种发送方式就叫做'广播'（broadcasting）。
有了数据包的定义、网卡的 MAC 地址、广播的发送方式，'数据链路层'就可以在多台计算机之间传送数据了。
以太网协议依靠 MAC 地址发送数据。理论上，单单依靠 MAC 地址，上海的网卡就可以找到洛杉矶的网卡了，技术上是可以实现的。
但是，这样做有一个重大的缺点。以太网采用广播方式发送数据包，所有成员人手一'包'，不仅效率低，而且局限在发送者所在的子网络。也就是说，如果两台计算机不在同一个子网络，广播是传不过去的。这种设计是合理的，否则互联网上每一台计算机都会收到所有包，那会引起灾难。
互联网是无数子网络共同组成的一个巨型网络，很难想象上海和洛杉矶的电脑会在同一个子网络，这几乎是不可能的。
因此，必须找到一种方法，能够区分哪些 MAC 地址属于同一个子网络，哪些不是。如果是同一个子网络，就采用广播方式发送，否则就采用'路由'方式发送。（'路由'的意思，就是指如何向不同的子网络分发数据包，这是一个很大的主题，本文不涉及。）遗憾的是，MAC 地址本身无法做到这一点。它只与厂商有关，与所处网络无关。
这就导致了'网络层'的诞生。它的作用是引进一套新的地址，使得我们能够区分不同的计算机是否属于同一个子网络。这套地址就叫做'网络地址'，简称'网址'。
于是，'网络层'出现以后，每台计算机有了两种地址，一种是 MAC 地址，另一种是网络地址。两种地址之间没有任何联系，MAC 地址是绑定在网卡上的，网络地址则是管理员分配的，它们只是随机组合在一起。
网络地址帮助我们确定计算机所在的子网络，MAC 地址则将数据包送到该子网络中的目标网卡。因此，从逻辑上可以推断，必定是先处理网络地址，然后再处理 MAC 地址。
规定网络地址的协议，叫做 IP 协议。它所定义的地址，就被称为 IP 地址。目前，广泛采用的是 IP 协议第四版，简称 IPv4。
IPv4 这个版本规定，网络地址由 32 个二进制位组成。
习惯上，我们用分成四段的十进制数表示 IP 地址，从 0.0.0.0 一直到 255.255.255.255。
互联网上的每一台计算机，都会分配到一个 IP 地址。这个地址分成两个部分，前一部分代表网络，后一部分代表主机。比如，IP 地址 172.16.254.1，这是一个 32 位的地址，假定它的网络部分是前 24 位（172.16.254），那么主机部分就是后 8 位（最后的那个 1）。处于同一个子网络的电脑，它们 IP 地址的网络部分必定是相同的，也就是说 172.16.254.2 应该与 172.16.254.1 处在同一个子网络。
但是，问题在于单单从 IP 地址，我们无法判断网络部分。还是以 172.16.254.1 为例，它的网络部分，到底是前 24 位，还是前 16 位，甚至前 28 位，从 IP 地址上是看不出来的。
那么，怎样才能从 IP 地址，判断两台计算机是否属于同一个子网络呢？这就要用到另一个参数'子网掩码'（subnet mask）。
所谓'子网掩码'，就是表示子网络特征的一个参数。它在形式上等同于 IP 地址，也是一个 32 位二进制数字，它的网络部分全部为 1，主机部分全部为 0。比如，IP 地址 172.16.254.1，如果已知网络部分是前 24 位，主机部分是后 8 位，那么子网络掩码就是 11111111.11111111.11111111.00000000，写成十进制就是 255.255.255.0。
知道'子网掩码'，我们就能判断，任意两个 IP 地址是否处在同一个子网络。方法是将两个 IP 地址与子网掩码分别进行 AND 运算（两个数位都为 1，运算结果为 1，否则为 0），然后比较结果是否相同，如果是的话，就表明它们在同一个子网络中，否则就不是。
比如，已知 IP 地址 172.16.254.1 和 172.16.254.233 的子网掩码都是 255.255.255.0，请问它们是否在同一个子网络？两者与子网掩码分别进行 AND 运算，结果都是 172.16.254.0，因此它们在同一个子网络。
总结一下，IP 协议的作用主要有两个，一个是为每一台计算机分配 IP 地址，另一个是确定哪些地址在同一个子网络。
根据 IP 协议发送的数据，就叫做 IP 数据包。不难想象，其中必定包括 IP 地址信息。但是前面说过，以太网数据包只包含 MAC 地址，并没有 IP 地址的栏位。那么是否需要修改数据定义，再添加一个栏位呢？
回答是不需要，我们可以把 IP 数据包直接放进以太网数据包的'数据'部分，因此完全不用修改以太网的规格。这就是互联网分层结构的好处：上层的变动完全不涉及下层的结构。
具体来说，IP 数据包也分为'标头'和'数据'两个部分：
[图片：IP 数据包结构图]
'标头'部分主要包括版本、长度、IP 地址等信息，'数据'部分则是 IP 数据包的具体内容。它放进以太网数据包后，以太网数据包就变成了下面这样：
[图片：IP 包封装示意图]
IP 数据包的'标头'部分的长度为 20 到 60 字节，整个数据包的总长度最大为 65,535 字节。因此，理论上，一个 IP 数据包的'数据'部分，最长为 65,515 字节。前面说过，以太网数据包的'数据'部分，最长只有 1500 字节。因此，如果 IP 数据包超过了 1500 字节，它就需要分割成几个以太网数据包，分开发送了。
关于'网络层'，还有最后一点需要说明。因为 IP 数据包是放在以太网数据包里发送的，所以我们必须同时知道两个地址，一个是对方的 MAC 地址，另一个是对方的 IP 地址。通常情况下，对方的 IP 地址是已知的（后文会解释），但是我们不知道它的 MAC 地址。
所以，我们需要一种机制，能够从 IP 地址得到 MAC 地址。
这里又可以分成两种情况：
FF : FF : FF : FF : FF : FF，表示这是一个'广播'地址。它所在子网络的每一台主机，都会收到这个数据包，从中取出 IP 地址，与自身的 IP 地址进行比较。如果两者相同，都做出回复，向对方报告自己的 MAC 地址，否则就丢弃这个包。总之，有了 ARP 协议之后，我们就可以得到同一个子网络内的主机 MAC 地址，可以把数据包发送到任意一台主机之上了。
ARP(Address Resolution Protocol) 是地址解析协议，ARP 是一种将 IP 地址转化成物理地址的协议。从 IP 地址到物理地址的映射有两种方式：表格方式和非表格方式。ARP 具体说来就是将网络层（IP 层，也就是相当于 OSI 的第三层）地址解析为数据连接层（MAC 层，也就是相当于 OSI 的第二层）的 MAC 地址。ARP 协议是通过 IP 地址来获得 MAC 地址的。
因此，本地高速缓存的这个 ARP 表是本地网络流通的基础，而且这个缓存是动态的。ARP 表：为了回忆通信的速度，最近常用的 MAC 地址与 IP 的转换不用依靠交换机来进行，而是在本机上建立一个用来记录常用主机 IP－MAC 映射表，即 ARP 表。
有了 MAC 地址和 IP 地址，我们已经可以在互联网上任意两台主机上建立通信。
接下来的问题是，同一台主机上有许多程序都需要用到网络，比如，你一边浏览网页，一边与朋友在线聊天。当一个数据包从互联网上发来的时候，你怎么知道，它是表示网页的内容，还是表示在线聊天的内容？
也就是说，我们还需要一个参数，表示这个数据包到底供哪个程序（进程）使用。这个参数就叫做'端口'（port），它其实是每一个使用网卡的程序的编号。每个数据包都发到主机的特定端口，所以不同的程序就能取到自己所需要的数据。
'端口'是 0 到 65535 之间的一个整数，正好 16 个二进制位。0 到 1023 的端口被系统占用，用户只能选用大于 1023 的端口。不管是浏览网页还是在线聊天，应用程序会随机选用一个端口，然后与服务器的相应端口联系。
'传输层'的功能，就是建立'端口到端口'的通信。相比之下，'网络层'的功能是建立'主机到主机'的通信。只要确定主机和端口，我们就能实现程序之间的交流。因此，Unix 系统就把主机 + 端口，叫做'套接字'（socket）。有了它，就可以进行网络应用程序开发了。
现在，我们必须在数据包中加入端口信息，这就需要新的协议。最简单的实现叫做 UDP 协议，它的格式几乎就是在数据前面，加上端口号。
UDP 数据包，也是由'标头'和'数据'两部分组成：
[图片：UDP 数据包结构]
'标头'部分主要定义了发出端口和接收端口，'数据'部分就是具体的内容。然后，把整个 UDP 数据包放入 IP 数据包的'数据'部分，而前面说过，IP 数据包又是放在以太网数据包之中的，所以整个以太网数据包现在变成了下面这样：
[图片：UDP 封装示意图]
UDP 数据包非常简单，'标头'部分一共只有 8 个字节，总长度不超过 65,535 字节，正好放进一个 IP 数据包。
UDP 协议的优点是比较简单，容易实现，但是缺点是可靠性较差，一旦数据包发出，无法知道对方是否收到。为了解决这个问题，提高网络可靠性，TCP 协议就诞生了。这个协议非常复杂，但可以近似认为，它就是有确认机制的 UDP 协议，每发出一个数据包都要求确认。如果有一个数据包遗失，就收不到确认，发出方就知道有必要重发这个数据包了。
因此，TCP 协议能够确保数据不会遗失。它的缺点是过程复杂、实现困难、消耗较多的资源。
TCP 数据包和 UDP 数据包一样，都是内嵌在 IP 数据包的'数据'部分。TCP 数据包没有长度限制，理论上可以无限长，但是为了保证网络的效率，通常 TCP 数据包的长度不会超过 IP 数据包的长度，以确保单个 TCP 数据包不必再分割。
说到 TCP 建立连接，相信大多数人脑海里肯定可以浮现出一个词，没错就是--'三次握手'。TCP 通过'三次握手'来建立连接，再通过'四次挥手'断开一个连接。在每次挥手中 TCP 做了哪些操作呢？流程如下图所示（TCP 的三次握手和四次挥手）：
[图片：TCP 三次握手四次挥手流程图]
上图就从客户端和服务端的角度，清楚的展示了 TCP 的三次握手和四次挥手。可以看到，当 TCP 试图建立连接时，三次握手指的是客户端主动触发了两次，服务端触发了一次。
我们可以先明确一下 TCP 建立连接并且初始化的目标是什么呢？
所以三次握手的次序是这样子的：
其中的 2、3 步骤可以简化为一步，也就是说将 ACK 确认包和 SYN 序列化包一同发送给 Client 端。到此我们就比较简单的解释了 TCP 建立连接的'三次握手'。
关于 TCP、UDP 之间数据发送的差异，可以体现二者最大的不同之处：
那么每次 UDP 发送的数据报大小由哪些因素共同决定呢？
先来看第一个因素，UDP 本身协议的报文长度为 2^16 - 1，UDP 包头占 8 个字节，IP 协议本身封装后包头占 20 个字节，所以最终长度为：2^16 - 1 - 20 - 8 = 65507 字节。
只看第一个因素有点理想化了，因为 UDP 属于不可靠协议，我们应该尽量避免在传输过程中，数据包被分割。所以这里有一个非常重要的概念 MTU -- 也就是最大传输单元。
在 Internet 下 MTU 的值为 576 字节，所以在 internet 下使用 UDP 协议，每个数据报最大的字节数为：576 - 20 - 8 = 548。
我们再来谈谈数据的有序性。
其实大家都知道 TCP 本身是可靠的协议，而 UDP 是不可靠的协议。
所以来研究下，什么情况会导致 UDP 丢包：
在文章最后的一部分，聊聊 TCP、UDP 使用场景。
先来说 UDP 的吧，有很多人都会觉得 UDP 与 TCP 相比，在性能速度上是占优势的。因为 UDP 并不用保持一个持续的连接，也不需要对收发包进行确认。但事实上经过这么多年的发展 TCP 已经拥有足够多的算法和优化，在网络状态不错的情况下，TCP 的整体性能是优于 UDP 的。
那在什么时候我们非用 UDP 不可呢？
以上我们说了 UDP 的使用场景，在此之外的其他情况，使用 TCP 准没错。
应用程序收到'传输层'的数据，接下来就要进行解读。由于互联网是开放架构，数据来源五花八门，必须事先规定好格式，否则根本无法解读。'应用层'的作用，就是规定应用程序的数据格式。
举例来说，TCP 协议可以为各种各样的程序传递数据，比如 Email、WWW、FTP 等等。那么，必须有不同协议规定电子邮件、网页、FTP 数据的格式，这些应用程序协议就构成了'应用层'。这是最高的一层，直接面对用户。它的数据就放在 TCP 数据包的'数据'部分。
因此，现在的以太网的数据包就变成下面这样：
[图片：完整协议栈数据包结构]
对于前端开发者而言，除了上述底层协议，应用层的 DNS 和 HTTP 更是日常接触最多的。
| 端口 | 协议 | 说明 |
|---|---|---|
| 80 | HTTP | 默认 Web 服务端口 |
| 443 | HTTPS | 加密 Web 服务端口 |
| 21 | FTP | 文件传输协议 |
| 22 | SSH | 安全外壳协议 |
| 3306 | MySQL | 数据库服务 |
| 8080 | HTTP Alt | 备用 Web 服务端口 |
发送这个包，需要知道两个地址：
有了这两个地址，数据包才能准确送到接收者手中。但是，前面说过，MAC 地址有局限性，如果两台电脑不在同一个子网络，就无法知道对方的 MAC 地址，必须通过网关（gateway）转发。
[图片：跨子网通信示意图]
上图中，1 号电脑要向 4 号电脑发送一个数据包。它先判断 4 号电脑是否在同一个子网络，结果发现不是（后文介绍判断方法），于是就把这个数据包发到网关 A。网关 A 通过路由协议，发现 4 号电脑位于子网络 B，又把数据包发给网关 B，网关 B 再转发到 4 号电脑。
1 号电脑把数据包发到网关 A，必须知道网关 A 的 MAC 地址。所以，数据包的目标地址，实际上分成两种情况：
| 场景 | 数据包地址 |
|---|---|
| 同一个子网络 | 对方的 MAC 地址，对方的 IP 地址 |
| 非同一个子网络 | 网关的 MAC 地址，对方的 IP 地址 |
发送数据包之前，电脑必须判断对方是否在同一个子网络，然后选择相应的 MAC 地址。
注：本文旨在梳理网络基础知识，帮助前端开发者建立完整的知识体系。后续章节将深入探讨 HTTP 细节及浏览器网络机制。
微信公众号「极客日志」，在微信中扫描左侧二维码关注。展示文案：极客日志 zeeklog
使用加密算法（如AES、TripleDES、Rabbit或RC4）加密和解密文本明文。 在线工具，加密/解密文本在线工具，online
将字符串编码和解码为其 Base64 格式表示形式即可。 在线工具，Base64 字符串编码/解码在线工具，online
将字符串、文件或图像转换为其 Base64 表示形式。 在线工具，Base64 文件转换器在线工具，online
将 Markdown（GFM）转为 HTML 片段，浏览器内 marked 解析；与 HTML转Markdown 互为补充。 在线工具，Markdown转HTML在线工具，online
将 HTML 片段转为 GitHub Flavored Markdown，支持标题、列表、链接、代码块与表格等；浏览器内处理，可链接预填。 在线工具，HTML转Markdown在线工具，online
通过删除不必要的空白来缩小和压缩JSON。 在线工具，JSON 压缩在线工具，online