前端进阶之旅前端进阶之旅
基础篇
进阶篇
高频篇
精选篇
手写篇
面经篇
AI 篇
原理篇
每日一题
小程序题库
知识卡片
  • 场景篇按分类整理的大前端场景考点
  • 历年面经按年份追踪真实考点
  • 算法题库NEW在线编码即时判题
  • 专项自测100 题快速查漏
  • 前端基础
    • HTTP从报文一路讲到 HTTPS
    • 浏览器渲染、事件循环、进程
    • 计算机基础Linux、网络、操作系统
  • 进阶专项
    • 设计模式23 种模式怎么用
    • 前端系统进阶学习大型项目工程化
    • 前端综合文章长期沉淀的实践文
  • 工程与工具
    • Node学习指南从环境搭建到服务端
    • NPM工作流script、依赖与发布
    • Docker容器化部署上手
    • Canvas图形与动画实战
  • 路线与导图
    • 思维导图知识点全景图
    • 学习路线按图索骥不跑偏
  • 动态
    • 公众号动态公众号历史文章
    • 博客动态站长的技术博客
    • 开发者导航常用工具与文档站
  • AI 助手随时提问,即时解析
  • AI 模拟面试模拟真实面试 + 报告
  • AI 知识地图串起全站知识点
  • AI 定制路线按你的简历现排
AI 热点
旧版
基础篇
进阶篇
高频篇
精选篇
手写篇
面经篇
AI 篇
原理篇
每日一题
小程序题库
知识卡片
  • 场景篇按分类整理的大前端场景考点
  • 历年面经按年份追踪真实考点
  • 算法题库NEW在线编码即时判题
  • 专项自测100 题快速查漏
  • 前端基础
    • HTTP从报文一路讲到 HTTPS
    • 浏览器渲染、事件循环、进程
    • 计算机基础Linux、网络、操作系统
  • 进阶专项
    • 设计模式23 种模式怎么用
    • 前端系统进阶学习大型项目工程化
    • 前端综合文章长期沉淀的实践文
  • 工程与工具
    • Node学习指南从环境搭建到服务端
    • NPM工作流script、依赖与发布
    • Docker容器化部署上手
    • Canvas图形与动画实战
  • 路线与导图
    • 思维导图知识点全景图
    • 学习路线按图索骥不跑偏
  • 动态
    • 公众号动态公众号历史文章
    • 博客动态站长的技术博客
    • 开发者导航常用工具与文档站
  • AI 助手随时提问,即时解析
  • AI 模拟面试模拟真实面试 + 报告
  • AI 知识地图串起全站知识点
  • AI 定制路线按你的简历现排
AI 热点
旧版
  • HTTP

    • 基础篇

      • HTTP的前世今生
      • HTTP是什么
      • HTTP世界全览
      • HTTP分层
      • 键入网址到回车发生什么
      • HTTP报文是什么样子的
      • 理解请求方法
      • URI
      • 响应状态码
      • HTTP有哪些特点
      • HTTP优缺点
      • HTTP的实体数据
      • HTTP传输大文件
      • HTTP的连接管理
      • HTTP的重定向
      • HTTP的Cookie机制
      • HTTP的缓存控制
      • HTTP的代理服务
      • HTTP的缓存代理
    • 高级篇

    • 扩展篇

  • 浏览器相关

  • 计算机基础

# HTTP分层

30 秒速记

  • OSI 七层:物理、数据链路、网络、传输、会话、表示、应用;TCP 在第 4 层,HTTP 在第 7 层
  • TCP/IP 四层:链路层、网际层(IP)、传输层(TCP / UDP)、应用层(HTTP)
  • 映射:OSI 的会话、表示、应用三层合并成 TCP/IP 的应用层,物理层不单独算
  • 发送时自上而下逐层加头封装,接收时自下而上逐层拆,HTTP 报文里看不到端口和 IP
  • 口头说的「四层负载均衡」看 IP + 端口转发,「七层」能看 URL 和头部;TLS 夹在 TCP 和 HTTP 中间

