HTTPS的原理浅析与本地开发实践（下）
本文将以阿里云证书配置和OpenSSL自签证书配置两种方式来让你的网站从HTTP转换到HTTPS，为系列第二篇，第一篇：HTTPS的原理浅析与本地开发实践（上）。希望这两篇关于HTTPS的浅析能够对你的日常研发过程有所帮助。
—— 以阿里云免费SSL证书申请过程为例
方案一：使用OpenSSL工具生成CSR文件
openssl req -new -nodes -sha256 -newkey rsa:2048 -keyout [$Key_File] -out [$OpenSSL_CSR]-new：指定生成一个新的CSR文件。
-nodes：指定密钥文件不被加密。
-sha256：指定摘要算法。
-newkey rsa:2048：指定密钥类型和长度。
[$Key_File]：密钥文件名称。
[$OpenSSL_CSR]：加密后文件的存放路径。
根据系统返回的提示，输入生成CSR文件所需的信息。以下是关于提示的说明：
Organization Name：公司名称，可以是中文或英文。
Organization Unit Name：部门名称，可以是中文或英文。
Country Code：申请单位所属国家，只能是两个字母的国家码。例如，中国只能是CN。
State or Province：州名或省份名称，可以是中文或英文。
Locality：城市名称，可以是中文或英文。
Common Name：申请SSL证书的具体网站域名。
Email Address：可选择不输入。
A challenge password：可选择不输入。
完成命令提示的输入后，当前目录下获取密钥文件和CSR文件
另外一种是自己在文本中编辑好config，作为参数应用之：
[ req ]default_bits = 2048distinguished_name = req_distinguished_namereq_extensions = req_ext[ req_distinguished_name ]countryName = Country Name (2 letter code)stateOrProvinceName = State or Province Name (full name)localityName = Locality Name (eg, city)organizationName = Organization Name (eg, company)commonName = Common Name (e.g. server FQDN or YOUR name)[ req_ext ]subjectAltName = @alt_names[alt_names]DNS.1 = bestflare.comDNS.2 = usefulread.comDNS.3 = chandank.com
方案二、使用线上工具生成CSR
—— 在线生成地址：https://myssl.com/csr_create.html
▐ 阿里云申请过程
进入阿里云官网数字证书管理栏目（https://www.aliyun.com/product/cas），开始【选购SSL证书】，找到【免费证书】栏目，开始创建新证书。
填写证书申请表单 (当时的申请流程是按照www.ccdoit.com域名走的，但是后续配置时将该证书删除，所以最后用了ssl.ccdoit.com域名重新申请了，忘了截图......) 服务信息校验 登录域名对应的服务器，并上传认证文件 返回操作页面提供CA签发申请，等待审核 信息认证成功后，服务商会生成多种类型的证书 下载Nginx版本证书，并登录服务器后台，配置Nginx即可； 查看访问结果
至此，基于阿里云免费数字证书配置Nginx私服的过程就这么多。下面会再介绍一种开发过程中经常用到的证书配置方式。
在日常的开发中，使用OpenSSL工具生成自签证书的方式来配置HTTPS协议是比较常用的一种方案，下面就开始对这个配置过程做一个详细的介绍。
OpenSSL工具一般会预装在系统中，如果系统中缺少该工具，请自行安装。
生成CSR文件（参考上文的CSR文件生成方式，或者直接修改下面的csr.config配置，核心是修改alt_names下的DNS配置）
[req]default_bits = 2048distinguished_name = req_distinguished_namereq_extensions = req_extx509_extensions = v3_ca[req_distinguished_name]countryName = CNcountryName_default = CNstateOrProvinceName = ZJstateOrProvinceName_default = ZJlocalityName = HZlocalityName_default = HZorganizationName = FEorganizationName_default = FEorganizationalUnitName = ITorganizationalUnitName_default = ITcommonName = ccCrtcommonName_default = ccCrtcommonName_max = 64[req_ext]subjectAltName = @alt_names[v3_ca]subjectAltName = @alt_names[alt_names]DNS.1 = *.lanchen.comDNS.2 = *.lanchen.cn使用OpenSSL命令行生成自签证书和私钥
# 生成自签名证书openssl req -x509 -nodes -days 365 -newkey rsa:2048 -keyout server.key -out server.crt -config csr.执生完成后，会得到证书文件（server.crt）和秘钥串（server.key）
然后将生成的server.crt证书添加到系统证书，并修改证书信任为【始终信任】
证书简介
在本地的Nginx端，增加私钥和证书配置即可。
修改本地host，增加期望存储登录态域名映射
127.0.0.1 demo.lanchen.com127.0.0.1 demo.lanchen.cn访问host域名，查看证书状态(访问 https://demo.lanchen.com 也会使用到该证书)
本地服务带端口的Nginx配置方案 到第6步为止，本地配置HTTPS协议的过程基本完成，但是在日常的开发工作中，Vite/Webpack Server启动时默认都会携带服务端口（3000），形如： 如果直接通过配置的域名后加端口是行不通的，例如直接通过 https://demo.lanchen.cn:3000 是无法访问到该服务的，那如何在Nginx层解决端口配置的问题？答案是通过在nginx.conf中增加一个端口变量来拼接代理的实际路径。 Nginx文件配置如下 server {listen 443 ssl;server_name ~^(?<port>.+).lanchen.cn$;ssl_certificate ssl-test/server.crt;ssl_certificate_key ssl-test/server.key;ssl_session_cache shared:SSL:1m;ssl_session_timeout 5m;ssl_ciphers HIGH:!aNULL:!MD5;ssl_prefer_server_ciphers on;location / {proxy_pass http://127.0.0.1:$port;}}host中增加待访问的域名
127.0.0.1 3000.lanchen.cn
br结果验证
如果生成的证书不指定DNS扩展会出现什么问题？ 自签证书不添加信任会出现什么问题？
本篇文章先通过阿里云提供的免费数字证书配置过程，完成了线上Nginx私服的HTTPS协议配置，然后又基于OpenSSL工具生成自签证书，解决本地开发环境依赖HTTPS协议的情况。相信基于第一篇关于HTTPS的理论介绍，你应该很容易就能理解本篇的配置过程。希望这两篇关于HTTPS的浅析能够对你的日常研发过程有所帮助。