test-repo/docs/zh-cn/appendix/1-computer-fundamentals/power-on-to-web.md

从按下电源到访问网站发生了什么

::: tip 前言 你有没有想过，当你按下电脑电源键，到最终在浏览器中看到网页，这中间到底发生了什么？

这个过程涉及硬件启动、操作系统加载、网络通信等多个环节。理解这个过程，能帮助你建立对计算机系统的整体认知，也是成为全栈工程师的必经之路。 :::

你会学到什么？

• 电脑从通电到显示桌面的完整过程
• 操作系统是如何启动的
• 浏览器是如何工作的
• 当你访问一个 URL 时，网络请求是如何完成的

---

1. 按下电源：硬件的觉醒

1.1 电源启动

当你按下电源键，电源单元（PSU） 开始工作，把交流电（220V）转换成直流电（12V、5V、3.3V 等），为各个硬件部件供电。

电源按钮 → 电源单元(PSU) → 直流电输出 → 供给主板各部件

1.2 主板芯片组唤醒

电源稳定后，主板芯片组开始工作，它就像电脑的"总调度员"，负责协调各个硬件部件。

1.3 CPU 复位

CPU 接收到复位信号后，把内部所有寄存器和缓存清零，从一个预设的地址开始执行指令。这个地址通常指向 BIOS/UEFI 芯片。

---

2. BIOS/UEFI：硬件的自检

2.1 什么是 BIOS/UEFI？

BIOS（Basic Input/Output System） 是电脑启动后第一个运行的程序，存储在主板的一个只读芯片中。

UEFI（Unified Extensible Firmware Interface） 是 BIOS 的升级版，更安全、更现代。现在的电脑大多使用 UEFI。

2.2 BIOS/UEFI 做了什么？

1. 硬件自检（POST）：检查内存、显卡、键盘等部件是否正常
2. 初始化硬件：设置硬件工作模式
3. 启动顺序：按照设定顺序，尝试从硬盘/U 盘/网络启动

BIOS/UEFI 工作流程：
┌─────────────────────────────────────┐
│  1. 硬件自检 (POST)                 │
│     - 检查内存是否正常              │
│     - 检查显卡是否正常              │
│     - 检查键盘/鼠标是否正常         │
├─────────────────────────────────────┤
│  2. 初始化硬件                      │
│     - 设置硬件工作模式              │
│     - 配置中断向量表                │
├─────────────────────────────────────┤
│  3. 寻找启动设备                    │
│     - 按启动顺序查找可启动设备      │
│     - 读取启动扇区                  │
└─────────────────────────────────────┘

如果发现问题，主板会发出蜂鸣声（不同次数代表不同错误）。

2.3 启动顺序

BIOS/UEFI 会按照设定的启动顺序查找启动设备：

1. 硬盘（最常见）
2. U 盘/光盘（重装系统时用）
3. 网络（ PXE 启动，企业批量部署用）

找到第一个可启动设备后，读取它的启动扇区（Boot Sector），把控制权交给操作系统。

---

3. 操作系统启动：从内核到桌面

3.1 什么是操作系统？

操作系统（Operating System，简称 OS） 是管理计算机硬件和软件资源的程序集合。它就像一个"大管家"，帮我们管理内存、CPU、文件等资源，让我们不需要直接和硬件打交道。

常见的操作系统：

操作系统	特点	典型设备
Windows	生态丰富，兼容性好	桌面电脑、笔记本
macOS	苹果生态，流畅稳定	Mac 电脑
Linux	开源免费，服务器首选	服务器、嵌入式设备
Android	移动端 Linux	手机、平板
iOS	苹果移动端	iPhone、iPad

3.2 操作系统的启动过程

当你从硬盘启动时，操作系统的启动过程如下：

第一步：引导程序（Bootloader）

硬盘的第一个扇区存放着引导程序（Bootloader），它的任务是把操作系统内核加载到内存中。

• Windows：Bootloader 叫 bootmgr
• Linux：常见的引导程序有 GRUB、rEFInd 等

引导程序工作流程：
┌─────────────────────────────────────┐
│  1. 读取硬盘分区表                  │
│  2. 找到操作系统分区                 │
│  3. 加载操作系统内核到内存           │
│  4. 跳转到内核入口点                 │
└─────────────────────────────────────┘

第二步：内核加载（Kernel）

操作系统内核（Kernel） 是操作系统的核心，负责管理内存、CPU、进程等核心功能。

内核的主要功能：
┌─────────────────────────────────────┐
│  • 进程管理     - 创建/调度进程     │
│  • 内存管理     - 分配/回收内存     │
│  • 文件系统     - 管理文件存储      │
│  • 设备驱动     - 控制硬件设备      │
│  • 网络通信     - 处理网络协议      │
└─────────────────────────────────────┘

