springboot+vue+nginx 配置Https访问——自签名证书验证

Posted 2022-01-02 sosuyoung

有段时间没更新了，今天和大家分享一下关于项目配置HTTPS的问题

1、HTTP与HTTPS的区别

HTTP是一网络中的超文本传输协议，是用于在Web浏览器和应用服务器之间进行数据传输的。HTTP的传输方式是以一种明文的方式进行，并不进行任何的加密处理，这样的方式容易攻击者拦截或者截取传输内容，所以在为了使得在传输过程中处于安全状态下，在HTTP的基础上添加了SSL/TCL协议，这个协议概括来说就是服务端要需要通过一个证书来对客户端进行一个校验，并且对传输的内容进行一个加密处理，这就是HTTPS了。

2、SpringBoot、Nignx和客户端之间的验证过程

一般来讲，我们无需在开发环境下进行HTTPS的设置，当然我也进行了一下配置，但是发现SpringBoot+vue的环境下，服务端配置好了HTTPS，通过Postman配置的客户端证书，可以进行访问接口，但是在浏览器配置了很多，但一直访问不通。于是我便直接在生产上进行了配置，这里说明一下生产上的验证流程

我们从客户端访问nignx暴露的端口时，客户端和nginx会同时验证对方的证书，从而保证HTTPS协议的通行，如果你需要从nignx代理到应用服务器的接口也是HTTPS的话，那么就需要在代理转发的时候把证书信息也发给我服务端，让服务端进行校验。（这也是最终的一步，会面我们会讲到）

3、生成证书

自签名证书是我们这里选择通过jdk自带的keytool工具进行生成，当然你也可以选择其他方式，现在，阿里、腾讯等都有免费的证书提供下载。

1. 生成服务端证书

keytool -genkey -alias server -keypass 123456 -keyalg RSA -keysize 1024 -validity 365 -keystore [你的地址]/server.keystore -storepass 123456

-alias（别名）
-keypass（别名密码）
-keyalg（算法）
-keysize（算法长度）
-validity（有效期，天）
-keystore（地址）
-storepass（keystore文件的密码）

输入上述命令后，会填一些信息，其他信息都无所谓，其中比较关键的是名字与姓氏一项，这一项如果有域名这里可以填写域名，如果没有建议填写localhost，如果填写指定IP地址，可能会导致证书验证不通过。

1. 生成客户端证书

keytool -genkey -alias client -keypass 123456 -keyalg RSA -storetype PKCS12 -keypass 123456 -storepass 123456 -keystore [你的地址]/client.p12

这里建议客户端直接生成PKCS12格式的，方便直接在浏览器中添加。
2. 分别导出客户端cer证书和服务端cer证书

keytool -export -alias client -keystore [你的地址]/client.p12 -storetype PKCS12 -keypass 123456 -file [你的地址]/client.cer

keytool -keystore [你的地址]/server.keystore -export -alias server -file [你的地址]/server.cer

3. 服务端证书导入客户端的公钥让其信任客户端

keytool -import -v -file [你的地址]/client.cer -keystore [你的地址]/server.keystore -storepass 123456

4. 在浏览器中分别导入客户端cer证书和服务端cer证书
   分别双击刚刚导出的两个cer证书文件，导入后，将两个证书文件分别修改为始终信任，mac上显示简介即可修改，windows上右键属性也可修改。

4、为SpringBoot项目配置HTTPS

把刚刚生成的server.keystore文件放在你项目的resources文件夹下面，并在你的application.yml文件中添加如下配置

server:
	ssl:
	  enabled: true
      key-store-type: JKS
      key-store: classpath:server.keystore
      key-store-password: 123456
      key-alias: server
      trust-store: classpath:server.keystore
      trust-store-password: 123456
      trust-store-provider: SUN
      trust-store-type: JKS
      client-auth: need

5、Nginx安装SSL模块

因为我们是在Linux进行部署，所以这里需要保证Linux已经安装了openssl冰洁Nginx安装了SSL模块，如何判断自己的Nginx是否安装了SSL和如何安装SSL模块，大家可以参考
https://blog.csdn.net/qq_31275085/article/details/105026331

6、Nginx配置HTTPS

1.提取key文件和pem文件
首先将我们刚刚生成的client.p12文件进行提取，提取成crt文件和pem文件 ，看了不少关于通过openssl明林进行提取的，略感麻烦，这里给大家推荐一个网站，可以直接进行下载提取，只不过在我们的电脑上在这个网站上转换后，点击下载没有反应，大家可以F12打开开发者工具，提取下载链接，在新页面打开，即可下载，下载解压后里面有三个文件，其中chain文件不用管，剩下的就是我们需要的key和pem文件
https://www.itrus.cn/service_caChange.html
2. nginx.conf文件的配置
首先在nginx/config/中创建cert文件夹，然后把上一步中得到的key和pem文件上传上去。
然后修改nginx.conf文件，下面是修改的地方，这里只显示关于HTTPS的配置。

server 
		listen       [端口] ssl;
        server_name  localhost;
        #证书存放地址
        ssl_certificate         cert/client.pem;（这里写你放证书的地址）
        ssl_certificate_key     cert/client.key;
        ssl_client_certificate  cert/client.pem;
        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;
        ...
        location ~ /api 
            proxy_pass   https://[接口IP]:[端口];
            # 这里是重点，如果上面的proxy_pass写成https的话这段是必须要配置的，不然只能访问页面，而页面调用端口不行
            proxy_ssl_certificate     cert/client.pem;
            proxy_ssl_certificate_key cert/client.key;
            proxy_ssl_protocols       TLSv1 TLSV1.1 TLSv1.2;
            proxy_ssl_ciphers         ECDHE-RSA-AES128-GCM-SHA256:HIGH:!aNULL:!MD5:!RC4:!DHE;
            proxy_ssl_session_reuse  on;
            proxy_redirect off;
            ############
            proxy_set_header Host $proxy_host;
            proxy_set_header X-Real-IP $remote_addr;
            proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
            proxy_set_header X-Nginx-Proxt true;
            proxy_set_header HTTP_X_FORWORDED_FOR $remote_addr;
        
        ...

到这里就完美结束了，有什么疑问，欢迎大家留言！