同事直呼太硬核了:HTTPS握手全流程图解与实操,从TLS 1.2升到1.3性能竟然能翻倍?!

520 阅读10分钟

很多文章一上来就把细节拉满,容易看晕。这篇按"先易后难"的顺序:先用"经典6步流程"建立直觉(对应早期 TLS 的 RSA 思路),再用"现代主流 TLS 1.3 / ECDHE"对照讲清关键差异,最后给出 Vite 本地 HTTPS 实操配置,让你"看得懂,也搭得起本地环境"。

阅读收获 读完这篇文章,你将掌握:

  • HTTPS握手的完整流程(6步经典版 + TLS 1.3现代版)
  • TLS 1.2 vs 1.3 的核心差异和性能提升
  • 数字证书验证的真实过程
  • 前向保密机制的原理
  • Vite本地HTTPS环境搭建实战

HTTPS 总览

HTTPS = 在 HTTP 与 TCP 之间加一层 TLS“安全壳”:先用服务器证书确认真身,再通过密钥交换生成一次性会话密钥,后续所有 HTTP 内容都用该密钥加密传输。

image.png

SSL vs TLS 科普

  • SSL(Secure Sockets Layer,安全套接字层):1994年网景公司发明,已于2015年正式废弃
  • TLS(Transport Layer Security,传输层安全协议):SSL的继任者,目前主流版本是TLS 1.2和TLS 1.3
  • 现状:市面上说的"SSL证书"实际都是"TLS证书",只是习惯叫法未改

那么,TLS 这层"安全壳"具体做了什么呢?接下来我们详细拆解整个流程

经典6步流程(便于理解的讲法)

image.png

  1. 服务器去 CA 办“身份证”

    • 把“域名 + 服务器公钥”等信息交给 CA,CA 用自己的“私章”(私钥)签名,生成“数字证书”。
  2. 浏览器开始访问

    • 输入 URL → DNS 解析 IP → TCP 三次握手。
    • 发现是 https → 在 TCP 上发起 SSL/TLS 握手,向服务器“要证书”。
  3. 服务器把“数字证书”给浏览器

    • 里面有服务器公钥、域名、有效期、签名等。
  4. 浏览器验证证书

    • 看是否过期、域名是否匹配。
    • 用操作系统/浏览器内置的 CA 根证书(含公钥)“验签”(注意是验签,不是解密证书)来确认证书没被篡改、确实是可信 CA 签发。
  5. 证书可信 → 认可其中的“服务器公钥”和“域名归属”

    • 浏览器因此“信任这个公钥属于这个站点”。
  6. 生成对称密钥并安全交给服务器

    • 浏览器用“服务器公钥”把会话密钥加密后发给服务器。
    • 服务器用“私钥”解开,拿到这个会话密钥。后续数据传输都用这个“对称密钥”加密(快)。

再强调一次:这套是便于理解的“经典讲法”,可粗略对应 TLS 1.0/1.1/1.2 中的 RSA 密钥交换,现代主流会用 ECDHE 来“协商”出密钥。

注意点:服务器的公钥不是“解密出来”的,而是从证书里直接读取;但前提是先用内置 CA 公钥把证书“验签”并校验域名/有效期,只有验签通过后才敢使用证书里的服务器公钥去加密会话密钥。

现代主流版本:TLS 1.3 / ECDHE(安全更强、握手更快)

为啥看这个?因为主流浏览器和服务器基本都上这套了。

两个关键升级:

1. 更安全:前向保密

老版本问题: 就像你把保险箱密码写在纸条上,纸条丢了,小偷能打开你所有历史保险箱。

新版本解决: 每次聊天都换一把"临时锁",聊完就扔掉钥匙。哪怕服务器主钥匙以后被偷,小偷也打不开你之前的聊天记录。

2. 更快:握手次数减少

老版本: 你和服务器要"来回确认"两轮才能开始正式聊天

新版本: 只需要一轮确认就能开聊(如果你之前来过,下次几乎秒开)

核心差异(对比经典6步):

  • 证书验证:没变化,还是验签
  • 密钥生成:不再是"服务器公钥直接加密",而是双方"各出一个临时密钥,协商算出相同结果
  • 结果:中间人即使截获所有数据,也算不出这个密钥

简单类比: 就像你和朋友约定"各想一个数字,加起来当暗号",旁听的人听到结果也猜不出你们各自想的数字。而且这个"暗号"每次聊天都会换,聊完就扔掉,所以特别安全。


现代主流(TLS 1.3 / ECDHE)

企业微信截图_1759223712149.png

TLS 1.3握手时序图详细解读

想象一下,你要和一个陌生人建立安全的通信渠道。TLS 1.3就像是一套精密的"暗号系统",让客户端和服务器能够安全地交换信息。

准备工作:服务器的"身份证"

就像现实中需要身份证证明身份一样,服务器需要向权威机构CA申请一张"数字身份证"(证书)。这张证书包含:

  • 服务器的真实身份信息
  • 服务器的公钥
  • CA的数字签名(防伪标记)

第1步:客户端主动"打招呼"

客户端说: "你好!我想和你建立安全连接"

具体做了什么:

  • 抛出一个随机数(像游戏中的随机种子)
  • 生成一对临时密钥(公钥给你看,私钥自己留着)
  • 列出自己支持的加密方式:"我会AES加密、SHA哈希..."

