腾讯云服务器优惠活动华纳云香港服务器

基于阿里云的WordPress全站HTTP转HTTPS实践

WordPress主题推荐

首先,讲一下我对于 HTTP 转 HTTPS 的想法和做法。现在有一些站长是采用保守的策略,考虑到一些其它的因素,保留了 HTTP,即 HTTP 和 HTTPS 共存。作为一个 IT 行业的人,我个人的想法是,这种做法转 HTTPS 就失去了本身的意义了。所以本站是将把 HTTP 强制转 HTTPS。既然要做,那就做彻底,HTTPS 是大势所趋,与时俱进。毕竟现代浏览器基本都是支持 HTTPS 的。是的,就是这么简单粗暴。当然啦,这是我个人的做法。

什么是 HTTPS

其实就是 HTTP 的安全版。就是在 HTTP 下加入 SSL 层,HTTPS 的安全基础是 SSL,因此加密的详细内容就需要 SSL。

HTTPS 对于站点加载速度的影响

很多站长不想升级 HTTPS,是因为都觉得 HTTPS 慢!确实是有这个原因的,因为 HTTPS 对数据进行加密,而处理这些加解密是废了些时间。不过,有一点要知道,那就是,HTTPS 只有在第一次访问的时候才会慢一点,进入站点后第二次开始就跟 HTTP 没区别了。举个例子,两个人初次会面,先握个手,然后开始聊天,聊天过程中不会再握手;第二天再见面时,再握个手,然后接下来聊天又不会握手了。HTTPS 的缓存期过了之后,才会重新进行一次加密验证,所以对于速度的影响,其实不大。如果实在担心速度问题,可以对服务器做一些优化。

申请 SSL 证书

现在很多平台,比如阿里云、腾讯云、七牛都可以申请证书了,而且有免费的证书可以申请。像我们这样的个人用户,其实申请免费的就可以了。这里拿阿里云做例子,因为本人是阿里云用户。在控制台的“安全(云盾)”板块找到“证书服务”,进去之后就是你证书的列表,直接点击购买证书。选择免费型 DV SSL,直接购买即可。

基于阿里云的WordPress全站HTTP转HTTPS实践-第1张-boke112百科(boke112.com)

买了之后回到证书服务的页面,把该填的信息填了,提交审核就可以。阿里云很方便,我们可以选择自动生成证书的 pem 和 key。如果是万网的域名,还可以选择自动解析。如果是阿里云一站式用户,基本上就是填一些资料提交就行了。更具体的教程请移步『申请阿里云免费型 DV SSL 证书的详细图文教程』。

安装证书

证书下来之后,点击下载。就进入到证书的下载页面,把证书下载下来。阿里云已经提供了各种服务器类型的安装方法。这里我用的是 Nginx,以下是我弃用 http(80 端口)的做法:

找到 listen 80 要升级为 https 的 server{} 配置,修改为:

  1. server {
  2.         listen 443 ssl;
  3.         server_name www.gzpblog.com;
  4.         ssl_certificate   /usr/local/nginx/cert/ggg.pem;
  5.         ssl_certificate_key  /usr/local/nginx/cert/ggg.key;
  6.         ssl_session_timeout 5m;
  7.         ssl_ciphers ECDHE-RSA-AES128-GCM-SHA256:ECDHE:ECDH:AES:HIGH:!NULL:!aNULL:!MD5:!ADH:!RC4;
  8.         ssl_protocols TLSv1 TLSv1.1 TLSv1.2;
  9.         ssl_prefer_server_ciphers on;
  10. #其它配置省略
  11.         location / {
  12.            ……
  13.         }
  14.            ……
  15. }

这些内容阿里云有提供的。如果你想仔细研究一下配置也可以。注意一下证书引入的路径,你需要将你下载下来的证书上传到那里,并且引入。配置完这个,重启 Nginx,基本上就可以通过 Https 来访问你的站点了。

HSTS的启用

