宝塔面板开启SSL后站点相关问题汇总-BanYuner

最近看到很多站点开始折腾小程序了,我骚动的心也开始按耐不住了,但是开发小程序的最基本要求就是站点必须支持SSL,也就是需要https的支持,我一直是比较懒,不想去折腾这些,但是该来的还是来了,所以昨天晚上折腾了一会,发现了不少问题,也遇到了不少坑,这里我总结一下,如果能帮助到大家最好了,没有帮助到的非常抱歉,你遇到的问题可能比较特殊吧。

这里值得说明的就是整个操作环境如下:

  • 服务器配置:2核CPU,4G内存,40GB硬盘
  • 服务器面板:宝塔面板5.9.0版本
  • 运行环境:LAMP(Linux+Apache2.4+MySQL5.5+phpmyadmin4.4)
  • 运行程序:WordPress 4.9.7
  • 使用浏览器:Chrome

运行环境如上,如果你的运行环境和我的不一样,那么问题方面可能也会不一样,请详解。

宝塔如何开启SLL

宝塔界面开启SSL的方式非常简单,直接进入下面的界面,即可一键开启:
宝塔面板开启SSL后站点相关问题汇总-BanYuner

默认情况下就是上面的界面,上面的界面通过左边的菜单中的网站-》设置(在屏幕右边)-SSL,这个路径即可看到了,默认情况下一般都是不会开启的,那么如果你需要开启的话,这里建议使用免费的Let’s Encrypt证书,虽然只有3个月有效期,但是可以自动续约还是不错的,宝塔方面做出的解释如下:

申请之前,请确保域名已解析,如未解析会导致审核失败
Let’s Encrypt免费证书,有效期3个月,支持多域名。默认会自动续签
若您的站点使用了CDN或301重定向会导致续签失败
在未指定SSL默认站点时,未开启SSL的站点使用HTTPS会直接访问到已开启SSL的站点
99%的用户都可以轻易自助部署,如果您不懂,宝塔提供证书部署服务50元一次

我个人方面安装是没有问题的,输入了自己的邮箱,勾选你要申请的域名,之后点击申请,等待大概5-10秒之后就可以看到下面的界面:
宝塔面板开启SSL后站点相关问题汇总-BanYuner

同时,勾选图片右上角的强制https,主要是方便懒人的,如果你不想强制的话,需要做的事情也比较多了,至少替换链接地址都是一个麻烦事。以上操作完毕之后,你可能需要关闭当前浏览器,清空缓存,建议通过浏览器自带的缓存清理功能进行清理,之后再打开站点,发现是https开头了,但是并没有小绿锁,而是下面的状态:
宝塔面板开启SSL后站点相关问题汇总-BanYuner

那么这个问题我相信是狠多人常见的问题了,而今天这篇文章主要的内容也是这个部分了。下面从几个方面来尝试性的解决此类问题。

端口问题导致无法访问https

SSL使用的端口为443端口,如果你的站点没有打开此端口,那么可能就会造成https的地址无法访问,需要的操作分为两个步骤:

宝塔面板放行443端口

进入宝塔面板的安全菜单:
宝塔面板开启SSL后站点相关问题汇总-BanYuner

放行之后继续下一步的操作。

阿里云ECS安全组放行443端口

如果你使用的是阿里云的ECS服务器,那么存在安全组一说,腾讯云的服务器或者其他的服务器应该都有这类功能,按照下方图示进入安全组并且添加规则:
宝塔面板开启SSL后站点相关问题汇总-BanYuner

点击配置规则之后就可以看到很多规则说明了,我们点击“添加安全组规则”按钮:
宝塔面板开启SSL后站点相关问题汇总-BanYuner

宝塔面板开启SSL后站点相关问题汇总-BanYuner

如图填写完毕之后确定即可,至此,关于端口方面导致不能访问的问题可能已经得到了解决,同样的,清空缓存关闭浏览器后尝试重新访问,耐心等待1分钟之后再决定问题是否解决,毕竟生效也有一定的时间,如果有时间可以尝试重启服务器也是一个不错的选择。

可以访问HTTPS但是没有小绿锁解决办法之一

这个方面的问题表现形式上面已经介绍过了,也就是地址为https,但是前面是一个感叹号的图标,那么造成这样的问题是因为你的站点加载的资源中含有一个或者一个以上的资源使用的是http的链接地址,这个就是之前我说了,在宝塔面板界面为什么开启强制https这个功能了。虽然强制开启了,但是有些地址使我们人工输入的,这些可能就只能靠我们自己去手动修改了,但是我百度了一下,似乎有相关代码,但是我个人方面并没有去实践,大家仅做参考,但请勿轻易尝试:

HTTPS绝对链接替换

替换WordPress中的http链接为https,此代码仅针对WordPress内部的有效外部引入的文件地址无效:

HTTPS相对链接替换

这个方法适用于那些同时支持http和https的站点:

一般来说,我们是不需要使用到上面的代码的,毕竟问题方面可能是一个很小的设置问题,并不需要代码来解决。上面推荐的办法可能并不适用,那么请查看下面的方法。

可以访问HTTPS但是没有小绿锁解决办法之二

这里介绍的第二种解决办法就是修改站点地址,具体操作模式如下:
宝塔面板开启SSL后站点相关问题汇总-BanYuner

将站点地址中的http修改为https看看效果,如果还是没有出现小绿锁,那么就只能使用终极解决办法了,虽然比较麻烦也比较复杂,但是解决办法的几率最高。

可以访问HTTPS但是没有小绿锁解决办法之三

这个方法解决问题的几率可能比较高,但是适用与一些有一定基础的用户,毕竟小白操作起来万一错误了,那就很尴尬了。

首先我们打开站点,在Chrome浏览器下点击F12,打开调试窗口,选择“Security”选项卡:
宝塔面板开启SSL后站点相关问题汇总-BanYuner

然后直接F5刷新页面即可看到下面的界面:
宝塔面板开启SSL后站点相关问题汇总-BanYuner

通过上面的界面我们就可以看到,哪些我们引用的资源使用了HTTP的应用方式,那么我们需要做的事情就是将这些引用资源的路径修改为HTTPS即可,修改的方式有很多,但是我个人推荐的是直接般地通过文本工具一个个的修改,这里推荐的文本工具为sublime或者notepad++,使用方面需要一定的基础,搜索范围应该是整个主题,之后的操作就是一个个的将http替换为https。

这里可能有些人要说了,直接使用替换的插件不就可以了么?没错,是可以的,但是我说过的,学得的过程会让你进步,使用插件虽然爽一时,但是你什么都没有学到,至少在我看来,如果你是一个喜欢折腾的人,插件可能不会是你的首选。

总结

其实使用SSL之后的问题比较几种,无非就是无法访问或者没有小绿锁的问题,很多人是因为没有小绿锁有强迫证,比如我,那么只需要记住一点,你的站点想要小绿锁就代表你的站点安全,你的站点想要安全就不能存在不安全的链接或者不安全的引入,这个也算是对于上面的方法的总结了,大家开始尝试吧。

  • 官方微信公众号:BanYuner_offical 微信号:lao4jidididi
  • 官方微信公众号:BanYuner_offical