摘要:网站使用SSL证书开启HTTPS访问后正常情况下浏览器的地址栏会显示一个绿色的安全锁,表示这个网站启用了HTTPS是安全的,但是有的时候网页明明通过HTTPS可以正常访问,可是地址栏就是不显示绿色的安全锁,而是显示的一个小黄锁或者一个感叹号,本文分析该问题的解决办法。

网站在使用SSL证书开启HTTPS访问后,一般来说正常情况下浏览器的地址栏会显示一个绿色的安全锁,表示这个网站启用了HTTPS是安全的。

网站启用HTTPS后浏览器显示绿色的“安全”标识。

像这样不同的浏览器甚至还是在前面显示绿色的“安全”标识。

但是有的时候网页明明通过HTTPS可以正常访问,可是地址栏就是不显示上面那种绿色的安全锁,而是显示的一个小黄锁或者一个感叹号,甚至个别的浏览器还会显示不安全。

网站开启HTTPS后在火狐浏览器下显示小黄锁

四座网在开启HTTPS的时候也是遇到了这个问题,在火狐浏览器下地址栏前面显示的是一个小黄锁。

点击那个小黄锁甚至还会提示说“不安全。”

正常开启了HTTPS访问的网站被提示不安全

而在Google的Chrome浏览器上访问,显示的是一个灰色的感叹号。

使用Chrome访问HTTPS网站显示感叹号

然而在访问四座网后台的时候,不管用什么浏览器,地址栏都是可以正常的显示绿色的安全标志。

访问网站后台却可以显示绿色的安全标志

那么这就可以确定量个问题:

1、SSL证书肯定没问题,如果SSL证书有问题的话,不可能访问前台是小黄锁、而访问后台却又是绿色的安全标志。

2、肯定也不是浏览器的原因。

排除了以上两个主要的问题之后,那极有可能就是前台网页的问题了。

搜索查了一下相关的文章,据说是开启了SSL证书通过HTTPS访问的网站页面,网页上所有引入的资源(例如图片、JS、外链等)也必须是HTTPS的,否则就会因为该非HTTPS的引入资源而影响HTTPS页面的安全性。

既然查到了这个说法,那我们就可以借用Chrome浏览器的开发模式来验证一下。

Chrome浏览器里按F12打开开发者工具,然后再点击“Console”,最后再重新访问一下浏览器里不显示绿色安全标志的网页。可以看到如下结果:

Google浏览器的开发者工具显示的安全警告和提示

上面可以看到有相关的黄色提示和红色警告,从上面提示的内容可以看到,大概的意思是说当前的网站是HTTPS的,但是有一些图片和JS文件却不是HTTPS的,这些图片和JS文件也必须是HTTPS的才可以,同时还列出了页面中引用的所有非HTTPS资源的详细URL。(如果网页中引用了很多非HTTPS的资源的话,这个提示会有很多)

知道了是什么原因导致的问题后,只要修复上面的提示的问题就可以了。四座网开启HTTPS访问的时候,提示的警告不多,而且主要原因是我启用了七牛的图片缓存插件,但插件里设置的是普通的HTTP调用,所以我只要修改一下变成HTTPS调用就可以了。另外还有一个通过外链调用的其他网站的图片,我只要把这个图片保存到自己的网站用自己的链接调用即可。

修改了以上问题后,访问网站时就可以显示绿色的安全锁标志了。

总结:

1、开启了HTTPS访问的页面,不能有任何非HTTPS的引入资源,包括调用的图片、JS、CSS。

2、用第三方调用的资源也必须使用HTTPS,例如统计代码、CDN图片等。

推荐相关内容:

Wordpress简单一步开启全站HTTPS访问

百度云虚拟主机BCH部署SSL证书

免费SSL证书大全