如何快速修复 WordPress 混合内容警告（HTTPS / SSL）
通过 HTTPS 运行 WordPress 网站不再是可选的。它不仅更安全（所有内容都被加密，没有以纯文本形式传递任何内容），而且还建立了信任，是搜索引擎的排名因素，并且提供了更准确的推荐数据。不幸的是，从 HTTP 迁移到 HTTPS 时，网站所有者可能会遇到几个问题。其中之一是 “混合内容警告”。
由于 HTTP/2 与加密相关的性能问题已在很大程度上得到解决，而 “Let's Encrypt” 提供了一种获取免费 SSL 证书的简便方法，从而改变了整个行业。
对于在线企业而言，最重要的是，诸如 Chrome 浏览器和 Mozilla Firefox 之类的网络浏览器正在打击未通过 HTTPS 运行的网站，并向潜在访问者显示了更严格的警告。例如，如果你使用的是旧版 TLS 版本，则可能会 在 Chrome 中遇到 ERR_SSL_OBSOLETE_VERSION 通知。警告是你希望访客看到的最后一件事。
为了帮助你避免这些问题，我们提供了有关如何从 HTTP 迁移到 HTTPS 的深入指南。但是，在执行该过程之后，你可能仍然会看到混合内容警告。
什么是混合内容警告？
当用户尝试访问的 WordPress 网站同时加载 HTTPS 和 HTTP 脚本或内容时，用户浏览器中会出现混合内容警告。由于 HTTP 和 HTTPS 是完全独立的协议，因此可能会引起问题。
当你迁移到 HTTPS 时，所有内容都需要在该协议上运行，包括图像，JavaScript 文件等。以下是一些示例，说明如果你的某些内容仍通过 HTTP 加载时会发生的情况。
混合内容警告示例
Chrome 目前是最主要的浏览器，超过 77％的网络使用它。因此，以下警告是你的大多数访问者会看到的内容：
当然，并非所有人都在使用 Chrome。
这是 WordPress 网站上显示混合内容警告时 Firefox 中发生的情况的示例：
是什么导致混合内容警告？
我们发现，最常见的混合内容警告出现在有人将 WordPress 网站从 HTTP 迁移到 HTTPS 之后。一些 HTTP 链接只是被保留下来，这会导致混合内容警告开始触发。
以下是此警告的一些其他原因：
- 你刚刚向网站添加了新服务或插件。特别是，开发人员有时会在其插件或主题中使用绝对路径（http://yourdomain.com/style.css）链接到 CSS 和 JavaScript，而不是使用相对路径（/style.css）。
- 你的图像具有通过 HTTP 运行的硬编码 URL（例如 http://yourdomain.com/image.png）。这些可以在帖子，页面甚至小部件中。
- 你正在链接到外部脚本的 HTTP 版本（托管的 jQuery，Font Awesome 等）。
- 你具有使用 HTTP 而不是 HTTPS 的嵌入式视频脚本。
不幸的是，在开始进行故障排除之前，你可能无法发现问题的真正根源。
考虑到这一点，让我们看一些可用于修复混合内容警告的方法。
如何解决混合内容警告（4 个步骤）
你可以按照以下四个简单步骤来修复 WordPress 混合内容警告。此过程假定你已完成以下操作：
- 安装了 SSL 证书
- 将 HTTP重定向到 HTTPS （站点范围）
在以下示例中，我们将使用示例开发站点。
步骤 1：找出哪些资源正在通过 HTTP 加载
你需要做的第一件事是找出哪些资源仍通过 HTTP 加载。
请记住，这些警告可能仅在你网站的某些区域发生，而不是全局发生。浏览到提示警告的页面，并 通过单击以下命令启动 Chrome DevTools：
- Windows： F12 或 CTRL + Shift + I
- macOS： Cmd + Opt + I
你也可以从浏览器的工具菜单中打开 Chrome DevTools：
你可以在几个地方检查一下哪些资源没有通过 HTTPS 加载。
第一个是 “控制台” 选项卡。请注意，打开 Chrome DevTools 后，可能需要刷新页面才能正确加载所有内容。
如果出现混合内容错误，它们将以红色或黄色突出显示。通常情况下，它们会附有说明 “此请求已被阻止；内容必须通过 HTTPS 提供。” 这意味着浏览器设置被配置为自动阻止任何 HTTP 内容。
为了确保页面仅通过 HTTPS 加载，Chrome 默认开始 使用 Chrome 79 开始阻止混合内容。最近，他们推出了功能，以开始自动升级混合图像和媒体。
因此，在使用 Chrome DevTools 时，你可能会看到内容混合的消息，指示某些请求的元素已自动升级：
在这里，我们可以清楚地看到导致混合内容警告的各种不安全元素，包括样式表和脚本。
你还会注意到，请求了一个不安全的.jpg 图像，该图像已自动升级到 HTTPS。（注意：如果该浏览器位于 Chrome 以外的其他浏览器上，则不会自动升级）。
你也可以在 Chrome DevTools 的 “安全性” 标签中查找。这将向你显示任何非安全来源：
在 “ 网络” 标签下，你还可以找到被阻止的请求的列表：
如果你没有使用 Chrome，或者只想快速总结错误，还可以使用免费工具，例如 Why No Padlock。它将扫描单个页面并显示所有不安全的资源。
该工具易于使用。你只需输入 URL 并单击 Test Page，它就会向你显示出现的任何错误。另外，它是免费的！
批量检查 HTTPS 警告
如果你担心网站的其余部分，则可能需要批量检查。以下是一些建议的方法：
- 有一个免费的小工具，叫做 JitBit 的 SSL Check，可用于爬网 HTTPS 站点并搜索不安全的图像和脚本，这些图像和脚本将在浏览器中触发警告消息。每个网站抓取的页面数限制为 400。
- 该 Ahrefs 现场审核工具 能够检测到 HTTPS / HTTP 混合内容的能力。如果你已经可以使用此解决方案，或者你的营销团队中的某个人可以使用它，那么这可能是一种完善的解决方法。
- HTTPS Checker 是一个桌面软件，你可以安装该软件来扫描你的站点。重大更改后，它可以帮助你检查 “不安全” 的警告和内容。它在 Windows，Mac 和 Ubuntu 上可用。免费计划使你每次扫描最多可以检查 500 页。
- SSL 不安全内容修复程序 是一个 WordPress 插件，你可以将其安装在你的网站上，以发现导致混合内容警告的错误。它是免费使用的，甚至会自动执行修复程序来解决错误。
使用上述任何工具都可以节省你的时间，而不必手动检查站点上的每个页面上是否有内容混合的警告和错误。为了全面评估你网站上的潜在错误，你可以考虑结合使用这些解决方案。
步骤 2：验证 HTTP 资源是否可以通过 HTTPS 访问
下一步是确认可以通过 HTTPS 访问通过 HTTP 加载的资源。它们很可能是，你只需要更新链接。
举例来说，假设我们的混合内容错误指向以下不安全的 jQuery 脚本和.jpg 图片：
- http://ajax.googleapis.com/ajax/libs/jquery/3.31/jquery.min.js
- http://example-site.com/wp-content/50d00acf6e4%2Fpuppy-thumb.jpg?v=1600261043278
如果我们同时使用这两个 URL，将它们输入到浏览器的地址栏中，并在开始时将 “http” 替换为 “ https”，则可以看到它们加载正常。因此，我们只需要在我们的网站上进行搜索和替换即可。
步骤 3：执行 WordPress 搜索并替换
有很多方法可以执行 WordPress 搜索和替换。在本节中，我们将引导你完成两个不同的推荐选项。
如果你感到好奇，我们不建议你使用诸如 Really Simple SSL 之类的工具。尽管它是一个很棒的插件，但是从长远来看，最好不要依赖这样的解决方案。你以后不会再迁移回 HTTP，因此最好以正确的方式进行操作，并更新数据库中的 HTTP URL 。
搜索并替换替代项
使用免费的 Better Search Replace 插件完成相同的任务，然后在完成后将其删除：
你可以从 WordPress 插件目录下载该工具，也可以在 WordPress 仪表板中搜索该工具。
激活它后，只需搜索你的 HTTP 域（http://yourdomain.com）并将其替换为你的 HTTPS 域（https://yourdomain.com）：
步骤 4：确认混合内容警告已消失
完成搜索和替换后，你将需要仔细检查你的站点，以确认混合内容警告已消失。我们建议你在前端访问你的网站，并在几页上单击一下，同时在地址栏中查看浏览器状态指示器。
在我们的网站上，我们可以看到.jpg 图像现已修复，但是仍然存在不安全的脚本警告。
这是因为我们进行了搜索，并替换了从我们自己域中加载的资源。jQuery 警告是由必须手动更新的外部脚本引起的：
在这种情况下，需要将脚本手动添加到我们的 WordPress 标头（header.php）中。它应该使用相对网址，因此我们将其更新为 //ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js：
HSTS
为什么不能简单地使用 HSTS （HTTP 严格传输安全性）来解决此问题。创建 HSTS 是当站点通过 HTTPS 运行时强制浏览器使用安全连接的一种方法。
你可以将其添加到 Web 服务器中，并在响应标头中将其添加为 “Strict-Transport-Security”。
但是，HSTS 并不是所有混合内容警告的快速解决方案。HSTS 仅处理重定向，而混合内容警告是浏览器本身的功能。你也无法控制第三方站点是否启用 HSTS。