前言：

本篇设置基于 NEXT 主题 7.7.2 版本！！

CDN 加速我已更新：Hexo 框架 (十八)：图片自适应 webp 及全站 CDN 加速

部署到 GitHub

这里就不再赘述如何部署到 GitHub，如果你还不会，可以参考一下 Hexo 框架 (一)：使用 Hexo 快速搭建个人博客

购买域名

购买域名什么的，这里不再赘述，这里假定你已经购买了域名，并且会基本的解析操作。

添加解析记录

添加解析记录

Github Pages 对自定义域上 Https

我们在 Github Pages 项目中 Settings 选项卡 Github Pages 选项：在 Custom domain 添加你的自定义域名。

刷新页面 如果能勾选 Enforce HTTPS 即完成。

自定义域名

部署到 coding

GitHub 服务器毕竟是在国外，国内访问的速度比较慢。而 Coding 是国内的一个面向开发者的云端开发平台，这意味着能够大大提升国内的访问速度。

本文简单记录了 Hexo 博客部署到 Coding 的过程。

创建仓库

  • 首先官网注册账号。现在好像不能注册个人版了。你可以点击这里进行注册：Coding

  • 注册完账号之后，请前个人账户的设置页面选择 SSH 公钥将本地生成的 公钥 添加进去。公钥储存位置一般在 C:\Users\用户名\.ssh 目录下的 id_rsa.pub 文件里，用记事本打开复制其内容即可。操作与 GitHub 类似，你可以参考 Hexo 框架 (一)：使用 Hexo 快速搭建个人博客

  • 新建项目

  • 新建项目

  • 然后创建仓库

一个仓库用来存储静态页面，一个用来保存我们的配置文件，做个备份。

部署到 Coding 仓库

现在我们将 public 目录推送到 Coding 上博客仓库的 master 分支。

我们只需要改下站点的配置文件，添加如下代码：

1
2
3
- type: git
  repository: https://e.coding.net/XXXXX/XXXXXX.git
  branch: master

然后 hexo deploy 即可部署成功。

开启 Coding Pages 服务

静态网站

博客部署完成后，我们在构建与部署> 静态网站中一键开启 Coding Pages 服务。

在浏览器中直接输入他给的域名，查看是否部署成功。

添加自定义域名

首先得有一个自定义域名，然后我们把它绑定到 Coding 上。

我是用的万网域名，直接打开 阿里云控制台。

添加解析记录：

添加解析

注意：因为我们要实现国内外访问不同的服务，所以需要分别设置解析，无论是腾讯云还是阿里云的解析服务，都能够很好的区分国内外节点，我们需要将国内的 CNAME 设置到 pages.coding.me，将国外的 CNAME 设置到 pages.github.io。

Coding 绑定自定义域名

打开 Coding 的 Pages 服务，进入设置页面，为网站绑定自己的域名。这里他也有说怎么绑定。

image-20200404124317316

注意：一定要选首选的域名，并且非首选域名要勾选跳转至首选域名，不然有些第三方服务数据会统计不到一起。

开启 HTTPS

如果你之前已经部署到了 GitHub Pages 并开启了 HTTPS，那么直接在设置页面绑定你自己的域名，SSL/TLS 安全证书就会显示申请错误。

申请错误原因是：在验证域名所有权时会定位到 Github Pages 的主机上导致 SSL 证书申请失败。

正确的做法是：先去域名 DNS 把 GitHub 的解析暂停掉，然后再重新申请 SSL 证书，大约十秒左右就能申请成功，然后开启强制 HTTPS 访问。

配置_config.yml

1
2
3
4
5
6
deploy:
  type: git
  repo:
    coding: https://e.coding.net/XXXX/blog.git
    github: https://github.com/XXXXX/XXXXX.github.io.git
  branch: master

到此双线部署完成，你每次hexo d 就会自动上传到两个仓库，并自动部署。

全站 CDN 加速

由于 GitHub Pages 的服务器在国外，国内访问速度可能会非常慢。目前有以下几种解决方案：

  • 博客双线部署在 GitHub Pages 和 Coding Pages 上，其中国内流量解析到 Coding Pages，国外流量解析到 GitHub Pages
    • 优势：无需购买 VPS、速度比较快、不用备案
    • 劣势：Coding Pages 的服务并不是那么稳定，近期出现多次不能正常部署或访问 Pages 的问题
  • 博客部署到国内的 VPS
    • 优势：速度快
    • 劣势：需要购买 VPS、需要备案
  • 博客部署在 GitHub Pages 上并采用 CDN 加速
    • 优势：速度快、无需备案、稳定
    • 劣势：CDN 比较贵

CDN 介绍

内容分发网络（Content delivery network 或 Content distribution network，缩写：CDN）是指一种透过互联网互相连接的计算机网络系统，利用最靠近每位用户的服务器，更快、更可靠地将音乐、图片、影片、应用程序及其他文件发送给用户，来提供高性能、可扩展性及低成本的网络内容传递给用户。

简单来说，CDN 就是部署在世界各地的缓存服务器，它们会提前缓存网站上的资源，然后当用户想要访问相关资源时，直接从 CDN 服务器上取就可以了。这样不仅可以增加访问速度减少访问延迟，还可以减缓网站服务器上的压力。

