wordpress

WordPress+多说完美迁移HTTPS实战教程

前言

原本只是想挖一个加密云笔记的坑,打算给某域名上个HTTPS确保信息传输安全。想想算了干脆就给博客和Pixiv挂件也一并上了吧,这样也比较安(zhuang)全(bi)、比较现(gen)代(feng)化

SSL证书

作为穷逼,免费是必须的。虽说付费的也就几十块/年,但毕竟有免费的还差不多,就没必要花钱辣!
曾经首选的沃通(WoSign)和StartSSL(已被沃通收购)如今深陷丑闻,谷歌和Mozilla都表示要屏蔽其根证书,因此不考虑
不得不提的当然是火遍半边天的Let's encrypt啦!其根证书兼容性好,还免费,虽然每次只能签3个月有效期,但在各种一键自动脚本的加持下无论是获取还是更新方式都越来越傻瓜化,成为了众多站长的首选SSL
其中我推荐使用scripts/lets-encrypt/,亲测方便,真的方便,方便出声

建议使用python2.7或3。如果你是python2.6的话,可能需要先yum install python-argparse,否则会报错

但我最终却不是选择它。因为我是希望隐藏源站IP的,也就是需要CDN
虽然上面的脚本可以通过crontab实现自动续期,但无法自动部署到CDN。每3个月还需要我手动从服务器上下载证书然后更新到CDN上,嫌烦,怎么办呢?
这时候,就得抱腾讯云的大腿了。用Q号登录就能申请免费1年的GeoTrust-DVSSL证书,且不限数量、免费续期、免费下载。如果用的是腾讯云CDN的话还支持一键部署
对我来说相比Let's encrypt要方便一些,就选它辣!审批还挺快,按照要求把验证域名所有权的CNAME解析做好,几分钟就通过了

CDN

不用CDN的小伙伴们可以直接跳过这一节了
国内支持SSL证书的免费CDN只有VeryCloud一家。但限制50G/月的流量,访问量不高的小伙伴们可以选它
而我因为Pixiv挂件的关系50G的流量还是挺吃紧的……加上服务器在腾讯云、SSL也用腾讯云的,所以干脆咬牙就上了腾讯云自家的CDN

服务器配置

拿到SSL证书之后,需要配置你的服务器才能让它生效
配置教程很多,这里就不再赘述。但我强烈建议在迁移过程中,要同时允许HTTP和HTTPS访问,而不是上来就强制HTTPS。否则的话很可能导致各种问题,例如WP后台无法登录之类
Nginx为例,具体的操作方法就是把原来监听80端的虚拟机配置复制粘贴,把80改成443,然后加上

然后reload一下,就能同时支持HTTP和HTTPS访问了
接下来测试一下HTTPS方式,只要浏览器左上角的小锁不显示红色×的话就可以继续下一步了

WordPress

回到HTTP方式,登录到后台。修改设置常规内的各种url为HTTPS
有些主题也会要求填写URL,记得一并改了
如果你使用了WP Super Cache之类的缓存插件,记得把缓存清除,然后停用插件,避免干扰
如果使用了CDN,请把CDN切换到回源模式,或者干脆本地hosts到源站,避免干扰
可以开始动手迁移了。先备份一下
接下来要替换以前的文章中的链接,以phpmyadmin为例,选择wp_posts表,搜索Find and replace
查找:http://www.mokeyjay.com,替换为:https://www.mokeyjay.com,字段就选post_content,然后执行替换就行了
如果你以前的文章中还引用到了其他链接,需要升级为https的话重复上述步骤即可。域名根据实际情况自行修改

本节参考资料:开启了全站HTTPS,内附多说表情使用HTTPS解决方案

多说

现版本多说本身已经支持HTTPS了,但其调用的表情、头像等第三方资源均为HTTP请求,虽不影响使用,但影响小绿锁呀
哪怕你的站只请求了一张HTTP的图,都会导致小绿锁变成小黄锁或者小灰锁,强(xiang)迫(zhuang)症(bi)忍不了啊
上面的参考资料里虽然也解决了这个问题,但代价是修改好几处的代码以及增加自己服务器负担
折腾一下午,终于得出比较简单的完美方案:
首先,下载hyriamb/duoshuo-js,取其中的embed_with_ua_https.js,上传到自己的服务器
例如我就上传到/wp-content/plugins/duoshuo下,也就是多说插件的目录下
然后修改多说插件目录下的WordPress.php文件第619行,把embed.js的引用指向你自己服务器的embed_with_ua_https.js
例如我就改为//www.mokeyjay.com/wp-content/plugins/duoshuo/embed_with_ua_https.js
这个JS跟多说官方embed.js的区别在于它会将评论中的头像、表情这些HTTP请求替换为HTTPS镜像,镜像基于七牛,具体提供者无从考证,向他们致敬!

据说这个JS能显示评论者的UA,但我没看到有任何效果,不明觉厉

如今新浪表情已支持HTTPS。如果你想给这些默默贡献镜像的好心人省点流量的话,可以在这个JS里搜索sinajs\.cn
大概在第995行的地方,把原来的代码修改为
s.message = s.message.replace(/http:\/\/img\.t\.sinajs\.cn\//g, "https://img.t.sinajs.cn/");
这样就不用镜像也能直接用新浪的HTTPS表情图片啦
如果你实在是懒,也可以下载我改好的正在用的embed_with_https.js

刷新页面,点击表情选择框F12看看,是不是都替换成HTTPS链接了?
但这还没完,以前评论里发过的表情可都还是HTTP的呢。我们进入wp_comments表,用之前提到过的方法替换一下
http://img.t.sinajs.cn替换为https://img.t.sinajs.cn即可
替换完毕后,刷新页面,表情依旧HTTP,为毛?
因为你只是改了你本地备份用的评论信息,而多说是从他们自己的服务器上调评论的
因此还需要到WP后台-多说评论-高级选项里,点击同步本地数据库中的评论到多说,然后等待同步完毕即可

理想情况下至此就应该全部迁移完毕。但我又遇到一个奇怪的问题:明明表情选择框、评论里的表情都是HTTPS了,为何F12还是报安全警告?为何还是没有小绿锁?
经过一番折腾,发现页面源码里就有评论内容,且评论中的表情链接为HTTP。这就怪了,上面修改的embed_with_ua_https.js明明生效了啊?
又经过一番折腾,到多说的高级选项里把搜索引擎爬虫访问网页时,显示静态HTML评论关闭就行了
怀疑是CDN回源时被多说识别为搜索引擎爬虫,所以回源来的html里带有静态的、未经embed_with_ua_https.js处理的评论。不用CDN的话应该没有这个问题

结语

至此,全站HTTPS化成功,多说的头像和表情也都解决了,向那些默默贡献镜像的dalao们致敬
如果还出现小黄锁、小灰锁的话,多用F12调试看看是哪里的问题;如果配置了CDN请刷新缓存
一切准备就绪,就可以开启强制HTTPS啦~
或者HTTP强制301到HTTPS也行,教程很多,不再赘述~