日常说的「四层」「七层」用的是 OSI 编号:TCP 是第四层传输层,HTTP 是第七层应用层。 实际实现用的是 TCP/IP 四层模型,HTTP 也在最上面的应用层。分层的意思是每层只管自己的事,像寄快递:HTTP 写信的内容,TCP 负责保证信按顺序不丢地送到,IP 负责写地址找路,链路层负责实际搬运。发出去时一层层套信封,收到时一层层拆。工程里最常用的是区分四层和七层负载均衡:四层只看 IP 和端口,七层能按路径和头部分流。

  • 第一层:物理层,TCP/IP 里无对应;
  • 第二层:数据链路层,对应 TCP/IP 的链接层;
  • 第三层:网络层,对应 TCP/IP 的网际层;
  • 第四层:传输层,对应 TCP/IP 的传输层;
  • 第五、六、七层:统一对应到 TCP/IP 的应用层

总结

  • TCP/IP 分为四层,核心是二层的 IP 和三层的 TCP,HTTP 在第四层;
  • OSI 分为七层,基本对应 TCP/IP,TCP 在第四层,HTTP 在第七层;
  • OSI 可以映射到 TCP/IP,但这期间一、五、六层消失了;
  • 日常交流的时候我们通常使用 OSI 模型,用四层、七层等术语;
  • HTTP 利用 TCP/IP协议栈逐层打包再拆包,实现了数据传输,但下面的细节并不可见

有一个辨别四层和七层比较好的(但不是绝对的)小窍门,“两个凡是”:凡是由操作系统负责处理的就是四层或四层以下,否则,凡是需要由应用程序(也就是你自己写代码)负责处理的就是七层

原理拆解: 浏览器生成 HTTP 报文后,数据沿协议栈向下传递:传输层把字节流装入 TCP 段并加入端口、序号等信息;网际层再封装为 IP 数据包,写入源和目的地址;链路层最后形成以太网帧并交给物理介质。接收端按相反方向处理,依据以太网类型、IP 协议号和端口逐层分发,最终由应用解析 HTTP。每层只负责自己的寻址、传输或语义职责,因此更换链路介质通常不会改变应用报文。

最小验证: 输入是一段通过明文 HTTP/1.1 连接发送的请求,验证应用层报文只描述请求语义,而连接目标和可靠传输由下层承担。

GET /status HTTP/1.1
Host: example.com
User-Agent: layer-demo/1.0
Accept: application/json
Connection: close

HTTP/1.1 200 OK
Content-Type: application/json
Content-Length: 15
Connection: close

{"status":"ok"}
@前端进阶之旅: 代码已经复制到剪贴板

关键行 Host 标识应用层目标主机,Content-Type 说明实体格式;报文中没有 TCP 序号、IP 地址或网卡地址,因为这些字段位于更低层。预期应用获得状态码 200 和 JSON 实体。若使用 HTTPS,抓包仍能观察 TCP/IP 或其他承载协议,但普通位置只能看到加密后的 TLS 数据,不能直接读取上述明文。

边界与排查: “操作系统负责就是四层以下”只能帮助快速定位,不能当作严格分界:内核可能参与 TLS 卸载,用户态程序也能自行构造链路层数据包。工程验证可用浏览器网络面板检查 HTTP 语义,用抓包工具查看端口、地址及分段;若域名无法解析,应先检查应用请求之前的 DNS 环节,若握手失败则检查传输层连通性,而不是直接归因于 HTTP。

面试官追问

追问 1TCP 连接建好了,接口却一直报错,是不是说明七层没问题?
参考回答

反了。TCP 通只说明第四层能传字节,接口报错恰恰说明问题在七层:看状态码、请求路径、头部、请求体是否符合约定。连接都建不起来时才往下查端口和防火墙。

追问 2四层负载均衡和七层负载均衡怎么选?
参考回答

要按 URL 路径分流、按 Cookie 做会话保持、在网关统一做鉴权,必须七层,比如 Nginx;只要按 IP 和端口把流量分出去、追求性能和透传 TLS,用四层,比如 LVS。很多架构是四层在前扛流量、七层在后做路由。

追问 3HTTPS 接口抓包看不到 GET /status,是请求没发出去吗?
参考回答