目的: 开启握手,提供建立密钥的原材料

第2步:服务器"一口气"回应所有信息

服务器回复: "收到!这是我的全套信息" 这是TLS 1.3的聪明之处——服务器不磨蹭,一次性发送:

背后的计算过程:

  • 也抛出自己的随机数
  • 生成自己的临时密钥对
  • 用双方的密钥算出"共同秘密"(像两人各拿半张地图拼成完整地图)
  • 基于这个秘密生成"握手专用密码"

发送的信息包:

  • "服务器的随机数和临时公钥"
  • "服务器的身份证(数字证书)"
  • "服务器的签名(证明服务器参与了这次对话,使用服务器长期公钥对握手记录进行签名,)"
  • "握手完成确认(已加密)"

第3步:客户端验证身份并立即发送数据

客户端心里想: "让我验证一下你的身份,然后马上开始聊正事"

验证过程:

  • 检查服务器的"身份证"是否是权威CA签发的
  • 用自己的私钥和服务器公钥算出相同的"共同秘密"
  • 用握手密码解密服务器的确认信息
  • 一切验证通过!根据同一套算法生成"正式通信密码"

TLS 1.3的加速特性:

  • 发送"握手完成"确认
  •  同时发送第一个真实请求(比如访问网页)

目的: 确认安全,立即开始传输数据(不浪费时间)

第4步:开始加密对话

服务器回应: "收到你的请求,这是加密回复"

从这一刻起,双方就像有了专属的"暗号本":

  • 解密客户端的请求
  • 加密自己的回复
  • 后续所有通信都用这套密码

目的: 在安全隧道中传输真正的数据

TLS1.2 vs 1.3

企业微信截图_17591419326285.png

对比项目TLS 1.2TLS 1.3通俗解释
握手次数需要2次"你来我往"只需1次"你来我往"就像打电话确认事情
开始传数据握手2次后才能说正事握手1次后立即说正事减少了一半等待时间
网络延迟等待时间 = 2倍网络延迟等待时间 = 1倍网络延迟速度提升50%
加密强度支持弱加密算法只保留最强加密安全性大幅提升
握手保护握手过程明文可见握手过程加密保护连"商量怎么加密"都加密了
历史数据安全私钥泄露影响所有历史数据私钥泄露不影响历史数据因为使用临时公钥,用完即销毁
密钥交换可能使用固定RSA强制使用临时ECDHE每次会话都用全新的临时密钥

本地用 Vite 模拟 HTTPS(开发环境)

如果要在开发环境模拟https的流程的话,比如前端项目在本地进行node服务器部署的话,需要用vite来配置node服务器私钥和数字证书,如下:

目标:通过 https://127.0.0.1:443/ 起本地 HTTPS,完整体验证书校验与加密传输。

  1. Vite 配置证书
import fs from 'fs'
import { defineConfig } from 'vite'

export default defineConfig({
  server: {
    https: {
      key: fs.readFileSync('/path/to/your/key.pem'),  // 测试环境:服务器私钥
      cert: fs.readFileSync('/path/to/your/cert.pem') // 测试环境:服务器证书
    },
    host: '127.0.0.1',
    port: 443,
  },
})
  1. 本地 Host映射:通过 hosts 文件将127.0.0.1映射到你项目网站域名,这样你本地开启服务之后,直接在地址栏输入域名即可在本地进行调试
127.0.0.1  ywebsite.com

总结

HTTPS 本质:HTTPS = HTTP + TLS 安全层

  • 就像给普通的 HTTP 通信套上了一个"安全防护罩"
  • 先验证服务器身份,再建立加密通道

经典6步流程(便于理解 粗略对应 TLS 1.0/1.1/1.2 中的 RSA 密钥交换)

  1. 服务器办证:向 CA 申请"数字身份证"
  2. 浏览器敲门:发起 HTTPS 连接请求
  3. 服务器亮证:出示数字证书
  4. 浏览器验证:检查证书真伪(用 CA 公钥验签)
  5. 确认身份:信任证书中的服务器公钥
  6. 密钥交换:生成会话密钥,后续用对称加密通信

现代版本优势(TLS 1.3)

  • 更快:握手从 2 次往返变成 1 次往返
  • 更安全:强制使用前向保密(ECDHE)
  • 更简洁:移除了不安全的加密算法

关键差异对比

特性TLS 1.2TLS 1.3效果
握手次数2次往返1次往返速度提升50%
密钥交换可能用固定RSA强制用临时ECDHE前向保密
握手保护明文可见加密保护更安全

重要概念澄清

  1. 证书验证 ≠ 解密证书

    • 是用 CA 公钥"验签"证书,确认没被篡改
    • 然后从证书中直接读取服务器公钥
  2. 前向保密

    • 即使服务器私钥泄露,历史通信记录依然安全
    • 因为每次会话都用临时密钥,用完即销毁
  3. SSL vs TLS

    • SSL 已废弃,现在都是 TLS
    • 但习惯上还叫"SSL证书"

实践价值

文章最后提供了 Vite 本地 HTTPS 配置,让你能在开发环境中:

  • 体验完整的证书验证流程
  • 测试 HTTPS 相关功能
  • 理解证书配置原理

一句话总结:HTTPS 就是在客户端和服务器之间建立了一条"先验身份、再加密通信"的安全隧道,现代版本更快更安全!