HSTS 是一种新的 Web 安全协议,它的作用,是强制客户端(如浏览器)使用 HTTPS 与服务器创建连接。在启用前先确定一下这是你需要的,本站全站 HTTPS 了,所以开启此功能。

在我们刚才安装证书的配置下面,加上下面这一条:

  1. add_header Strict-Transport-Security “max-age=63072000; includeSubdomains; preload”;

重启 Nginx 就可以了。开启 HSTS 之后,只要用户通过 HTTPS 访问了你的站点,下次再访问时,就会自动通过 HTTPS 来访问。

那么就有一个问题,当有人从来没访问过你的站点时,那他第一次访问,肯定还是通过 http,因为此时 HSTS 还没有通过 HTTPS 生效。当然,这个问题是有解决办法的,谷歌维护了一个预载入列表,一开始是 Chrome 使用的,后来大部分浏览器都加入了。这个列表直接告诉浏览器,这个站点支持 HTTPS,你得用 HTTPS 的方式来访问。不过,如果你并不能确定你的网站从此以后一直使用  HTTPS,那还是不要加入这个列表。因为,加入后很难撤销,你可以要求撤销,但是这个数据重新更新到稳定版的 Chrome 同样需要几个月,而别的浏览器是如何处理这个撤销数据的,则无法保证。所以,目前,我采用 301 跳转的方式处理第一访问的 http,给自己留个后路。

301 跳转

转 HTTPS 之后,还有一些站长比较担心搜索引擎收录。谷歌的支持是比较好的,而国内的好像还不太行。不过,百度是有发过公告支持 HTTPS 的:

基于阿里云的WordPress全站HTTP转HTTPS实践-第2张-boke112百科(boke112.com)

具体百度做得怎么样,我们就不深究了,但是既然人家都发话了,那我也就不怂了,毕竟我这个博客,对收录还不至于很致命。所以,我干脆直接 301 跳转,就是这么干!

除了以上配置,我还有一些 301 跳转的配置以强制使用 HTTPS:

80 端口全部跳转到 443

  1. server {
  2.     listen       80;
  3.     server_name  www.gzpblog.com gzpblog.com;
  4.     return       301 https://www.gzpblog.com$request_uri;
  5. }

443 端口主域名跳转到 www 域名:

  1. server {
  2.     listen 443 ssl;
  3.     server_name gzpblog.com;
  4.     return      301 https://www.gzpblog.com$request_uri;
  5. }

看一下启用 HTTPS 后的速度

现在我们的站点已经是启用 HTTPS 了,可以看到舒服的小绿锁:

基于阿里云的WordPress全站HTTP转HTTPS实践-第3张-boke112百科(boke112.com)

来看一下启用后网站加载速度的影响,首先这个是启用之前:

基于阿里云的WordPress全站HTTP转HTTPS实践-第4张-boke112百科(boke112.com)

然后启用之后是这样的,首次握手的表现:

基于阿里云的WordPress全站HTTP转HTTPS实践-第5张-boke112百科(boke112.com)

可以看到,传输数据爆增,加载速度确实慢下来了,但是当我们再次刷新网页时:

基于阿里云的WordPress全站HTTP转HTTPS实践-第6张-boke112百科(boke112.com)

速度又回到之前的水平,只有第一次才受到影响。而实际上在第一次时,从用户体验上来看,差距也不大,并没有太大的页面呈现拖后(是有一点点,但是问题不大啊)。

全站 HTTPS

接下来,如果我们点进文章页,会发现这种情况,比如在谷歌下,小绿锁变成了感叹号:

基于阿里云的WordPress全站HTTP转HTTPS实践-第7张-boke112百科(boke112.com)

在火狐下,出现了黄色感叹号标志:

基于阿里云的WordPress全站HTTP转HTTPS实践-第8张-boke112百科(boke112.com)

既然全站 HTTPS,这种情况我们是要解决的。这说明我们的文章中的图片,还是 http 的。接下来处理这个问题。我们先到后台改一下这个站点链接为 https 的:

基于阿里云的WordPress全站HTTP转HTTPS实践-第9张-boke112百科(boke112.com)

