全站启用 HTTPS

经过一个下午的努力终于将整站切换到了 HTTPS 环境。

至于为什么需要 HTTPS，理由其实已经比较充分了。首先 HTTPS 能提供一个更加安全的传输，可以防止一些运营商在页面内插入广告影响页面显示。并且，Google 也表示会对启用 https 的网站提权，有消息称 Chrome 在未来的版本中会对非 https 页面标记不安全。还有就是在 Let’s Encrypt 项目推出之后，SSL 证书的成本已经接近于 0，部署也变得比较简单。

实际上早在去年年底，在 Hostker 推出证书服务之后本站就已经部署了 SSL 证书，并且也在后台部分也启用了强制 HTTPS 连接。在前台的页面，直接访问对应的 HTTPS 页面也是没有问题的。

然而看起来切换到 HTTPS 只是在 WordPress 的设置里面把地址前面的 http 换成 https。但是对于一个用户体验良好的 HTTPS 网站，仍然有很多工作要做。

首先是资源的引用问题。对于 Chrome 等注重安全的浏览器，只有做到页面中所引用的资源完全来自于 HTTPS 链接，Chrome 才认为这个页面是安全的，表现在地址栏显示一个绿色的锁。如果有图片或者 CSS 或者 JavaScript 来自于非 HTTPS 链接，则地址栏会显示带黄色标记的锁。所以对于一个 HTTPS 页面来说，必须要保证所引用的资源也来自 HTTPS 链接。可以看到一些对于 jQuery、Google Fonts 的引用地址直接以“//”开头，这样可以继承当前页面的连接类型，使用 HTTPS 访问自然也会访问对应 HTTPS 的资源。所以在引用一些外部资源时，一定要注意是否支持 HTTPS 访问。比如，360 的前端 CDN 就不支持 HTTPS 访问。

当然，对于 WordPress 来说，还要注意内部资源的引用。WordPress 文章中插入的图片都会以链接的形式保存在文章中。如果之前没有启用 SSL，那么保存在文章中的链接也就只会是 http。而启用 SSL 之后上传插入的图片就会是 https 的了。在页面开启 SSL之后，Chrome 会有很多图片不能正常显示。所以一个重要的工作就是将原有文章中的 http 的链接全部替换成可继承的“//”或者直接是“https”。

还有就是原来的文章中引用的虾米音乐播放器同样不能在 https 下面正常使用，虾米的外链播放器仍然采用 http 链接。所以也比较麻烦。不过，通过 Fancy Xiami 插件可以使用 HTML5 播放器链入虾米的音乐，算是在一定程度上解决了这个问题。

接着是跳转的问题。原来网站可能已经产生了很多的外部链接，包括搜索引擎索引到的。这样就需要在访问一个 http 页面的时候跳转到对应的 https 页面上。Nginx 和 Apache 都有相应的配置方法，大体思路就是利用 rewrite 将非 https 的链接重定向到 https 的链接上。Nginx 需要编辑相应的配置文件，而 Apache 可以编辑在对应的目录下面的 .htaccess 文件。

本站部署在 Hostker 上，采用 .htaccess 文件对网站进行配置。关于 Apache 的配置，网络上也有很多提供。但是 Hostker 有一定的特殊性。尝试了很多方法都会提示重定向循环。通过研究相关配置以及 Hostker 提供的一些资料，最终发现 Hostker 在对于来路的判断上与标准 Apache 有一定差异。

下面是配置好可以正常进行跳转的 .htaccess。

# BEGIN WordPress
<IfModule mod_rewrite.c>
RewriteEngine On
RewriteCond %{HTTP:KERSSL} !on
RewriteRule (.*) https://%{HTTP_HOST}%{REQUEST_URI} [R=301,L]
RewriteBase /
RewriteRule ^index\.php$ - [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . /index.php [L]
</IfModule>
# END WordPress

总之，从 http 迁移到 https 需要做好相应的准备，同时也需要考虑迁移可能出现的问题并找到相应的解决方法。还是希望能够有更多的网站能够开始启用 https。

特色图像来源：Wikipedia