一、HTTPS 早就是及格线，不是加分项

看默认走 HTTPS 的网站比例，逐年变化最能说明问题（W3Techs，每年 1 月取值）：

八年从 26.9% 涨到 90.2%——HTTPS 已经从【有没有安全意识】变成【有没有基本配置】。

换个切面看差距：全部网站 90.2%、前 100 万站 93.7%、前 1000 站 96.4%。而 Chrome 实际加载的页面里，Windows 95%、Mac 98%、Android 99%、Linux 88% 走的是 HTTPS。剩下没上的，多是没人管的老站和小站。

成本也已经不是理由：Let's Encrypt 一家签着 6.437 亿张有效证书，64.3% 的网站用的就是它——免费、自动续期。

这一条在课程里出现过：第二章讲过浏览器地址栏的【加密图标】怎么确认，第三章讲过浏览器和服务器之间的加密过程。在这里，它变成了上线前必查的一项。

二、HSTS：让浏览器记住【这个站只用 HTTPS】

装了证书之后还有一个漏洞：用户手动输 http 地址，或者点了一条老链接，浏览器仍会先用 http 请求一次，这一次是明文的。

HSTS（HTTP 严格传输安全）解决的就是这个：服务器告诉浏览器【以后访问我，一律直接走 HTTPS，不要再试 http】，浏览器会把这个规则记一段时间。

现在 35.9% 的网站已经开启了 HSTS（2015 年只有 0.4%）。它不影响用户，纯粹是堵住第一次明文请求。

开启前务必确认全站 HTTPS 已经跑通——HSTS 一旦被浏览器记住，在有效期内即使你想退回 http 也回不去，证书出问题时会很麻烦。

三、重定向：老地址必须能接住

开通 HTTPS 之后，原来的 http 地址仍然会被访问（搜索引擎、老链接、用户书签）。处理办法就是重定向。

最常见的四个场景：http 到 https、带 www 到不带 www（或反之）、旧域名换新域名、改版后的旧固定链接。 每一个都应该有对应的 301。

301 和 302 用反，是这里最常犯的错：该用 301 的地方写成 302，搜索引擎就不会把老地址的权重传过去，改版一次、排名掉一段，往往就是这里造成的。

四、混合内容：页面自己安全了，里面还藏着 http

最后一个坑最容易漏：页面本身是 HTTPS，里面却引用了一张 http 的图片、一段 http 的脚本。

浏览器的反应有两种：图片、样式这类被动内容会被拦下或替换成警告图标；脚本这类主动内容会被直接阻止加载。 表现出来就是【锁头带感叹号】，或者页面样式莫名其妙地错乱。

改法有三步：把站内所有 http 引用搜出来换成 https；对不能确定协议的外部资源，只写【//】开头的协议相对地址，让浏览器跟随当前页面的协议；改完之后用开发者工具的控制台复查一遍，看还有没有黄色警告。

顺手检查两个地方：邮件模板里的图片链接、CSS 里引用的字体或背景图——这两处最容易被忘掉。

五、动手 Demo：算清 HTTPS 这八年，以及剩下的那一成

把采用率的变化算成两个更直观的说法：涨了多少个百分点、翻了几倍。

a, b = 26.9, 90.2       # 2018 年初、2026 年 10 月的默认 HTTPS 比例
print("  涨了 %.1f 个百分点" % (b - a))
print("  是 2018 年初的 %.2f 倍" % (b / a))
print("  还没上 HTTPS 的网站约占 %.1f%%" % (100 - b))

实跑输出：