第三步：系统服务启动

内核加载后，会启动各种系统服务：

• Windows 服务：更新服务、安全中心、打印机服务
• Linux 服务：SSH 服务、网络服务、图形界面（GNOME、KDE）

Windows 启动过程：
BIOS → MBR → bootmgr → winload.exe → ntoskrnl.exe → 系统服务 → 桌面

Linux 启动过程：
BIOS → GRUB → vmlinuz (内核) → systemd → 系统服务 → 桌面环境

第四步：显示桌面

最后，操作系统启动图形界面（GUI），显示桌面：

• Windows：explorer.exe（资源管理器）显示桌面
• Linux：GNOME、KDE、XFCE 等桌面环境
• macOS：Finder 显示桌面

桌面出现的过程：
┌─────────────────────────────────────┐
│  1. 显卡驱动加载                    │
│  2. 显示服务器启动                  │
│     (Windows: Desktop Window Manager)│
│     (Linux: X Server / Wayland)    │
│  3. 桌面环境启动                    │
│  4. 显示桌面背景和图标              │
└─────────────────────────────────────┘

---

4. 打开浏览器：应用程序的启动

4.1 应用程序的启动过程

当你双击浏览器图标时，操作系统会：

1. 查找可执行文件：根据文件关联，找到浏览器的 .exe（Windows）或可执行文件
2. 创建进程：为浏览器创建一个新的进程
3. 加载程序：把浏览器的代码从硬盘加载到内存
4. 初始化：启动浏览器的主线程、渲染引擎、网络引擎等

浏览器启动过程：
┌─────────────────────────────────────┐
│  1. 双击图标                        │
│  2. 操作系统查找浏览器可执行文件     │
│  3. 创建浏览器进程                  │
│  4. 加载浏览器代码到内存             │
│  5. 初始化各模块（渲染、网络、JS）   │
│  6. 显示浏览器窗口                   │
└─────────────────────────────────────┘

4.2 浏览器的主要组成部分

现代浏览器是一个复杂的"操作系统"，主要由以下部分组成：

模块	功能
用户界面	地址栏、标签页、书签等
浏览器引擎	协调 UI 和渲染引擎
渲染引擎	解析 HTML/CSS，显示网页
JavaScript 引擎	执行 JavaScript 代码
网络模块	发送 HTTP 请求
UI 后端	绘制基础 UI 组件
数据存储	Cookie、LocalStorage 等

---

5. 访问 URL：网络请求的全过程

5.1 什么是 URL？

URL（Uniform Resource Locator） 是资源的地址，就像生活中的地址一样，用来定位互联网上的资源。

URL 的结构：
┌─────────────────────────────────────────────────────────┐
│  https://  │  www.example.com  │  /path/to/page  │ ?query=1 │
│    协议    │       域名        │     路径       │   查询   │
└─────────────────────────────────────────────────────────┘

• 协议（Protocol）：用什么方式访问（http、https、ftp 等）
• 域名（Domain）：服务器的地址
• 路径（Path）：资源在服务器上的位置
• 查询（Query）：额外的参数

5.2 访问 URL 的完整过程

当你访问 https://www.example.com 时，发生了这些事情：

第一步：URL 解析

浏览器首先解析 URL，提取出协议、域名、路径等信息。

URL 解析过程：
https://www.example.com/index.html
  ↓
协议: https
域名: www.example.com
路径: /index.html

第二步：DNS 解析

计算机通过网络访问服务器，但网络用的是 IP 地址（如 93.184.216.34），而不是域名。所以需要把域名转换成 IP 地址，这个过程叫 DNS 解析。

DNS 解析流程：
┌─────────────────────────────────────────────────────────┐
│  浏览器缓存 → hosts 文件 → 本地 DNS 缓存 → DNS 服务器  │
└─────────────────────────────────────────────────────────┘

实际过程：
1. 浏览器检查缓存（最近访问过吗？）
2. 操作系统检查 DNS 缓存
3. 向 DNS 服务器发送查询请求
4. DNS 服务器返回 IP 地址

第三步：建立 TCP 连接

拿到 IP 地址后，浏览器要与服务器建立 TCP 连接。TCP 是传输层协议，保证数据可靠传输。

TCP 三次握手：
┌─────────────────────────────────────────────────────────┐
│  客户端 → 服务器：SYN（同步请求）                       │
│  服务器 → 客户端：SYN-ACK（确认并同步）                 │
│  客户端 → 服务器：ACK（确认）                           │
│                        ↓                                │
│  连接建立完成！                                         │
└─────────────────────────────────────────────────────────┘

如果是 HTTPS，还需要进行 TLS/SSL 握手，建立加密通道。

第四步：发送 HTTP 请求

连接建立后，浏览器向服务器发送 HTTP 请求：

