一、从一个微信Bug说起
问题：在微信Android客户端，一张七牛CDN上的HTTPS链接的图片，用微信浏览器打开可以正常访问，但是，长按图片保存时，却提示下载图片失败。
发现这个问题后，我用了一个简单的测试用例，很快就定位到问题原因。
从这个测试用例可以看出，只有七牛CDN上HTTPS链接的图片，长按保存才会失败。有了这个测试用例，我就猜测问题可能是HTTPS证书的原因。
于是，我就把这个问题报给了七牛，七牛排查之后，问题果然是HTTPS证书返回不对引起的。那么，是什么原因导致七牛返回的HTTPS证书不对呢？请继续看下文。
在了解问题的本质原因之前，我们先来了解一些相关的背景知识。
二、背景知识
在早期的服务器部署方案中，一台服务器（或者说一个IP）只会提供一个服务，所以在SSL握手时，服务器端可以确认客户端申请的是哪张证书，因为证书只有一张，服务器只要把这张证书发送给客户端就可以了。如下图所示：
一台物理机，一个IP，一张HTTPS证书，并且提供了唯一的一个服务（站点），所以，不管哪个客户端访问这个服务，服务器都返回唯一的证书。
后来，服务器性能提高了，一台服务器只部署一个服务就有点浪费了，所以就出现了虚拟主机，这样服务器虽然只有一个，但可以在每个虚拟主机上都部署一个服务，这就造成了一个IP会对应多个域名的情况。解决方案有一些，例如申请泛域名证书，对所有.yourdomain.com域名都可以认证，但如果你有另外一个域名.yourdomain.cn，那就不行了。如下图所示：
在早期的HTTPS协议中，当客户端发起SSL握手时，客户端并不会将host信息带过来，所以服务器就不知道客户端访问的是哪个域名服务，服务器也就不知道把哪张证书返回给客户端了，出现这种情况时，服务器通常是把默认的一张证书返回给客户端。
最后我们得出的问题关键是：
客户端发起SSL握手时，缺少Host信息。
所以，那些制定网络协议的人，又提出了SNI。
SNI（Server Name Indication）定义在RFC 4366，是一项用于改善SSL/TLS的技术，在SSLv3/TLSv1中被启用。它允许客户端在发起SSL握手请求时（具体说来，是客户端发出SSL请求中的ClientHello阶段），就提交请求的Host信息，使得服务器能够切换到正确的域并返回相应的证书。
检查浏览器是否支持SNI：https://sni.velox.ch/
另外，不同的是，在HTTP协议中，客户端发起一个网络请求，客户端都会把主机头host信息放在request header中传给后台，这样服务器就知道客户端访问的是哪个域名，服务器只要把请求转向相应的服务就可以了。例如下图所示的一个请求，我们可以看到request header中，带有host信息。
最后找微信的人确认，长按保存图片时，微信确实没有把host信息传给后台，这是微信图片下载库的一个bug。
那么，微信要解决这个问题，必须要等下一个版本发布了，有没有其他的解决方案呢？
七牛给出了一个解决方案，因为我们的图片都是存放在域名dn-kdt-img.qbox.me下面的，而这个域名又是七牛自己的，所以七牛就把所有域名*.qbox.me下的所有节点服务器，都配置了唯一的一张HTTPS证书，当客户端访问这些节点服务器的时候，服务器只要返回这张唯一的证书就可以了。如下图所示：
不管用户访问的是哪个节点服务器，服务器都只返回这张唯一的证书，这样处理之后，在建立SSL连接时，不管客户端是否发送了host信息给服务器，服务器都能返回正确的证书。
三、心得体会
1、作为一个前端工程师，了解一些运维的知识还是很有必要的，因为我们在做网站性能优化的时候，经常需要用到运维相关的技能及知识。
2、前端是一个非常有挑战的岗位，可涉及的知识面会很广，往前看，你可以了解一些产品，交互方面的知识，这样可以跟用户靠的更近；往后看，你可以了解一些后台的知识，这样在跟后台提接口要求的时候，可以沟通更顺畅；往上看，你可以让自己知识面更广，这样你可以看问题更加全面，所谓“站得高，望得远”便是这样的道理；忘下看，你可以深入去了解某一块专业知识，这样你可以成为这块领域的专家。
参考文档：
本文首发于有赞技术博客：http://tech.youzan.com/sni/
**粗体** _斜体_ [链接](http://example.com) `代码` - 列表 > 引用。你还可以使用@来通知其他用户。