hexo博客自定义域名添加HTTPS

  不知从去年什么时候起,各大网站都上了https。7月底从wordpress转到hexo,静态博客速度确实很快,秒杀wordpress,也不用操心维护,只专注于写作。期间换过一个主题两个主题,都是基于Vue的,简单的配置了https,没有发现任何问题,最近新换了一个主题发现仅有首页是https,文章和其他页都是http,花了点时间解决,分享一下。

HTTP和HTTPS

HTTP:互联网上应用最为广泛的一种网络协议,是一个客户端和服务器端请求和应答的标准(TCP),用于从WWW服务器传输超文本到本地浏览器的传输协议,它可以使浏览器更加高效,使网络传输减少。

HTTPS:以安全为目标的HTTP通道,简单讲是HTTP的安全版,即HTTP下加入SSL层,HTTPS的安全基础是SSL,因此加密的详细内容就需要SSL。

HTTP和HTTPS主要区别:

  1. https协议需要到ca申请证书,一般免费证书较少,因而需要一定费用。
  2. http是超文本传输协议,信息是明文传输,https则是具有安全性的ssl加密传输协议。
  3. http和https使用的是完全不同的连接方式,用的端口也不一样,前者是80,后者是443。
  4. http的连接很简单,是无状态的;HTTPS协议是由SSL+HTTP协议构建的可进行加密传输、身份认证的网络协议,比http协议安全。

为什么要使用HTTPS

  HTTPS的主要作用有两点:一是保证数据安全,二是确认网站的真实性。现在使用http,chrome会提示不安全,而https则会带一把小绿锁。所以我的博客添加https的作用就是为自己加一个小绿锁:)。

hexo博客两种添加HTTPS的方式

Github强制HTTPS

https.png

  直接在Github pages的配置中勾选Enforce HTTPS选项即可开启HTTPS,虽然也能解决小绿锁的问题,但是却不能用到免费的CDN加速,对于使用Vue/React开发的主题,首屏加载可能较慢。所以采用第二种方案较好。

CloudFlare

  注册cloudflare和如何绑定自己的域名就不赘诉了。首先,在DNS添加一条CNAME记录,指向github提供的pages地址。记得使用cloudflare就不要开启github的强制https,否则可能会导致你的博客访问不了。

dns.png

  然后在Crypto中选择创建一个证书,根据自己需要填写。

ssl.png

  创建完成后,再添加一下Page Rules,用户可以免费创建3个Page Rules。

  第一个让匹配的URL都强制走HTTPS,记得尽量使用通配符*尽可能多的匹配到会用到的URL。我就是因为前面一直用的SPA,一直没发现自己只配了主页。直到最近换了主题才发现。

pagerules1.png

  第二个,可以让CloudFlare的CDN中缓存你的静态也页面。一定程度上能提高访问速度。

pagerules2.png

  配置完成后,可能要等一会儿才能生效。

最后

  其实这两种开启https的方式使用的CA证书都不是你自己的,都是两个提供商的。不过也有方式可以实现个人网站的证书,一是cloudflare的证书可以升级,5$一个月对于个人用户还是比较贵了。另外,可以使用Let’s Encrypt通配符证书。