WordPress 从 HTTP 升级到 HTTPS
-
确保已经有了一个备案通过的域名地址，如果：yuandifly.com，一般的云服务商都可以购买，根据域名不同价格不同；
-
确保已经有了一个域名对应的证书，一般可以在服务商渠道申请一年免费的 SSL 证书；
-
确保已经正确安装 WordPress 并且通过 ip 地址和端口可以访问。如何安装可以看上篇
-
确保知道自己安装的 WordPress 的根目录以及数据库账号和密码，后面可能会用到；
配置 HTTPS
这里以网站 yuandifly.com 为例来给大家演示如何将网站升级为 HTTPS
服务器安装 nginx
运行命令yum install nginx 如上图所示，我这边已经安装过了，就不会再次安装，如果没有安装的话会自动安装。安装结束过后我们进入安装后的 nginx 目录 /etc/nginx 可以看到类似下面的内容。
将自己的 SSL 证书，拷贝到该目录下，然后通过 vim 我们开始编辑配置文件
vim nginx.config 参考下面的内容进行修改
#user nobody;
#error_log logs/error.log;
#error_log logs/error.log notice;
#error_log logs/error.log info;
#pid logs/nginx.pid;
user nginx;
worker_processes auto;
error_log logs/error.log;
pid /run/nginx.pid;
events {
worker_connections 1024;
}
http {
include mime.types;
default_type application/octet-stream;
log_format main '$remote_addr - $remote_user [$time_local] "$request" '
'$status $body_bytes_sent "$http_referer" '
'"$http_user_agent" "$http_x_forwarded_for"';
access_log logs/access.log main;
sendfile on;
#tcp_nopush on;
#keepalive_timeout 0;
keepalive_timeout 65;
upstream backend {
server localhost:port; # Tomcat/Jetty 原有的监听
}
server {
listen 80;
listen [::]:80;
server_name yuandifly.com www.yuandifly.com;
gzip on;
gzip_min_length 1k;
gzip_comp_level 2;
# 进行压缩的文件类型。javascript有多种形式。其中的值可以在 mime.types 文件中找到。
gzip_types font/ttf font/otf image/svg+xml text/plain application/javascript application/x-javascript text/css application/xml text/javascript application/x-httpd-php image/jpeg image/gif image/png;
# 是否在http header中添加Vary: Accept-Encoding，建议开启
gzip_vary on;
access_log off;
return 301 https://$server_name$request_uri; # 监听80端口，并将server_name全部转发
}
server {
listen 443 ssl http2; # 修改监听接口
listen [::]:443 ssl http2;
server_name yuandifly.com www.yuandifly.com
charset utf8; # 修改默认字符
ssl_session_timeout 5m;
ssl_protocols TLSv1 TLSv1.1 TLSv1.2;
ssl_ciphers ECDHE-RSA-AES128-GCM-SHA256:HIGH:!aNULL:!MD5:!RC4:!DHE;
ssl_prefer_server_ciphers on;
# 很重要！！！设定你的ssl证书
ssl_certificate "/etc/nginx/yuandifly.com_nginx/yuandifly.com_bundle.crt";
ssl_certificate_key "/etc/nginx/yuandifly.com_nginx/yuandifly.com.key";
# 重要！ 原有的接口代理可以不用修改，在内部使用http
location / {
proxy_pass http://backend;
proxy_redirect off;
proxy_set_header Host $host;
proxy_set_header X-Real-IP $remote_addr;
client_max_body_size 10m;
}
}
}
将上面内容中的 backend 下面的 server 后面的port 替换成自己的 wordpress 服务的端口，然后再将 ssl_certificate 和 ssl_certificate_key 替换成自己的证书名称。
这里我们解释一下该文件的内容，首先我们的目标是通过访问 https://yuandifly.com 打开我们的网站，这里有总共有四个情况分别是 http://yuandifly.com，http://www.yuandifly.com，https://yuandifly.com，https://www.yuandifly.com 四种情况，这四种情况都是正常的请教，我们都要能支持，前两种是 http 的形式，后两种是 https 的形式。
所以我们的思路也很简单，首先不管是 http 还是 https，我们的 server_name 都配置两个分别是不带 www 的和带 www，然后访问 http 的时候，我们直接将请求转发到 https 上，这样不管是访问哪个域名和端口，最后都会访问到 https 上面。
这里通过下面的内容，将 https 的流量在代理到原本的 WordPress 服务和端口上。
upstream backend {
server localhost:port; # Tomcat/Jetty 原有的监听
}
注意这里有两个不一样的地方，80 端口的流量我们是转发到 443，443 端口的流量我们是代理到原始的端口。一个会触发浏览器地址栏的变化，一个是不会触发地址栏的变化的。
另外在 backend 这里我们配置的主机地址是 localhost，这样就可以直接走内网，不需要配置外网的 ip 地址，这样的话我们对应端口就可以不用开放对外了，更加安全。
配置完了 nginx 的配置文件过后，我们启动 nginx 直接输入nginx 后回车即可，如果修改了配置文件的话是要重新 reload 配置的，通过命令nginx -s reload ，如果有的时候感觉配置没有生效，可以强制 kill 掉 nginx 重新启动 nginx试试。
修改 WordPress 访问地址
安装好了 nginx 过后，此时直接访问正常是不行的，因为 WordPress 本身还有一个站点配置，我们通过 ip 加端口的形式访问到后台，在设置这里可以看到有这个配置，同样的我们要改成 https://yuandifly.com。改完之后，网站会自动刷新，重新登录。
样式丢失
如果改完上面的内容能正常访问，那么恭喜你可以不看这一部分，但是如果进行上面的操作过后，发现网站的样式没有了，而且也登录不了了，那么接着往下看，解决这个问题需要以下几个步骤。
1、修改 functions.php 文件
打开网站根目录下 wp-includes/functions.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);
}
2、修改wp-config.php文件
打开根目录下 wp-config.php 文件，按照下面的位置添加代码：
// 在文件最上面的注释后面
$_SERVER['HTTPS'] = 'on';
define('FORCE_SSL_LOGIN', true);
define('FORCE_SSL_ADMIN', true);
// 在 require_once ABSPATH . 'wp-settings.php'; 这一行上面添加
define('CONCATENATE_SCRIPTS', false);
修改完代码过后，重新启动 WordPress 服务，即可正常访问。
评论