Divi WordPress Theme

您是否只是将WordPress网站移至HTTPS,只是遇到一些奇怪的混合内容警告,而不是您期望的那个美丽的绿色挂锁? 或者,也许您仍在计划阶段以在WordPress站点上使用HTTPS,并想知道进行切换时会发生什么。

iThemes最佳WordPress安全插件以保护和保护WordPress

无论哪种方式,这篇文章都会对您有所帮助,因为我将向您展示如何将网站移至HTTPS / SSL后解决最烦人的问题之一:

混合内容警告。

首先,我将解释混合内容警告的实际含义以及它可能对您造成的影响,以及它在各种流行的Web浏览器中的外观。

然后,我将为您提供有关如何诊断和修复WordPress网站混合内容警告的分步指南。

这是混合内容警告的含义及其发生的原因

当您使用HTTPS和SSL证书时,它将对在服务器和访问者的Web浏览器之间传递的所有数据进行加密。 但是,为了使该加密起作用, 服务器和浏览器之间传递的所有内容都需要使用HTTPS

例如,您需要加载:

  • 图片或视频(您自己的媒体或您要嵌入的其他媒体)
  • 脚本(内部或外部跟踪脚本)
  • CSS文件
  • …您明白了–一切!

当您的站点仍通过HTTP而不是HTTPS加载某些资产时,将出现混合内容警告。

那为什么会有问题呢? 好吧,我在这里引述Google的意见,因为他们在总结问题上做得很好。 混合内容…

…削弱了整个页面的安全性,因为这些请求很容易受到中间人攻击,攻击者会窃听网络连接并查看或修改两方之间的通信。 使用这些资源,攻击者通常可以完全控制页面,而不仅是受到破坏的资源。

听起来不太好吧?

基本上,即使您尝试使用HTTPS做正确的事情,也要加载混合内容 不能为您带来HTTPS的全部好处,因为恶意行为者仍然可以劫持该HTTP内容。

在不同的浏览器中混合内容警告的外观如何

由于混合内容会削弱页面的安全性,因此,如果您的网站提供了混合内容,则大多数浏览器都会向访问者显示警告。 这是在流行的浏览器中出现的混合内容警告,因此您可以判断该警告是否正在您的网站上发生。

Google Chrome浏览器中的混合内容警告(和其他Chromium浏览器)

在Chrome或其他Chromium浏览器(例如Opera)中,混合内容会获得通用信息图标,而不是绿色的挂锁。 此外,如果用户将鼠标悬停在图标上,他们将看到不祥的“您与该站点的连接不完全安全”消息:

WordPress的混合内容警告铬

Firefox中的混合内容警告

在Firefox中,您会看到相同的信息图标,以及挂锁上方的黄色警报符号。 如果用户将鼠标悬停,他们将看到“连接不安全”:

混合内容警告Firefox

边缘混合内容警告

在Edge中,它实际上显示了 不安全 消息,以及用户单击以下内容时的更详细说明:

混合内容警告边缘

WordPress网站上混合内容的最可能原因

好的,如果您只是将站点移至HTTPS,但收到的是混合内容警告而不是绿色的挂锁,则以下是一些最可能的原因。

您仍在加载HTTP图像(您自己的图像或其他人的图像)

当您更新WordPress网站的URL以使用HTTPS时,它将更改所有WordPress生成的链接,例如:

  • 菜单项
  • 发布存档链接
  • 小部件
  • 等等。

但它 更改所有链接 在您的内容中 (例如,您在WordPress编辑器中键入的所有内容),包括您已嵌入的图像。 结果,您所有的旧映像仍通过HTTP加载。

值得庆幸的是,通过在数据库上运行搜索/替换,很容易解决此问题。

如果要热链接其他服务器上的图像并通过HTTP加载它们,则可能是发出警告的另一个原因。 您需要手动修复这些问题。

您正在使用外部脚本或通过HTTP嵌入

几乎每个站点都将加载外部脚本或嵌入外部内容。 例如,Google Analytics(分析)脚本或YouTube视频。

如果这些脚本/嵌入程序使用HTTP,它们将触发混合内容警告。

您要嵌入的大多数现代脚本已经在使用HTTPS,但是如果出现以下情况,这可能是一个问题:

  • 您尚未更新嵌入代码的年龄(例如,几年前我有一个Amazon嵌入代码仍使用HTTP,即使此后Amazon已移至HTTPS)
  • 由于某种原因,您使用的是鲜为人知的使用HTTP的脚本

您的一个插件使用绝对路径(不可以)

