HTTPS中证书链不完整的解决方案

由于我们的部分业务场景是在微信（WebView）中打开https的web页面，在测试过程中却发现了一个问题，在Chrome中测试完全正常的https页面，在iOS的微信（WebView）中表现正常，但在Android中，不论是哪个版本的安卓系统，都不能正常打开页面，要么就是一片白，要么就是直接无法打开，解决这个问题，需要在服务器上配置完整的SSL证书链。
之后在Android自带的浏览器中测试，几乎所有的手机都出现下面这样的情况

image

证书链
看来Andorid的WebView不能打开页面应该是与这有关，造成这个问题的主要原因是我们服务器配置证书的证书链不全造成的。

证书链其实就是描述证书的签名环节，就比如是 A 颁发证书给 B ，B颁发证书给C，然后我们手里的就是证书C。当证书链不完整的情况下，也就是没有描述我们手中的证书C是由谁办法的，所以导致的浏览器不认为你这个证书是可信的授权证书。

每个设备中都会存有一些默认的可信的根证书，但很多CA是不使用根证书进行签名的，而是使用中间层证书进行签名，因为这样做能更快的进行替换（这句可能不对，原文是 because these can be rotated more frequently）。

如果你的服务器上没有中间件证书，这样的结果就是你的服务器上只有你的网站的证书，客户端的浏览器里只有CA的根证书，这样就会导致证书信任链不全，才导致了上面那两个截图中的问题。这种中间层证书不全的问题多出现在移动端的浏览器上（就我目前看，iOS8 iOS9 都没有出现问题，Andorid各个版本都有这个问题）。

当你服务器上的证书中的信任链不全的情况下，浏览器会认为当前的链接是一个不安全的，会阻止页面的打开。

解决方案
说清楚了原因，解决问题就很简单了，只要把我们的证书链补全就可以了。
从SSL证书服务商那里，你获得的crt证书文件大概是这个样子的：

<pre style="margin: 15px 0px; padding: 10px; font-style: normal; font-variant: normal; font-weight: normal; font-stretch: normal; font-size: 12px; line-height: 18px; font-family: Consolas, monospace, serif; color: rgb(68, 68, 68); tab-size: 4; overflow: auto; letter-spacing: normal; orphans: auto; text-align: start; text-indent: 0px; text-transform: none; widows: 1; word-spacing: 0px; -webkit-text-stroke-width: 0px; background: rgb(245, 245, 245);">-----BEGIN CERTIFICATE-----
# 证书内容
-----END CERTIFICATE-----
</pre>

在你补全中间层证书和根证书后，新的crt证书文件看起来是这样的：

-----BEGIN CERTIFICATE-----
# 证书内容 2
-----END CERTIFICATE-----

-----BEGIN CERTIFICATE-----
# 证书内容 3
-----END CERTIFICATE-----
</pre>

这里包含了你的证书，以及从你的证书向上递归直至根证书的全部证书，这样就可以向浏览器证明你的链接是安全的。

补全证书链
比较方便的是使用这个在线的工具：
https://certificatechain.io
进入这个网站，粘贴进你的证书（只包含你的用户证书），或者上传你的证书，他就会给出补全后的证书文件，你只需要粘贴回你的文件或者下载覆盖就可以了，然后在服务器上重新部署就可以解决问题。
由于这里只需要上传证书，所以是安全的，不需要担心不安全的问题。
如果不喜欢用在线的工具，可以使用下面这个本地的工具，PHP写的，在命令行中运行：
Github ssl-certificate-chain-resolver

PS:
一般情况下
cert.pem 是证书
chain.pem 是证书链编码
fullchain.pem 是cert.pem和chain.pem的证书集合
privkey.pem 是私钥文件
1

最后编辑于：2018.10.19 09:43:49