背景：公司做了一个公众号的网页项目，这个项目主要是用户扫码，填写信息。分为用户端和管理端。后端用的java,前端用的vue,刚开始的时候，是http访问项目。可是，用户反应http 在url 上提示不安全，体验不好，所以吧http 访问改成https。
操作概要：
首先说明一下，公司的服务器（windows），域名都是阿里云的。
前端vue项目放在tomcat 中，后端打的jar包。因为这次操作主要是针对这种情况。
首先去阿里云给对应的域名申请免费的ssl证书，证书有nginx tomcat apache 等。本次操作只使用了nginx的证书。通过ngxin 配置ssl证书，监听80 443 还有后端jar包的端口，进行请求的代理分发。
详细操作：
1 去阿里云的控制台输入ssl 购买免费证书。
2 购买证书时候，进行审核（想要给什么域名添加https请求添加上去）。审核通过之后，下载nginx的证书。
3 服务器配置nginx 证书。
3.1 在nginx 的根目录新建 cert 文件夹，然后把下载下载的nginx证书的解压之后的内容粘贴进去。
3.2 nginx.cnf 配置文件的配置。 在conf 文件夹下，有个nginx.conf 文件，复制到本地，用notepad++或者别 的编辑器打开。打开之后，修改配置文件，我的配置文件修改之后，是这样，你可以参考着对自己的配置文件进行修改
#user nobody; worker_processes 1; #error_log logs/error.log; #error_log logs/error.log notice; #error_log logs/error.log info; #pid logs/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; #gzip on; server { listen 80; #http 默认请求端口80 autoindex on; server_name lele.vip www.lele.vip; # 你要https 访问的网站的域名 index index.html index.htm index.jsp index.php; rewrite ^(.*)$ https://$host$1 permanent; # 通过这行代码，可以强制http请求重定向到https请求 location / { proxy_pass http://127.0.0.1:8080; #本地tomcat 启动的8080端口 proxy_set_header Host $host; #下面这三行是固定格式的，可以直接粘贴上去，你要是非常懂，也可以改 proxy_set_header X-Real-IP $remote_addr; proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for; proxy_set_header X-Forwarded-Proto $scheme; } #error_page 404 /404.html; # redirect server error pages to the static page /50x.html # # proxy the PHP scripts to Apache listening on 127.0.0.1:80 # #location ~ .php$ { # proxy_pass http://127.0.0.1; #} # pass the PHP scripts to FastCGI server listening on 127.0.0.1:9000 # #location ~ .php$ { # root html; # fastcgi_pass 127.0.0.1:9000; # fastcgi_index index.php; # fastcgi_param SCRIPT_FILENAME /scripts$fastcgi_script_name; # include fastcgi_params; #} # deny access to .htaccess files, if Apache's document root # concurs with nginx's one # #location ~ /.ht { # deny all; #} } # another virtual host using mix of IP-, name-, and port-based configuration # #server { # listen 8000; # listen somename:8080; # server_name somename alias another.alias; # location / { # root html; # index index.html index.htm; # } #} # HTTPS server # #server { # listen 443 ssl; # server_name localhost; # ssl_certificate cert.pem; # ssl_certificate_key cert.key; # ssl_session_cache shared:SSL:1m; # ssl_session_timeout 5m; # ssl_ciphers HIGH:!aNULL:!MD5; # ssl_prefer_server_ciphers on; # location / { # root html; # index index.html index.htm; # } #} server { listen 443; # https 请求默认走443端口 server_name lele.vip www.lele.vip; # 你要https 访问的网站的域名 ssl on; root html; index index.html index.htm; ssl_certificate cert/3198158_lele.vip.pem; #放在conf目录下后为a.pem; ssl_certificate_key cert/3198158_lele.vip.key; #放在conf目录下后为a.key; ssl_session_timeout 5m; ssl_ciphers ECDHE-RSA-AES128-GCM-SHA256:ECDHE:ECDH:AES:HIGH:!NULL:!aNULL:!MD5:!ADH:!RC4; ssl_protocols TLSv1 TLSv1.1 TLSv1.2; ssl_prefer_server_ciphers on; location / { #root html; #index index.html index.htm; proxy_pass http://127.0.0.1:8080; proxy_set_header Host $host; proxy_set_header X-Real-IP $remote_addr; proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for; proxy_set_header X-Forwarded-Proto $scheme; } # location ^~ /dayuhaitang { #这个locatin 解开注释，nginx 就可以吧https://lele.vip/dayuhaitang 这个请求装发到 另一台服务器的上项目上 http://xxx.xx.xx.xx:80/dayuhaitang; #root html; #index index.html index.htm; # proxy_pass http://xxx.xx.xx.xx:80/dayuhaitang; # proxy_set_header Host $host; # proxy_set_header X-Real-IP $remote_addr; # proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for; # proxy_set_header X-Forwarded-Proto $scheme; # } #location /xisanfengguang { #root html; #index index.html index.htm; # proxy_pass http://xxx.xx.xx.xx:80/xisanfengguang; # proxy_set_header Host $host; # proxy_set_header X-Real-IP $remote_addr; # proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for; # proxy_set_header X-Forwarded-Proto $scheme; # } } #spring boot 项目的 https的配置 server { listen 8091; # 监听端口 这端口是，前端 https://lele.vip:8091 的端口，因为nginx 监听这个端口之后，会占用这个端口。springboot 就开启8071 的端口就好，就是下面的proxy_pass http://127.0.0.1:8071; ssl on; server_name lele.vip www.lele.vip; # 域名配置，可以多个 ssl_certificate cert/3198158_lele.vip.pem; # 证书地址 ssl_certificate_key cert/3198158_lele.vip.key; # 证书地址 # 固定写法------------- ssl_session_cache shared:SSL:1m; ssl_session_timeout 5m; ssl_protocols TLSv1 TLSv1.1 TLSv1.2; ssl_ciphers EECDH+CHACHA20:EECDH+CHACHA20-draft:EECDH+AES128:RSA+AES128:EECDH+AES256:RSA+AES256:EECDH+3DES:RSA+3DES:!MD5; ssl_prefer_server_ciphers on; # 这里配置反向代理的项目 location / { proxy_pass http://127.0.0.1:8071; # 固定写法------------- proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for; proxy_set_header X-Forwarded-Proto $scheme; proxy_set_header X-Forwarded-Port $server_port; } } #spring boot 项目的 https的配置 server { listen 8092; # 监听端口 ssl on; server_name lele.vip www.lele.vip; # 域名配置，可以多个 ssl_certificate cert/3198158_lele.vip.pem; # 证书地址 ssl_certificate_key cert/3198158_lele.vip.key; # 证书地址 # 固定写法------------- ssl_session_cache shared:SSL:1m; ssl_session_timeout 5m; ssl_protocols TLSv1 TLSv1.1 TLSv1.2; ssl_ciphers EECDH+CHACHA20:EECDH+CHACHA20-draft:EECDH+AES128:RSA+AES128:EECDH+AES256:RSA+AES256:EECDH+3DES:RSA+3DES:!MD5; ssl_prefer_server_ciphers on; # 这里配置反向代理的项目 location / { proxy_pass http://127.0.0.1:8072; # 固定写法------------- proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for; proxy_set_header X-Forwarded-Proto $scheme; proxy_set_header X-Forwarded-Port $server_port; } } }
4 把springboot 项目打jar包放在服务器上。用java -jar +项目名启动。前端的vue项目放在tomcat中，启动。这样再访问网站时就是https了。
关于nginx的配置可以参考以下文章：
nginx location 的配置 https://www.cnblogs.com/xiaoliangup/p/9175932.html
nginx 配置https https://www.cnblogs.com/zmsn/p/11644053.html
以上两篇 文章 都是自己临时，找的，不懂的同学可以根据自己情况找点别 的文章。
5 项目中遇到的坑
5.1 域名要解析到ip，后端被访问的端口要打开 刚开始的时候，前段的url是https://lele.vip:8096/xxx/xxx/xx 谷歌浏览器访问项目，项目有登陆功能，每次点击登陆按钮，都显示 Provisonal header are shown。 用火狐浏览器，访问就是 浏览器阻止了跨区域请求。
第一次，遇到这个问题的时候，以为是跨域问题，自己检查了很多代码，后端明明配置了允许跨域，前端也做了部分的处理，怎么还是报跨域错误。请教大佬，大佬问我 你服务器的端口打开了吗？
我用tcpinng 这个工具 测试 39.96.xx.xx:8091 端口是打开的。可是 lele.vip:8091 端口却是关闭的，才发现，是阿里云解析域名的时候，域名没有解析到ip。域名解析到这个ip 然后再在阿里云 的安全组那里放开后端需要访问的端口，项目才访问到。
5.2 通过测试，发现多个tomcat 是可以用一套 ssl 安全证书的。因为刚开始的时候，想 的是直接在tomcat中配置https 访问，可是因为没有走通，折腾了一段时间，才使用的nginx 作为代理服务器。
6 工作总结：
6.1 不要随便放弃吧。 说实话，在配置https的过程，当端口没有打开，可是自己一直在找跨域问题的时候，很长时间都没有任何进度都想放弃了。实在没有思路，可以出去散散步，然后和同事沟通一下，反而起到不错的效果。这次问题，能顺利解决，还是同事和一个大佬沟通，大佬慧眼如炬，一下子，就发现了问题所在。
6.2 工具顺手，效率更高。