不是。TLS 在 TCP 之上、HTTP 之下,抓包工具看到的是加密后的 TLS 记录,明文的请求行被包在里面。要看明文用浏览器 Network 面板,或者用 Charles / Fiddler 这类中间人代理装证书解密。

追问 4TLS 算第几层?
参考回答

不太好硬塞进某一层。它跑在 TCP 之上、给 HTTP 提供加密,按 OSI 常被归到表示层或会话层附近,按 TCP/IP 一般算在应用层里。面试时说清楚「它在 TCP 和 HTTP 之间」比纠结编号有用。

基础篇
进阶篇
高频篇
精选篇
手写篇
面经篇
AI 篇
原理篇
每日一题
小程序题库
知识卡片
  • 场景篇按分类整理的大前端场景考点
  • 历年面经按年份追踪真实考点
  • 算法题库NEW在线编码即时判题
  • 专项自测100 题快速查漏
  • 前端基础
    • HTTP从报文一路讲到 HTTPS
    • 浏览器渲染、事件循环、进程
    • 计算机基础Linux、网络、操作系统
  • 进阶专项
    • 设计模式23 种模式怎么用
    • 前端系统进阶学习大型项目工程化
    • 前端综合文章长期沉淀的实践文
  • 工程与工具
    • Node学习指南从环境搭建到服务端
    • NPM工作流script、依赖与发布
    • Docker容器化部署上手
    • Canvas图形与动画实战
  • 路线与导图
    • 思维导图知识点全景图
    • 学习路线按图索骥不跑偏
  • 动态
    • 公众号动态公众号历史文章
    • 博客动态站长的技术博客
    • 开发者导航常用工具与文档站
  • AI 助手随时提问,即时解析
  • AI 模拟面试模拟真实面试 + 报告
  • AI 知识地图串起全站知识点
  • AI 定制路线按你的简历现排
AI 热点
旧版
  • HTTP

    • 基础篇

      • HTTP的前世今生
      • HTTP是什么
      • HTTP世界全览
      • HTTP分层
      • 键入网址到回车发生什么
      • HTTP报文是什么样子的
      • 理解请求方法
      • URI
      • 响应状态码
      • HTTP有哪些特点
      • HTTP优缺点
      • HTTP的实体数据
      • HTTP传输大文件
      • HTTP的连接管理
      • HTTP的重定向
      • HTTP的Cookie机制
      • HTTP的缓存控制
      • HTTP的代理服务
      • HTTP的缓存代理
    • 高级篇

    • 扩展篇

  • 浏览器相关

  • 计算机基础

完整面试题地址:
作者:程序员poetry
扫码关注作者公众号:「前端进阶之旅」 每天分享技术干货
前端进阶之旅公众号二维码

HTTP分层|HTTP协议篇

# HTTP分层

30 秒速记

  • OSI 七层:物理、数据链路、网络、传输、会话、表示、应用;TCP 在第 4 层,HTTP 在第 7 层
  • TCP/IP 四层:链路层、网际层(IP)、传输层(TCP / UDP)、应用层(HTTP)
  • 映射:OSI 的会话、表示、应用三层合并成 TCP/IP 的应用层,物理层不单独算
  • 发送时自上而下逐层加头封装,接收时自下而上逐层拆,HTTP 报文里看不到端口和 IP
  • 口头说的「四层负载均衡」看 IP + 端口转发,「七层」能看 URL 和头部;TLS 夹在 TCP 和 HTTP 中间

日常说的「四层」「七层」用的是 OSI 编号:TCP 是第四层传输层,HTTP 是第七层应用层。 实际实现用的是 TCP/IP 四层模型,HTTP 也在最上面的应用层。分层的意思是每层只管自己的事,像寄快递:HTTP 写信的内容,TCP 负责保证信按顺序不丢地送到,IP 负责写地址找路,链路层负责实际搬运。发出去时一层层套信封,收到时一层层拆。工程里最常用的是区分四层和七层负载均衡:四层只看 IP 和端口,七层能按路径和头部分流。

  • 第一层:物理层,TCP/IP 里无对应;
  • 第二层:数据链路层,对应 TCP/IP 的链接层;
  • 第三层:网络层,对应 TCP/IP 的网际层;
  • 第四层:传输层,对应 TCP/IP 的传输层;
  • 第五、六、七层:统一对应到 TCP/IP 的应用层