--------------------------------------------------------------------
HTTPS 与重定向——把 http 这条路彻底封掉
--------------------------------------------------------------------
  先看 HTTPS 普及到什么程度了（W3Techs，每年 1 月取值）：

  时间              默认走 HTTPS
  -------------------------------
  2018 年           26.9%
  2020 年           57.4%
  2022 年           77.4%
  2024 年           84.9%
  2026 年 1 月      87.6%
  2026 年 10 月     90.2%
  -------------------------------
  2018 年初还只有 26.9%，八年涨到 90.2%——HTTPS 已经从
  【加分项】变成【及格线】。但越往上爬越慢，剩下的一成是
  没人管的老站和小站。

  换个切面看，差距更直观：

  范围                       默认 HTTPS 比例
  -------------------------------------------
  全部网站                   90.2%
  访问量前 100 万            93.7%
  访问量前 1000              96.4%
  Chrome 页面（Android）     99%
  Chrome 页面（Windows）     95%
  Chrome 页面（Linux）       88%
  -------------------------------------------
  证书早就不贵了：Let's Encrypt 一家签着 6.437 亿张有效证书，
  64.3% 的网站用的就是它——免费、自动续期。
  开了 HTTPS 之后再上一道 HSTS（35.9% 的网站已经开了），
  浏览器会记住【这个站只用 HTTPS】，连第一次跳转都省掉。

  但光有证书不够——老地址必须能接住。这就是重定向：

  状态码     含义               什么时候用
  ----------------------------------------------------------------
  301        永久搬家           http 换 https、换域名、改固定链接
  302        临时搬家           短期的 A/B 测试、活动页
  307        临时，保留方法     临时跳转但提交方式不能变
  308        永久，保留方法     永久跳转且要保住 POST 语义
  ----------------------------------------------------------------
  四种里最常写错的是 301 和 302 用反：该用 301 的写成 302，
  搜索引擎就不会把老地址的权重传过去。

  还有一个坑叫【混合内容】：页面自己走 HTTPS 了，
  里面却引用了一张 http 的图片——浏览器会拦下来或给出警告，
  页面上出现【锁头带感叹号】。改法是把站内所有 http 引用
  一起换成 https，或者干脆只写【//】开头的协议相对地址。

看第二行：3.35 倍。八年涨三倍多，这个速度说明它不是可选项——用户和浏览器已经把 HTTPS 当成默认预期。 看第三行：还有约 9.8% 没上。这些站里，多数是小站和老站，没人维护是根本原因，不是不知道。 最后回到重定向那张表：改版、换域名、http 换 https，三件事都要配套 301。 只换不跳，等于把所有老链接一次性作废。

30 秒实验

1. 在浏览器地址栏手动输一个你熟悉的网站的 http 地址，看它会不会自己跳到 https。
2. 打开一个网站，按 F12 看控制台有没有【混合内容】的黄色警告。
3. 查一下你的证书有效期还剩多久——续期提醒设了吗？

常见误区

1. 错误：装了证书就安全了。——纠正：还要堵住三处：老地址的 http 入口（重定向）、第一次明文请求（HSTS）、页面里的 http 引用（混合内容）。 三处都不处理，等于门锁了新配的钥匙还挂在旧门把手上。
2. 错误：HTTPS 会拖慢网站。——纠正：现代 TLS 的开销极小，而且 HTTPS 是启用 HTTP/2 与 HTTP/3 的前提。 现在更快的传输协议都要求加密。
3. 错误：HTTPS 说明这个站可以信任。——纠正：HTTPS 只证明【传输过程】被加密，不证明【网站可信】。 钓鱼网站大量使用 HTTPS——锁头是加密标志，不是信誉标志。

• ☐ 下一节（7-8 提供对智能手机与PC的支持：屏幕尺寸、断点）

相关笔记

• 个人信息保护的措施 —— 上一节讲收数据要合规，这一节讲传输要加密
• 在浏览器与Web服务器之间进行加密 —— 加密的过程本身
• Web 网站的安全性可通过加密图标确认 —— 锁头图标的含义
• 对数据传输进行拦截的攻击者 —— 不加密会被看到什么
• 浏览Web页面 —— 浏览器那一侧看到的提示
• 🕸️ Web技术原理 · 索引