HTTP升级HTTPS全过程,Nginx配置平滑升级

919 阅读4分钟

HTTP是明文请求的,它的域名、路径和参数都被中间人看得一清二楚。你可以使用 Google 浏览器打开一个 HTTP 协议网站,会发现 Chrome 在网址的左边将这个网站标记为不安全。Google鼓励所有的网站都要使用HTTPS,随着各大巨头对网络安全的重视,对用户隐私的重视,是时候研究下HTTPS了。

在Google Chrome版本v68.0.3440.75之后,当在加载非HTTPS站点时,都会在地址栏上明确标记为“Not Secure(不安全)”。这不止是一个标记而已,它代表着信息的安全,所以HTTPS变得越来越重要了。 话说回来HTTPS证书可是一笔不小的费用,很多人倍感无力, 负担不起。 但是现在有很多科技大厂相继推出了免费证书了,如阿里云、腾讯云、Let's Encrypt等等,当然这是有期限的,一般都是一年左右,不过个人也够用了,也挺好申请的。

下面就详细介绍如何白嫖阿里云证书,话不多说,直接上才艺。

必要准备

  • 注册阿里云账号,还没注册的小伙伴点我
  • 拥有自己的域名。(我的域名blog.ydydydq.cn,也备案了,嘿嘿)
  • 服务器,装上Nginx,阿里云申请证书会先校验一下域名,后续也用于配置HTTPS的相关东西。

重点头戏

一、申请阿里云免费证书

  • 搜索栏输入SSL 微信图片_20201012103539.png

  • 选择选购证书 微信图片_20201012104359.png

  • 选择单个域名--DV域名级SSL--免费版,就可以看到底下是0.00元,点击购买即可 微信图片_20201012104753.png

  • 支付成功后会提示,购买好了后,我们就可以去证书控制台申请证书 微信图片_20201012110515.png

  • 点击申请证书 微信图片_20201012111057.png

  • 之后右边弹窗,填上对应的信息,点击下一步 微信图片_20201012111936.png

  • 点击下载专有验证文件(不要关闭网页,等等需要回来点击验证按钮),解压,我可以得到一个fileauth.txt文件 微信图片_20201012112556.png

二、验证域名

  • 之后我们前往我们的服务器,在root目录下,新建两个文件夹.well-known/pki-validation,然后将刚刚的fileauth.txt文件上传其中(连接服务器我使用一款图形化工具WinSCP,也可以命令行创建操作,具体就自行百度咯,不要问我,问,我也不知道,哈哈)(温馨提示:window查看隐藏文件快捷键Ctrl+alt+h;mac快捷键command+shift+.) 微信图片_202010121128511.png

  • 建好文件夹,上传好专有文件,接下来我们就要稍微改一下Nginx的配置了,找到nginx的配置文件,设定一下root的路径,然后重启一下Nginx,然后回到网页,点击页面的“验证”按钮,只要验证成功,我们就能下载到证书了(没有验证通过的同学要仔细检查一下Nginx的配置是否正常哦,也欢迎给我留言联系我) 微信图片_20201012115246.png 微信图片_20201012124232.png

三、下载证书、上传证书到服务器、配置Nginx

  • 只要通过了验证,我们就能在网页上下载对应的证书,解压下载的压缩包,我们能得到以.ken和.pem结尾的两个文件了 微信图片_20201012115914.png 微信图片_20201012115920.png

  • 我们将这两个文件在服务器随便找个地方放吧,等等填上对应的路径就行了 微信图片_20201012120545.png

  • 最后一步,配置一下Nginx,主要是443端口,然后重启一下Nginx就大功告成了,下面贴一下配置吧

server {
  listen 443 ssl; # 服务器监听443端口并启用SSL协议
  server_name blog.ydydydq.cn;

  ssl on;
  ssl_certificate /etc/nginx/conf/xxxxxx.pem;  # 数字证书路径
  ssl_certificate_key /etc/nginx/conf/xxxxxx.key;  # 密钥对路径
  ssl_session_cache shared:SSL:1m;
  ssl_session_timeout 5m;
  ssl_ciphers HIGH:!aNULL:!MD5; # 支持的密码套件列表
  ssl_prefer_server_ciphers on;
	
  location / {
    root /home/blog-ui;
    index  index.html index.htm;
  } 
}

踩坑

坑一

在我完成以上操作后,第一次访问blog.ydydydq.cn/,其实看到的是这样子的画面。 微信图片_20201012122824.png 好吧,接口都挂了,一片红。因为原来博客所有接口都是走的8026端口,源代码还没动过,说好的Nginx配置平滑升级呢?Em......行吧,赶紧上谷歌找找原因先,一翻搜索,主要原因说“https下不能发送http请求”行吧,具体缘由,小伙伴们就自行搜索学习去吧。 还是聊回如何解决吧,我想既然用到了Nginx了,直接转发一下所有接口请求就行了嘛,so easy。 首先我得先给所有接口加个统一前缀标识,Em...加上了/api 代表是接口过来了。 然后再改了一下Nginx的配置,如下

server {
  listen 443 ssl; # 服务器监听443端口并启用SSL协议
  server_name blog.ydydydq.cn;

  ssl on;
  ssl_certificate /etc/nginx/conf/xxxxxx.pem;  # 数字证书路径
  ssl_certificate_key /etc/nginx/conf/xxxxxx.key;  # 密钥对路径
  ssl_session_cache shared:SSL:1m;
  ssl_session_timeout 5m;
  ssl_ciphers HIGH:!aNULL:!MD5; # 支持的密码套件列表
  ssl_prefer_server_ciphers on;
	
  location / {
    root /home/blog-ui;
    index  index.html index.htm;
  } 

  # 转发后端接口	
  location /api/ {
    proxy_pass http://blog.ydydydq.cn:8026/;
  } 
}

重启Nginx,再次访问blog.ydydydq.cn/ Em...还行,接口都正常了,成功了,哈哈~

PS:小白初文,文笔不好,望大佬轻喷,俺只是单纯为了混缸子来的而已。