处理图片这个问题,分两种情况,图片存在本服务器,和图片来自于比如阿里云 OSS 的服务器。我是存在阿里云的 OSS 的,接下来是存在 OSS 的解决方法。

我们先直接在 WordPress 的主题中的 functions.php 文件中加上:

  1. function replacehttp($content){
  2.     if( is_ssl() ){
  3.         $content = str_replace(‘https://files.gzpblog.com/wp/’, ‘https://files.gzpblog.com/wp/’, $content);
  4.     }
  5.     return $content;
  6. }
  7. add_filter(‘the_content’, ‘replacehttp’);

修改后,我们文章中的图片地址就变成了 https:

基于阿里云的WordPress全站HTTP转HTTPS实践-第10张-boke112百科(boke112.com)

地址这个问题就解决了。但是这些图片链接点进去是这样的:

基于阿里云的WordPress全站HTTP转HTTPS实践-第11张-boke112百科(boke112.com)

说明 files.gzpblog.com 域名还不支持 HTTPS,这是接下来要做的。

阿里云 OSS 服务器支持 HTTPS

首先阿里云 OSS 是支持 https 的,如果你是调用类似于 bucket.oss-cn-shenzhen.aliyuncs.com 域名图片地址时,本身就已经是 https 了。但是很多时候,我们并不这样做,比如本站就将该域名绑定到了二级域名 files.gzpblog.com,用这个域名专门做图片链接。但是,我们的证书是免费证书,就是说不支持泛域名(比如 *.gzpblog.com),那么这个时候 files.gzpblog.com 域名是不支持 https 的。oss 的自定义绑定域名 cname,不能 https。

处理这个问题,我们可以配合 CDN 加速来解决,开启 HTTPS 加速之后,要收费,其实这个不贵,1G 的流量 2 毛线,个人觉得还行,因为我的流量不会很大;如果不使用这种方法,可以采用反向代理来解决,那就是改一下 Nginx 配置的事了。

那现在我们需要为该域名再申请一张证书,申请的方法是一样的,但是这次我们不需要再自己安装证书了。使用云产品推送,直接推送到 CDN(如果你是用了 CDN 加速图片并且是阿里云的 OSS 服务器,那就可以直接推过去,否则先设置一下加速域名,注意是加速类似 files.gzpblog.com 这个域名而不是主域名)。

推送过去之后,我们到 CDN 的域名列表,点击“管理”,编辑“HTTPS 安全加速”:

基于阿里云的WordPress全站HTTP转HTTPS实践-第12张-boke112百科(boke112.com)

将这个开启,并且选择证书,注意不要选错选到 www 的证书去了。

基于阿里云的WordPress全站HTTP转HTTPS实践-第13张-boke112百科(boke112.com)

配置完成后,这个域名就支持 HTTPS 了。到了这一步,基本上全站就支持 HTTPS 了,点进去基本都是小绿锁。当然,如果你引入其他 http 链接的文章还是会有的。

测试结果

其实到目前为止,本站的 HTTPS 化并不完全,像什么 IE6 啊 XP 啊之类的老古董可能会不支持的。抱着与时俱进的心态,那些就先不考虑了,以后再做优化吧。来测试一下 HTTPS 的支持得如何,这是一个测试网站:SSL Server Test

基于阿里云的WordPress全站HTTP转HTTPS实践-第14张-boke112百科(boke112.com)

看来评分不高,有空再研究研究这东西,看看如何优化提升。

阿里云优惠活动:2核2G3M云服务器99元/年,2核4G5M仅需199元/年,新老同享,续费同价;阿里云99套餐专属优惠:域名注册+云服务器(2核2G,不限流量,续费同价)+云·原生建站,可备案5个网站/APP,前往选购
赞 (0) 打赏
版权声明:本文为转载文章,来源于 锅子博客 ,版权归原作者所有!发布此文是出于传递更多信息之目的,若有来源标注错误或侵犯了您的合法权益,请联系我们,确认后马上更正或删除,谢谢!
wu