如果插件开发人员使用正确的代码标准,那么这应该不是问题。 但是某些插件开发人员使用绝对路径而不是相对路径,这可能会导致某些插件内容通过HTTP加载。

您可能不会经常遇到这种情况,因为大多数开发人员会正确地做事-但这是有可能发生的。

如何修复WordPress混合内容警告:分步操作

现在您知道了问题所在以及为什么会发生,现在让我们介绍如何诊断和修复问题。

步骤1:找出导致问题的原因(即查找HTTP内容)

首先,您需要在网站上嗅探出触发混合内容警告的HTTP内容。

您可以通过几种方法来执行此操作。

首先,有很多工具可以帮助您在网站上找到混合内容。

如果仅在单个页面上出现错误,那么免费的“为什么没有挂锁”工具很棒。 您要做的就是输入URL,它会告诉您引起问题的确切资源:

为什么没有挂锁

它甚至告诉您解决该问题所需采取的措施。

不过,为什么“无挂锁”仅适用于单个URL。 因此,如果您在整个网站上看到混合内容错误,则可能需要使用HTTPS Checker之类的批量工具,该工具最多可以抓取500页 免费 (或最多10,000页,每月9美元)。

另外,您也可以只使用 安全 Chrome开发者工具的标签,以查找不安全的内容:

Chrome开发人员工具混合内容

步骤2:解决问题(几种不同的方案)

找到导致问题的原因后,您只需要更新资源即可使用HTTPS(如果可能的话)或停止加载资源(如果它不支持HTTPS)。

根据导致问题的原因,有几种方法可以做到这一点。

由于其中一些更改涉及您的数据库,因此我强烈建议您在继续之前备份您的网站。

修复自己的图像或内容仍通过HTTP加载的问题

如果您自己的图像或其他自托管内容仍通过HTTP加载 在您安装SSL证书并为您的网站激活HTTPS之后,解决此问题的最佳方法是在数据库上运行搜索并替换。

基本上,您将找到的所有实例 https://yoursite.com 并替换为 https://yoursite.com

最简单的方法是使用美味大脑提供的名为“更好的搜索替换”的免费插件。

安装并激活它后,请转到 工具→更好的搜索替换

填写如下表格:

  • 搜索: https://yoursite.com
  • 用。。。来代替: https://yoursite.com注意S的添加
  • 选择表格: –选择所有表格

现在,离开 以空运行方式运行? 框已选中。 在进行任何永久更改之前,这将进行测试。 然后,点击 运行搜索/替换 运行测试:

更好的搜索替换

如果测试运行顺利进行,请取消选中 以空运行方式运行? 框以实际运行它。

修复通过HTTP加载外部内容

如果问题是外部脚本或通过HTTP加载内容,则需要手动修复。

假设问题在于您正在通过BootstrapCDN嵌入Font Awesome,而Font Awesome CSS文件正在通过HTTP加载(BootstrapCDN使用HTTPS –这只是一个示例):

脚本

在该屏幕截图中,您可以看到有问题的脚本链接是:

https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css

要查看是否可以通过HTTPS加载此脚本,只需添加一个“ s”,然后查看它是否可以在浏览器中使用。 在下面,您可以看到我确实能够通过HTTPS加载脚本并获得绿色的挂锁:

通过HTTPS加载

验证脚本/内容已通过HTTPS加载后,您所需要做的就是在站点上该脚本/内容的所有实例中添加“ s”。

通常,您可以通过以下方式完成此操作:仅转到嵌入脚本的位置,然后以这种方式添加“ s”:

解决问题

如果找不到脚本的嵌入位置,则另一个选择是使用与上一步相同的数据库搜索/替换方法,以将HTTP版本替换为HTTPS版本:

搜索替换

步骤3:确认您已获得绿色挂锁

用HTTPS替换所有HTTP内容后,请返回并确认您的站点确实确实获得了绿色挂锁:

绿色挂锁

随您去–这就是解决WordPress网站上混合内容警告的方法。 还有其他有关WordPress混合内容警告问题的问题吗? 发表评论!

【免费外贸推广营销视频培训教程】
https://school.yooopaaa.com

WordPress著名Avada主题官方优惠
https://1.envato.market/xxPav

WordPress可视化建站Elementor插件
https://elementor.com/?ref=19904

WordPress外贸独立站DIVI主题官方优惠
https://www.elegantthemes.com/affiliates/idevaffiliate.php?id=59787

亚马逊选品工具Jungle Scout官方优惠
https://junglescout.grsm.io/jieqiu1568

独立站SEO优化工具Semrush免费7天试用
https://shareasale.com/r.cfm?b=1577772&u=2541755&m=97231&urllink=&afftrack=