从http迁移到https全流程（nginx+koa2

目录

1、前提

2、获取ssl证书

3、配置nginx

4、配置node

5、修改前端

1、前情提要

首先还是得需要拥有一个服务器，各家得云服务器都行，我这里用的是阿里云的服务器作为示范

2、获取ssl证书

在控制台搜索“ssl免费证书”然后进入首页找到免费证书然后跟着流程申请即可。

申请到证书后，点击右边的下载，根据你使用的引擎下载对应文件即可。

3、配置nginx

这里以nginx为例，解压文件后找到nginx目录下conf/新建cert文件夹，将两个文件粘贴进去。

然后打开conf/nginx.conf文件

添加（修改为）以下代码：

#以下属性中，以ssl开头的属性表示与证书配置有关。
server {
    listen 443 ssl;
    #配置HTTPS的默认访问端口为443。
    #如果未在此处配置HTTPS的默认访问端口，可能会造成Nginx无法启动。
    #如果您使用Nginx 1.15.0及以上版本，请使用listen 443 ssl代替listen 443和ssl on。
    server_name yourdomain;
    root html;
    index index.html index.htm;
    ssl_certificate cert/cert-file-name.pem;  //cert下的文件名
    ssl_certificate_key cert/cert-file-name.key;  //cert下的文件名
    ssl_session_timeout 5m;
    ssl_ciphers ECDHE-RSA-AES128-GCM-SHA256:ECDHE:ECDH:AES:HIGH:!NULL:!aNULL:!MD5:!ADH:!RC4;
    #表示使用的加密套件的类型。
    ssl_protocols TLSv1.1 TLSv1.2 TLSv1.3; #表示使用的TLS协议的类型，您需要自行评估是否配置TLSv1.1协议。
    ssl_prefer_server_ciphers on;
    location / {
        root html;  #Web网站程序存放目录。
        index index.html index.htm;
    }
}

到目前为止已经配置好了，但是还不能使用，因为你现在前端还是访问的http，这个时候需要新添加一个server来重定向访问这个服务器的http请求。（当然，你也可以到前端代码修改请求网址）

server {
    listen 80;
    server_name yourdomain; #需要将yourdomain替换成证书绑定的域名。
    rewrite ^(.*)$ https://$host$1; #将所有HTTP请求通过rewrite指令重定向到HTTPS。
    location / {
        index index.html index.htm;
    }
}

重启nginx，nginx部分完成。

./nginx -s reload

4、配置node

将证书文件放入node文件夹下，然后创建一个对象保存起来，后续会修改createserver。

const options = {
  key: fs.readFileSync('./ssl/xxx.key'),
  cert: fs.readFileSync('./ssl/xxx.pem'),
};

node部分，需要添加以下模块

https：内置模块不需要手动下载

koa-sslify:  npm i -s koa-sslify(需手动添加)

const https = require('https'); //https服务
const sslify = require('koa-sslify').default;//http强制HTTPS

app.use(sslify())

创建服务需修改为：

//options为上面保存的证书数据
https.createServer(options, app.callback()).listen(3001, () => {
  console.log('https:::跑在3001端口');
});

node部分配置完成

5、前端部分

如果你在nginx配置部分对于重定向配置有问题，可以用一下方法解决

   // 自动转https  
   <meta http-equiv='Content-Security-Policy' content='upgrade-insecure-requests'>

或者将axios的前缀http->https

结束

我的个人博客hyyyh.top