让我们愉快地给网站加密吧!

时至今日,给网站进行 SSL 加密已经成为一项「刚需」。倒不是说网站上一定有啥见不得人的内容,例如我这个博客,不需要用户注册和登录,更不涉及在线交易或者支付之类的行为,仅仅是是闲暇时无病呻吟写写自己的想法,不怕被窥探,也没啥值得窥探的。但是对于一个 HTTP 方式访问的不加密网站,在某些奇葩机构的肆意妄为下,可能会面临很多龌龊的遭遇。

例如很多网站,从百度之类的互联网「巨头」到个人站点,都遭遇过运营商的 HTTP 劫持行为。运营商会对 HTTP 通信进行劫持,强行插入自己的广告;或者会有一些不法机构劫持你访问电商网站的流量,通过「返利劫持」盈利。

相关新闻报道和参考资料:

用「运营商 HTTP 劫持」之类的关键字搜索,找到的结果够看很久了……

面对劫持,尤其是运营商的劫持,网站端能做的实在是不多,不过一种比较有效的方法是对整个网站启用 SSL 加密

这种技术以前可不是随便一个人就能轻松使用的。首先,你的网站必须使用独享的 IP 地址;其次,还要从受信任的证书颁发机构那里购买 SSL 证书。这对很多人,尤其是小型网站来说已经很不容易实现了。例如你正在阅读的这个博客,托管在 DreamHost,我自己都不知道这个网站在和几百上千个其他网站共用同一台服务器和同一个 IP 地址。以前若想要使用独享 IP 地址,DreamHost 的报价是每个月 5.95 美元,每年优惠价 59.95 美元!

后来技术发展,新的 Web 服务器技术已经不要求只能在有独享 IP 地址的情况下才能配置 SSL,例如 Windows Server 中的 IIS 以及其他很多 Web Server 平台都可以通过 SNI (Server Name Indication) 让同一台服务器和同一个 IP 地址上跑的多个网站无需独享 IP 便能启用 SSL。对小型个人网站来说,这块能节约很大一笔钱。可是证书依然需要花钱买,还是以这个博客的平台为例,DreamHost 提供的 SSL 证书价格为每年 15 美元。当然对于大型商业网站,这种证书的价格更贵。

有很多网站会使用自签名证书,不仅个人网站会用,就连 12306 这种流量位居全球榜首的大型网站也在用。这种证书虽然方便,但因为是自己给自己颁发的,无法被访客的浏览器所信任,进而 12306 之类网站会要求访客首先安装一个根证书。这么做的弊端和隐患,我前几年曾经写过一篇文章来介绍,如果你不了解 SSL,强烈推荐阅读。

不过二十一世纪都过了十几年,Web 的世界更是天天都在变化,越来越多的人对 SSL 有需求,于是一些机构为了让更多网站能够低成本,甚至零成本使用 SSL,推行了一个名为 Let’s Encrypt 的项目。这个项目可以为任何个人和机构提供免费的,受信任的,可以自由使用的 SSL 证书。主要赞助商更是包括了 Mozilla、思科、Akamai、Facebook、HP Enterprise 等 IT 巨头。目前各大主流操作系统和浏览器均已可以信任他们的证书。

这一举措直接让 SSL 的成本降低为零!DreamHost 也对 Let’s Encrypt 提供了直接的支持,所以我也把自己的博客网站武装起来了。

启用这个功能,真的很简单

Let’s Encrypt 提供了非常简单的方法,几步操作就能获得一个受信任的免费 SSL 证书。随后你可以将这个证书用到自己的任何系统或站点中。具体方法可以参考官方说明

我自己因为网站托管在 DreamHost,启用的过程就更为简单。大致说一下,供有需要的人参考。

在 DreamHost 后台依次进入「Domains」—「manage Domains」,找到要启用的域名,点击「Secure Hosting」下面的「Add」。

针对指定域名进行配置

选中第一个「Signed Certificate」选项,点击底部的「Add now!」就行了。就这么简单。不过需要注意,DreamHost 还为所有用户提供了免费版的 CloudFlare CDN 加速服务。这个服务的免费版不支持 SSL,如果希望同时使用 SSL 和 CDN,就必须升级为每月 9.95 美元的 CloudFlare Plus 方案。如何取舍就看你自己了,我宁愿要 SSL,所以禁用了免费的 CDN 服务。

启用 Let's Encrypt 的 SSL 证书

最重要的工作到这里就搞定了,不过取决于网站运行的程序,可能还需要一些额外的设置。

WordPress 的后续设置

本站点在 DreamHost 上运行 WordPress 构建,启用 SSL 后还需要对 WordPress 进行一些配置。首先需要在 WordPress 后台的常规设置中修改网站的 URL:

修改 WordPress 网站的 URL

 

