解决CDN加速502 Error|SSL问题|浏览器链接左侧显示“您与此网站之间建立的连接并非完全安全”

本文最后更新于 2024-04-16，文章内容可能已经过时。

前言

这是这个博客刚刚经历过的问题，解决后分享给大家，说不定有需要呢？

环境

CDN加速，SSL证书认证，WordPress，宝塔面板

本文中将会解决的问题

无限重新定向
SSL证书配置正确但没有生效
SSL证书生效但显示“您与此网站之间建立的连接并非完全安全”
CDN加速后导致502 ERROR
由“您与此网站之间建立的连接并非完全安全”导致的WordPress主页样式丢失
WordPress后台无法进入，自动跳转到https

无限重新定向

无限重新定向发生的时候看起来例如下图：

QQ图片20200326000645-281x300.png

当出现这种情况时，检查服务器中是否和CDN同时开启了强制https或者301重定向问题。

SSL证书配置正确但没有生效

当我的博客发生了这个问题的时候，我纠结了非常久，但只是因为一个小失误。

这个博客是使用我自己的实体服务器搭建的，在搭建时使用了两个路由器，一个是主路由器，然后从主路由器中扯出一根线连接到Google Wifi然后再由Google Wifi中的Ethernet口再扯一根线到这台Linux服务器上，因此存在着三个端口开放规则！一个是主路由器，一个是Google Wifi，一个是当前的Linux服务器

当初我犯这个错误的时候什么看起来都没有问题，自己的SSL证书验证了很多次都没有问题，直到最后我才发现主路由器没有开放用于SSL验证的443端口。所以当出现配置完全正确，但SSL不生效时请一定先检查你所有的端口开放规则！保证443端口畅通无阻！！！

SSL证书生效但显示“您与此网站之间建立的连接并非完全安全” 和由“您与此网站之间建立的连接并非完全安全”导致的WordPress主页样式丢失

这又是一个很常见的问题，并不是SSL证书安装完就可以完事的，关于这两个问题，是可以一起说的，倒不如说他们是因果关系。

https可以访问，WordPress页面也出来了,但是浏览器链接左侧显示“您与此网站之间建立的连接并非完全安全”，并且WordPress的样式丢失了。

那么我这里利用Chrome浏览器举个栗子，在你的页面中点击鼠标右键，在菜单中选择检查，或者使用组合键Ctrl+Shift+I

在右侧中找到Console(控制台)，点击进去之后你应该可以看到如下图所示的样子：

图示1

并且你的网页链接左侧显示(看到证书也是有效的):

图示2

在图示1中可以看出请求的CSS还是http开头，就是因为调用了http,因此才会不完全安全，哪怕你拥有SSL证书，而事实也是如此。

在图示1中也可以看出请求的正式CSS格式的样式文件，但是被浏览器阻拦(Block)了，这时需要对WordPress进行以下操作。

以CentOS为例，首先使用Linux指令cd指定到WordPress的安装目录(如果你是宝塔那就简单多了)

假如我的根目录在/xxx/wwwroot/japerz.com,则使用指令

cd /xxx/wwwroot/japerz.com

基础指令我就不多说了。在你的根目录下输入

vi wp-config.php

会打开一个文档，如下图示:

敲击i键进入insert模式，在图示中的

* @package WordPress
*/

下方加上:

$_SERVER['HTTPS'] = 'on';
define('FORCE_SSL_LOGIN', true);
define('FORCE_SSL_ADMIN', true);

之后按ESC键，输入 :wq 保存并退出。

随后我们继续使用指令

cd wp-includes/

从当前的根目录继续打开wp-includes目录，使用指令

vi functions.php

编辑 functions.php文件

找到

require( ABSPATH . WPINC . '/option.php' );

然后在它的下方添加

add_filter('script_loader_src', 'agnostic_script_loader_src', 20,2); 
function agnostic_script_loader_src($src, $handle) { 
return preg_replace('/^(http|https):/', '', $src); 
} 
add_filter('style_loader_src', 'agnostic_style_loader_src', 20,2); 
function agnostic_style_loader_src($src, $handle) { 
return preg_replace('/^(http|https):/', '', $src);
}

随后按ESC键，输入:wq 保存并退出。

自此问题应当被修复:D

WordPress后台无法进入，自动跳转到https

如果出现这个问题则是太急着弄SSL证书了，在Https生效之前就在站点设置中将自己的URL换到了https。

鉴于无法从后台登录修改，我比较建议使用数据库管理软件直接修改，这里示范使用PhpMyAdmin

打开搭建WordPress时使用的数据库，看起来应该是这样的：

我们打开wp_options这个表，在里面找到option_name列中的siteurl和home,在后面将之前急急急的时候加上去的https先暂且改到http,待https配置完成后再改到https!

至此问题解决。

CDN加速后导致502 ERROR

在CDN的源站设置中的回源协议从HTTPS改为HTTP,源站地址使用数字外网IP。

在管理域名的DNS中设置解析CNAME至你的数字外网IP至CDN。

至此问题解决。

注意，最好不要使用二级域名，我这边试了一下出了很多问题= =包括证书以及无法准确解析的问题!总而言之就是很乱！

后记

看起来杰帕斯の小窝还真是多灾多难啊

不过这些终将成为我学习路中的经验