个人网站搭建系列(四)- 域名证书篇

本文档介绍了购买域名、域名备案、SSL 证书等。

1 购买域名

在阿里云或腾讯云购买域名,实名认证之后下载域名证书。

image-20230327204440021

2 域名备案

在云服务器提供商那里进行域名备案,比如腾讯云购买的云服务器就在腾讯云进行备案,域名可以使用其他提供商的,两者不冲突。

  • 填写网站名称、备注时,不要出现敏感、可互动的词汇,比如博客等;
  • 域名实名认证截图就上传下载好的域名证书。

3 申请 SSL 证书

在域名提供商申请免费的证书。

image-20230327210238560

下载证书,选择 Nginx 类型的 pem/key 格式下载,你也可以选择其他的格式,跳过后面的步骤。

4 安装 nginx

准备 nginx 配置

mkdir -p /etc/nginx/cert
touch /etc/nginx/nginx.conf

将下载的两个证书文件上传到 /etc/nginx/cert

编辑 nginx.conf 文件,注意修改你的域名和证书地址

user  root;
worker_processes  1;
events {
    worker_connections  1024;
}
http {
    include            mime.types;
    default_type       application/octet-stream;
    sendfile           on;
    keepalive_timeout  65;
    server {
        listen         80;
        server_name    你的域名;            
        rewrite ^(.*)$ https://你的域名:443/$1 permanent;   #将所有http请求通过rewrite重定向到https。
    }
    # HTTPS server
    server {
        listen       443 ssl;
        server_name  你的域名;
        ssl_certificate      cert/你的证书地址;
        ssl_certificate_key  cert/你的证书地址;
        ssl_session_cache    shared:SSL:10m;
        ssl_session_timeout  15m;
        ssl_ciphers  HIGH:!aNULL:!MD5;
        ssl_prefer_server_ciphers  on;
        location / {
          proxy_pass http://124.222.9.112:8080;
          proxy_set_header Host $host;
          proxy_set_header X-Forwarded-Proto $scheme;
          proxy_set_header X-Real-IP $remote_addr;
          proxy_set_header X-Forwarded-For       $proxy_add_x_forwarded_for;
        }
    }
}

使用 docker 安装 nginx

mkdir -p /etc/nginx/cert
touch /etc/nginx/nginx.conf
docker run --name nginx -p 80:80 -p 443:443 \
 -v /etc/nginx/nginx.conf:/etc/nginx/nginx.conf \
 -v /etc/nginx/cert:/etc/nginx/cert \
 -d nginx

5 Q&A

Q: 开启 SSL 后无法登录进入管理员后台
A: 编辑 wp-config.php (注:添加在if ( !defined('ABSPATH') ) 代码之前才能生效)

/**强制使用SSL/HTTPS访问后台以及登录**/
define('FORCE_SSL_ADMIN', true);
define('FORCE_SSL_LOGIN', true);

/**请求标头告知**/
if (isset($_SERVER['HTTP_X_FORWARDED_PROTO']) 
    && $_SERVER['HTTP_X_FORWARDED_PROTO'] === 'https') { 
    $_SERVER['HTTPS'] = 'on'; 
}

Q: 开启 SSL 后,JS/CSS 不加载
A: 找到 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);
}

留下评论