为什么选择 Cloudflare？

国内的 CDN 服务提供商有不少，但是基本都需要备案，因此我转向了 Cloudflare 这个国外的 CDN 服务提供商。

Cloudflare 是全球最大的 DNS 服务提供商之一。除此之外他们还提供 CDN、SSL 证书、DDos 保护等服务，并且 Cloudflare 与百度有合作，在国内也部署有大量的节点，还能顺便解决百度爬无法抓取 GitHub Pages 的问题。

快速开始

  • 首先要去 Cloudflare 注册一个帐号。注意：我们需要的是国际版的 CloudFlare，而不是 CloudFlare 与百度合作的百度云加速。

  • 注册好后点击 Add site 添加你的网站个性化域名。

  • 添加好后选择免费的那个计划（Plan），有钱也可以选择收费的，提供的服务更多。

  • 然后点击 Scan DNS Records，等待扫描完成。即使没有扫到 DNS 记录也没有关系，我们可以在后面自己添加：

添加记录

然后 Cloudflare 会要你把你的 DNS 服务器替换成他提供的，我们只需要去域名商那里设置一下即可。CloudFlare 既是一个 CDN 服务商，同样也是一个 DNS 服务商。DNS 修改完成后可以点击 Recheck Nameservers 来复查 NS 记录是否正确设置。

Cloudflare 配置详解

Overview 菜单设置

主要关注下面两个快捷设置：

  • under attack mode：当你的网站被攻击的时候打开它，这样可以阻止攻击。
  • development mode：由于 cloudflare 采用了缓存技术，当你更新了网站的内容，不一定能马上在前台看到更新的内容。这个时候你只要打开 development mode 就可以马上看到网站更新的内容。当然，正常情况下还是关掉比较好。

OverView菜单

Analytics 菜单设置

这里主要是看网站使用 cloudflare 之后的一些分析数据，Analytics 下面包含几个子菜单：Traffic、security、Performance、DNS。

  • Traffic 子菜单：主要是网站在过去某一个时间段的请求、带宽、访客情况。
  • Security 子菜单：主要是某一段时间内受到的威胁数据，包括威胁次数、来自哪些国家、威胁的类型等等。
  • Performance 子菜单：付费功能。
  • DNS 子菜单：主要是 DNS 查询的数据。

DNS 菜单设置

在 DNS 菜单里面，你可以随意添加或删除所有 DNS 记录，也可以选择使用或不使用 cloudflare 的 CDN 服务。

注意：只有 A 记录和 CNAME 记录才可以设置使用 CDN 服务，我们只需要点亮 Proxy status 处的云彩小图标即可切换成使用 CDN 的状态。

SSL/TLS 菜单设置

这里面主要是网站加密的设置。

  • SSL 设置：如果你本来的网站有 SSL 证书，这里选择 full 即可，即浏览器到 Cloudflare 和 Cloudflare 到服务器都是加密的。
  • Always Use HTTPS 设置：这个打开，一直使用 https 链接。
  • Authenticated Origin Pulls & Opportunistic Encryption & Onion Routing 设置：这些设置都打开
  • Minimum TLS Version 设置：选择 1.1 即可，如果选择太高可能导致网站打不开。

Firewall 菜单设置

Firewall 菜单里面可以对网站安全进一步设置，限制某些 IP 或地区的用户访问等。

  • Events 子菜单：这里面可以查看防火墙的一些小事件，比如屏蔽的一些访问。

  • Managed Rules 子菜单：付费功能。

  • Firewall Rules 子菜单：这里可以设置限制其他人访问你的网站的规则，每个账户只能设置 5 个限制规则。

  • TOOLS 子菜单：这里的功能是 firewall rules 功能的补充，都是对用户访问你的网站的一些设置。

    • IP Access Rules：主要是针对 IP、IP 范围及国家和 ASN 设置一些规则。
    • User Agent Blocking：对用户使用的代理设置规则，比如浏览器类型、CPU、操作系统。

  • Settting 子菜单：

    • Security Level：这个设置 low 即可，如果设置太高，就会过于敏感，导致很多用户受影响。
    • Challenge Passage：这是验证的有效期，可以设置久一点，比如 1 hour。
    • Browser Integrity Check 和 Privacy Pass Support：全部打开。

Speed 菜单设置

  • Auto Minify：网页最小化处理，把 Javascript, css html 前面都打勾即可。
  • Brotli：这是一种比 gzip 更好的网页压缩方式，打开即可。
  • Rocket Loader：这个需要测试决定是否需要打开，没有固定的答案，你可以打开之后，然后在不同的浏览器上面查看网页的效果，如果出现网页排版等问题，那就将它关闭。

Caching 菜单设置

  • Purge Cache：这个设置是清除缓存，其中：

  • Custom Purge：清除指定页面的缓存，我们可以点击 custom purge, 然后在框里面输入要清除的链接，再点击 purge 即可。

    • Purge Everything：清除整个网站的缓存。

  • Caching Level：缓存水平设置，决定缓存哪些内容，这里选择 standard 即可。

  • Browser Cache TTL：即浏览器缓存过期时间，决定浏览器多久向网站获取一次新缓存。

Page Rules 菜单设置

免费版本可以设置 3 个页面的规则。