一、这个技术是什么？
用户在地址栏输入网址后，并不是浏览器自己“变出”网页。浏览器需要找到目标服务器，发出请求，等待服务器处理，再把服务器返回的 HTML、CSS、JavaScript 和图片组合成页面。
浏览器与服务器的协作解决了两个问题：
- 用户如何请求远程资源。
- 服务器如何把数据和页面能力交付给用户。
可以先记住一句话：浏览器负责发起请求和呈现结果，服务器负责接收请求、处理业务和返回结果。
二、没有它之前发生了什么？
早期程序通常只能读取本地文件：
本地文件
↓
只能在当前设备打开
↓
不同用户无法共享实时数据
↓
浏览器与服务器形成请求和响应模型
网络协作出现后，浏览器不需要知道数据存在哪里，只需要通过统一协议请求资源。服务器也不需要知道用户使用什么设备，只要返回符合协议的结果。
三、核心概念
1. Client
Client 是发起这一次请求的一方。浏览器是常见 Client，但手机 App、Node.js 程序和测试脚本也可以是 Client。
2. Server
Server 是等待请求并提供数据或能力的一方。它可以返回网页、JSON、文件，也可以执行数据库查询。
3. Request 与 Response
Request 表示“我想要什么或想执行什么”，Response 表示“服务器处理后的结果是什么”。
4. 前端与后端边界
前端负责交互和展示，后端负责数据、权限和业务规则。真实项目中两者通过 API 或页面请求协作。
四、运行流程
五、面试复习
一句话回答
浏览器作为 Client 发起请求，服务器作为 Server 处理请求并返回响应，浏览器再把响应内容解析成用户看到的页面。
高频追问
- 浏览器和服务器是不是两台固定的机器？
- 一个 Node.js 程序能不能同时是 Client 和 Server？
- 页面为什么还会继续请求 CSS、JavaScript 和图片？
容易答错
不要把 Client 等同于个人电脑，也不要把 Server 等同于物理服务器。它们首先是一次通信中的角色。
六、项目展示
在知识库平台中，浏览器访问 Next.js 详情页时：
浏览器请求 /knowledge/http-web-server-basics
↓
Next.js 根据 slug 找到 Markdown
↓
解析 Frontmatter 和正文
↓
生成 HTML 页面
↓
浏览器显示知识内容
这个流程可以作为“从内容源到页面”的项目架构说明。