HTTP 请求格式：
┌─────────────────────────────────────────────────────────┐
│  GET /index.html HTTP/1.1                              │
│  Host: www.example.com                                 │
│  User-Agent: Mozilla/5.0...                             │
│  Accept: text/html                                     │
│                                                         │
│  （空行）                                               │
└─────────────────────────────────────────────────────────┘

常见的 HTTP 方法：

方法	含义	用途
GET	获取资源	浏览网页
POST	提交数据	登录、提交表单
PUT	上传资源	文件上传
DELETE	删除资源	删除数据

第五步：服务器处理请求

服务器（通常是 Web 服务器 如 Nginx、Apache）收到请求后：

1. 解析请求：理解客户端想要什么
2. 处理业务：调用后端程序（如 Python、Node.js、Java）
3. 查询数据库：获取需要的数据
4. 生成响应：把数据组装成 HTML、JSON 等格式

服务器处理流程：
┌─────────────────────────────────────────────────────────┐
│  1. Web 服务器接收请求 (Nginx/Apache)                  │
│  2. 根据路径找到对应的处理程序                          │
│  3. 执行后端代码 (API、业务逻辑)                        │
│  4. 如需查询数据库，获取数据                           │
│  5. 组装响应 (HTML/JSON/CSS/JS)                        │
│  6. 返回 HTTP 响应                                     │
└─────────────────────────────────────────────────────────┘

第六步：返回 HTTP 响应

服务器返回 HTTP 响应，包含状态码、响应头和响应体：

HTTP 响应格式：
┌─────────────────────────────────────────────────────────┐
│  HTTP/1.1 200 OK                                       │
│  Content-Type: text/html                               │
│  Content-Length: 1234                                  │
│                                                         │
│  <!DOCTYPE html>                                       │
│  <html>...</html>                                      │
└─────────────────────────────────────────────────────────┘

常见的状态码：

状态码	含义
200	成功
301/302	重定向
404	资源未找到
500	服务器错误

第七步：浏览器渲染页面

浏览器收到响应后，开始渲染页面：

1. 解析 HTML：构建 DOM 树
2. 解析 CSS：计算样式，构建渲染树
3. 执行 JavaScript：执行页面中的 JS 代码
4. 绘制页面：把内容显示到屏幕上

浏览器渲染过程：
┌─────────────────────────────────────────────────────────┐
│  1. HTML 解析 → DOM 树                                │
│  2. CSS 解析 → 样式规则                               │
│  3. DOM + CSS → 渲染树                                │
│  4. 布局计算 → 每个元素的大小位置                      │
│  5. 绘制 → 像素显示到屏幕                             │
│  6. 合成 → 多层合并显示                                │
└─────────────────────────────────────────────────────────┘

---

6. 完整流程回顾

让我们把整个过程串起来：

从按下电源到访问网站的完整流程：

┌──────────────────────────────────────────────────────────────────┐
│  1. 按下电源                                                      │
│     └── 电源启动 → 主板唤醒 → CPU 复位 → 执行 BIOS/UEFI          │
├──────────────────────────────────────────────────────────────────┤
│  2. BIOS/UEFI 启动                                               │
│     └── 硬件自检 → 寻找启动设备 → 读取引导程序                   │
├──────────────────────────────────────────────────────────────────┤
│  3. 操作系统启动                                                 │
│     └── 引导程序 → 加载内核 → 启动服务 → 显示桌面                │
├──────────────────────────────────────────────────────────────────┤
│  4. 打开浏览器                                                   │
│     └── 双击图标 → 创建进程 → 加载程序 → 显示窗口                │
├──────────────────────────────────────────────────────────────────┤
│  5. 访问 URL                                                     │
│     └── URL 解析 → DNS 解析 → TCP 连接 → HTTP 请求              │
│         → 服务器处理 → HTTP 响应 → 浏览器渲染 → 显示网页          │
└──────────────────────────────────────────────────────────────────┘

---

7. 知识地图

这一章涉及的知识领域：

计算机系统概览
├── 硬件基础
│   ├── 电源 (PSU)
│   ├── 主板芯片组
│   └── CPU
├── BIOS/UEFI
│   ├── POST 自检
│   ├── 启动顺序
│   └── 引导程序
├── 操作系统
│   ├── 内核 (Kernel)
│   ├── 系统服务
│   └── 桌面环境
├── 应用程序
│   ├── 进程管理
│   └── 程序加载
└── 网络通信
    ├── DNS 解析
    ├── TCP/IP 协议
    ├── HTTP 协议
    └── 浏览器渲染

::: tip 继续学习 如果你想深入了解某个环节，可以继续学习：

• 从晶体管到 CPU：了解计算机硬件基础
• 操作系统（进程/内存/文件系统）：深入理解操作系统
• 计算机网络：深入理解网络协议 :::