总结

  • TCP/IP 分为四层,核心是二层的 IP 和三层的 TCP,HTTP 在第四层;
  • OSI 分为七层,基本对应 TCP/IP,TCP 在第四层,HTTP 在第七层;
  • OSI 可以映射到 TCP/IP,但这期间一、五、六层消失了;
  • 日常交流的时候我们通常使用 OSI 模型,用四层、七层等术语;
  • HTTP 利用 TCP/IP协议栈逐层打包再拆包,实现了数据传输,但下面的细节并不可见

有一个辨别四层和七层比较好的(但不是绝对的)小窍门,“两个凡是”:凡是由操作系统负责处理的就是四层或四层以下,否则,凡是需要由应用程序(也就是你自己写代码)负责处理的就是七层

原理拆解: 浏览器生成 HTTP 报文后,数据沿协议栈向下传递:传输层把字节流装入 TCP 段并加入端口、序号等信息;网际层再封装为 IP 数据包,写入源和目的地址;链路层最后形成以太网帧并交给物理介质。接收端按相反方向处理,依据以太网类型、IP 协议号和端口逐层分发,最终由应用解析 HTTP。每层只负责自己的寻址、传输或语义职责,因此更换链路介质通常不会改变应用报文。

最小验证: 输入是一段通过明文 HTTP/1.1 连接发送的请求,验证应用层报文只描述请求语义,而连接目标和可靠传输由下层承担。

GET /status HTTP/1.1
Host: example.com
User-Agent: layer-demo/1.0
Accept: application/json
Connection: close

HTTP/1.1 200 OK
Content-Type: application/json
Content-Length: 15
Connection: close

{"status":"ok"}
@前端进阶之旅: 代码已经复制到剪贴板

关键行 Host 标识应用层目标主机,Content-Type 说明实体格式;报文中没有 TCP 序号、IP 地址或网卡地址,因为这些字段位于更低层。预期应用获得状态码 200 和 JSON 实体。若使用 HTTPS,抓包仍能观察 TCP/IP 或其他承载协议,但普通位置只能看到加密后的 TLS 数据,不能直接读取上述明文。

边界与排查: “操作系统负责就是四层以下”只能帮助快速定位,不能当作严格分界:内核可能参与 TLS 卸载,用户态程序也能自行构造链路层数据包。工程验证可用浏览器网络面板检查 HTTP 语义,用抓包工具查看端口、地址及分段;若域名无法解析,应先检查应用请求之前的 DNS 环节,若握手失败则检查传输层连通性,而不是直接归因于 HTTP。

面试官追问

追问 1TCP 连接建好了,接口却一直报错,是不是说明七层没问题?
参考回答

反了。TCP 通只说明第四层能传字节,接口报错恰恰说明问题在七层:看状态码、请求路径、头部、请求体是否符合约定。连接都建不起来时才往下查端口和防火墙。

追问 2四层负载均衡和七层负载均衡怎么选?
参考回答

要按 URL 路径分流、按 Cookie 做会话保持、在网关统一做鉴权,必须七层,比如 Nginx;只要按 IP 和端口把流量分出去、追求性能和透传 TLS,用四层,比如 LVS。很多架构是四层在前扛流量、七层在后做路由。

追问 3HTTPS 接口抓包看不到 GET /status,是请求没发出去吗?
参考回答

不是。TLS 在 TCP 之上、HTTP 之下,抓包工具看到的是加密后的 TLS 记录,明文的请求行被包在里面。要看明文用浏览器 Network 面板,或者用 Charles / Fiddler 这类中间人代理装证书解密。

追问 4TLS 算第几层?
参考回答

不太好硬塞进某一层。它跑在 TCP 之上、给 HTTP 提供加密,按 OSI 常被归到表示层或会话层附近,按 TCP/IP 一般算在应用层里。面试时说清楚「它在 TCP 和 HTTP 之间」比纠结编号有用。

← HTTP世界全览键入网址到回车发生什么 →

fe