前端开发本地调试HTTPS浏览器信任问题解决

 1. 引言

难题较为广泛，特别是在是针对我们的新手们而言；那麼到底有什么一劳永逸的方法呢？是有的，文中仅仅 一个具体实例，别的一切相近的难题都能够根据改动自签字资格证书转化成指令中相对的主要参数获得处理。 

2. 解决过程

1. 生成自签名证书
2. 将自签名证书添加到浏览器信任
3. 使用新的证书启动fekit 或者 ykit 本地 server

1.OpenSSL是一个开源项目

2.OpenSSL是一个健壮的、商业级别的、全功能的针对TLS(Transport Layer Security)和SSL(Secure Sockets Layer)的工具集

3.OpenSSL也是一个通用的密码学的类库，实现了各种加解密算法

生成自签名证书的过程比正式的签发证书过程要简单，因为证书请求和证书签发者是同一个（这才叫自签名），所以这个生成证书请求文件和签发的过程可以一步到位，-x509 这个选项就是干这事的。

2.3 生成简单单个主域的自签名证书

出现上述浏览器信任问题的根源是Wiki中的解决办法给的证书基本已经过期，浏览器不再信任，当然最直接的解决办法就是重新搞一个有效的证书。 安装openssl的过程就不用啰嗦了，依次执行如下命令生成证书：

• - 生成一个以des3加密的，2048位强度的RSA秘钥，需要设密码，可输入 test，参考 genrsa（https://www.openssl.org/docs/manmaster/man1/genrsa.html）

openssl genrsa -des3 -out testenc.key 2048

• - 去掉上面生成的私钥的密码,我们不需要密码,参考 rsa（https://www.openssl.org/docs/manmaster/man1/rsa.html）

openssl rsa -in testenc.key -out test.key

• - 使用上面的密钥，生成十年有效期的自签名证书，参考 req （https://www.openssl.org/docs/manmaster/man1/req.html）

openssl req -new -x509 -days 3650 -key test.key -out test.crt

最后一条命令依次填入的信息如下：

CN
beijing
beijing
qunar
dujia
*.qunarzz.com
[email protected]

2.4 生成带 SubjectAltName 扩展的证书

上面的证书在一段时间是有效的，但随着Chrome浏览器的升级，这个证书也不好使了。上面的浏览器信任问题再次出现，但这次的提示信息不一样了，missing_subjectAltName。 继续解决这个问题，重新生成带 SubjectAltName 扩展的证书。

• - 生成一个2048位强度的RSA秘钥，需要设密码，可输入 test,参考 genrsa（https://www.openssl.org/docs/manmaster/man1/genrsa.html）

openssl genrsa -des3 -out qunarzz-dev-enc.key 2048

• - 去掉上面生成的私钥的密码,我们不需要密码,参考 rsa（https://www.openssl.org/docs/manmaster/man1/rsa.html）

openssl rsa -in qunarzz-dev-enc.key -out qunarzz-dev.key

• - 使用上面的密钥，生成带有SAN(Subject Alt Name)（https://www.openssl.org/docs/man1.0.2/apps/x509v3_config.html）的自签名证书,参考 req（https://www.openssl.org/docs/manmaster/man1/req.html）
  - 需要全局找一份openssl.cnf ，或者下载一份openssl 那里有。这里通过一条命令填入相关的参数信息，如果有其他需求，可以修改这里面的数据。
•  -subj参数自动填入相关的组织信息，不用再交互了
•  -config 配合Shell命令，自动填入扩展字段内容，并提供给-extensions选项

openssl req -new -sha256  
    -x509 
    -days 10000 
    -key qunarzz-dev.key 
    -subj "/C=CN/ST=BeiJing/L=Beijing/O=QUNAR/OU=FE/CN=qunarzz.com" 
    -extensions SAN 
    -config <(cat ./openssl.cnf 
        <(printf "[SAN]nsubjectAltName=DNS.1:qunarzz.com,DNS.2:q.qunarzz.com,DNS.3:*.qunarzz.com")) 
    -out qunarzz-dev.crt

打开Mac的钥匙串访问 App，通过文件->导入项目，导入上面的证书，并在证书属性里面选择始终信任即可

fekit server -s /path/to/crt
ykit server -s /path/to/crt

3. 扩展总结

咱们现有的业务都是fekit 和 ykit 共存的状态，同时fekit的项目也比ykit的项目多，同一个页面比如度假首页本地调试也需要同时启动fekit和ykit相关的工程，这里一个更好的方式是本地安装一个nginx，同时反向代理本地的fekit server 和ykit server，并将证书配置到nginx上面,整个世界也就安静下来了。

4. 参考资料

1. 《OpenSSL与网络信息安全-基础、结构和指令》
2. 《OpenSSL攻略》
3. 《OpenSSL编程》
4. OpenSSL官网( https://www.openssl.org/ )
5. OpenSSL命令手册（https://www.openssl.org/docs/manmaster/man1/openssl.html）

本文来源于：前端开发本地调试HTTPS浏览器信任问题解决-变化吧门户
特别声明：以上文章内容仅代表作者本人观点，不代表变化吧门户观点或立场。如有关于作品内容、版权或其它问题请于作品发表后的30日内与变化吧联系。