随后需要在 wp-config.php 中添加下列两行:

define('FORCE_SSL', true);
define('FORCE_SSL_ADMIN',true);

接下来,对于现有站点,还需要将所有内部 URL 替换为新的 HTTPS 协议的 URL。此时可以使用 Search & Replace 插件进行批量替换。

利用插件批量替换内部 URL

利用插件批量替换内部 URL

注意,使用上述插件对域名之外的内容进行查找和替换时,可能会遇到预演模式一切正常,但实际写入不能生效的问题,这是个已知的 Bug,目前还没解决。遇到这个问题的童鞋可以使用另一个插件 Better Search Replace 代替。

最后,为了照顾到依然在使用 Windows XP 的用户,需要在网站的 .htaccess 文件中添加下列几行内容。Windows XP 不支持 Let’s Encrypt 的此类证书。这几行可以确保全站强制使用 SSL 的情况下,Windows XP+IE 6 用户依然可以使用 HTTP,而不被重定向到 HTTPS:

<IfModule mod_rewrite.c>
RewriteEngine on
RewriteCond %{HTTPS} !=on
RewriteCond "%{HTTP_USER_AGENT}" "!(Windows\ NT\ 5\.1|Windows\ NT\ 5\.2)" [NC]
RewriteRule ^ https://%{HTTP_HOST}%{REQUEST_URI} [L,R=301]
</IfModule>

经过上述设置,你的网站已经可以安全地通过 HTTPS 协议呈现在访客面前了。

问题还没完

首先,在启用 SSL 后,Let’s Encrypt 的证书申请、创建,以及生效还需要一段时间,据说可能需要好几个小时。在这过程中,访客访问时会遇到证书错误,例如这样:

证书生效前会遇到错误信息

这是因为 Let’s Encrypt 的证书尚未生效,DreamHost 自动提供了一个临时的自签名证书。目前等待最终证书的生成速度挺慢的,我申请后将近 30 小时,还是在写信询问客服之后才拿到,不知道是有什么特殊情况,还是大家都这么慢。

其次,混合内容的问题。你的网站已经全站启用 SSL 加密了,可你网站上引用的外部内容呢?例如我这个博客,使用插件和其他外部脚本调用 Web Fonts,同时还调用了其他一些内容,例如 Gravatar 头像。当然,虽然我没有使用,但其实很多网站还包含其他外部内容,例如访问量统计脚本、广告内容等。

在网站已经启用全站 SSL 的情况下,如果这些调用的外部内容依然是通过 HTTP 方式提供的,这就叫做「混合内容」,而现在的新一代浏览器在展示混合内容时,已经默认不加载 HTTP 内容了。以前 IE 还会用一个大大的对话框询问访客是否加载混合内容,而现在无论 Edge 或者 Chrome,都只会在一个不起眼的地方显示一个图标,很难察觉。估计这种举措,也是浏览器厂商们协助推广全网 SSL 加密的一种努力措施吧。

混合内容的提示信息被放在很难察觉的地方

混合内容的提示信息被放在很难察觉的地方

这就需要联系外部内容的供应方来解决了,例如 Web Fonts,可以选择一个支持 HTTPS 的来源,广告?问问哪些广告商可以支持 HTTPS,然后更换吧。

WordPress 默认使用了 Google 的 Web Fonts,然而由于【~~哔~~】的原因,Google 的服务访问很成问题,直接导致自己的网站加载速度缓慢。所以我安装了一个 WordPress 插件 Useso take over Google,将默认的 Google Web Fonts 替换为国内的类似服务。这个插件无需特殊设置就能支持 HTTPS,此时的字体来源是中国科学技术大学

全站 SSL 顺利实现。终于看到了那个绿色的锁头图标,爽很!目前唯一的问题就是,我之前使用的 CDN 免费版不支持 SSL,支持的版本太贵。安全和速度,还是选择安全吧,所以本站暂时就不用 CDN 了。不知道有没有免费,效果好,并且支持 SSL 的 CDN 服务,如果有的话,还请大家推荐。

全站 SSL,顺利实现

全网 SSL,希望也能早日实现!

分享:

《让我们愉快地给网站加密吧!》有4个想法

  1. 博主你好,如果没记错的话 CloudFlare 的 Free Plan 也是支持SSL的……(他们的 Universal SSL 也是提供免费证书的(不过是 CDN-用户间的))
    (参考:https://www.cloudflare.com/ssl/)

    刚刚看了一下,好像有说”we’re enabling SSL by default for all our customers that are signed up directly for CloudFlare — even those on our Free plan.”

发表评论

电子邮件地址不会被公开。 必填项已用*标注

发表评论前,先做个简单的数学题吧: * Time limit is exhausted. Please reload CAPTCHA.