混合内容（Mixed Content）修复：定位 → 改法 → 验证

什么是混合内容（一句话）

混合内容（Mixed Content）：页面本身是 https://，但里面的图片、脚本、样式、视频还是用 http:// 地址加载。浏览器会拦截或自动升级这些资源，严重时显示「不安全」、页面排版错乱、询盘表单点不动【官】。

浏览器怎么处理混合内容（决定了你会看到什么）

浏览器把混合内容分成两类，处理方式不同【官】：

所以「图片还能看、但表单点不动」很常见——不是你没中招，是浏览器帮你兜了一半。只要 Console 里有 Mixed Content，都要按下面的步骤改干净。

第 1 步：定位（三种找法，任选）

1. 1. 开发者工具（最准）：用 Chrome 打开出问题的页面，按 F12（Mac：Option + Command + I）打开开发者工具，点 Console（控制台），找带 Mixed Content 字样的黄色/红色提示——它会把具体的 http:// 地址写出来。
2. 2. 看源代码（最快）：在网页上右键 → 查看网页源代码，按 Ctrl + F 搜索 http://，逐个确认哪些是「页面资源」而不是普通文字。
3. 3. 一条命令（适合批量查）：

curl -s https://你的域名/ | grep -Eo '(src|href)="http://[^"]+"' | sort -u

把首页 HTML 里所有 http:// 的图片、脚本、样式、链接列出来。注意：这条命令只看首页的静态 HTML，动态加载的内容（比如插件后插入的客服窗口）抓不到，以第 1 种方法的控制台提示为准。

把找到的资源分类，不同类别的改法不一样：

第 2 步：改法（按这个顺序来）

① 先改「网站地址」这一处总开关

很多网站（尤其 WordPress）在后台存着一个「网站地址」，所有页面资源都按它拼接。它还是 http:// 的话，改别的地方都白改：

• WordPress：设置 → 常规，把「WordPress 地址」和「站点地址」两处都改成 https://。

② 批量替换正文里写死的 http 链接

文章、产品详情里手工粘贴过的 http://你的域名/... 图片地址，需要批量替换成 https://：

• WordPress 可以用数据库搜索替换类插件完成；操作前先备份数据库——搜索替换是整库操作，改错了要能退回来。

改前改后长这样（替换时尽量带上完整域名，缩小误伤范围）：

<!-- 改前：写死的 http 地址 -->
<img src="http://你的域名/uploads/2024/product.jpg" />

<!-- 改后（方案一）：换成 https -->
<img src="https://你的域名/uploads/2024/product.jpg" />

<!-- 改后（方案二，更省心）：改成站内相对路径，换域名/换协议都不用再改 -->
<img src="/uploads/2024/product.jpg" />

③ 第三方资源换成 https 版本

在线客服、地图、统计代码这类「别人给的代码」：到对应供应商的后台，重新复制一份 https 版本的嵌入代码换上去。旧代码里写死的 http:// 供应商地址，现在基本都有 https 版。

④ 用 Cloudflare 的，打开「自动 HTTPS 重写」兜底

域名接入 Cloudflare 的，可以在 SSL/TLS → 边缘证书 里打开 Automatic HTTPS Rewrites（自动 HTTPS 重写）：浏览器请求 http 资源时由 Cloudflare 自动改写成 https。注意它只是兜底——第 ② ③ 步把源内容改干净才是根治，否则一旦哪天不走 Cloudflare，问题原样回来。

⑤ 顺手升级主题、插件和 CDN

老主题、老插件经常在代码里写死 http 地址，升级到新版本大多已经修好；用了 CDN 的，到 CDN 后台把资源协议改成「跟随页面协议」。

第 3 步：验证（四件事，五分钟）

1. 1. 控制台干净：回到出问题的页面，按 Ctrl + Shift + R 强制刷新，Console 里不再出现 Mixed Content。
2. 2. 地址栏正常：点地址栏左侧图标，看到「连接是安全的」→「证书有效」。

1. 3. 关键页面走一遍：首页、产品页、询盘表单各开一次，表单实际提交一次测试——脚本被拦时，页面看起来正常但按钮没反应，只有真点一次才知道。
2. 4. 多设备再试：手机流量打开一次，最好用一台安卓手机；再按上面的命令抓一次首页，http:// 资源应为空。

不同的建站方式，修法落在哪

常见坑（对照处理）

别和「证书问题」混着修

分不清是哪种，按浏览器显示「不安全」的 6 种原因与排查逐项对照；红屏类故障先看四种 SSL 故障实景演示。

现在要做的事

• 不确定自己网站现在是什么状态：先做一次免费的 HTTPS 体检；
• 证书刚过期导致红屏：先按证书过期 5 分钟应急恢复，再回来修混合内容；
• 错误码看不懂：SSL 错误码速查 一码一行；
• 页面里 http 资源太多、自己改不动：可以把本页复制给 AI 智能体（页面顶部有一键复制按钮），让它带你逐条改；也可以预约 30 分钟诊断，或直接看 SSL 证书终身维护服务（600 元/域名 · 长期统一价），把修复和后续监控一起交出去。