chen的文档&blog

外观

利用cloudflare加速githubpages

复制页面

约 1225 字大约 4 分钟

博客建站程序型知识

2024-08-26

本文引自:QinYu 的博客

1. 前言

对于国内大陆用户而言，想要直接访问用 github 托管的个人博客不是件容易的事，为了解决网络不可达问题，可以采用 CDN(content delivery network)将网页内容分发到全球各地的服务器上，同时还能缩短网站加载时间。

image-20231204215539220

但是大部分国内的 CDN 服务都是收费的，所以就把目光转向了 cloudflare。cloudflare 作为全球最大的网络服务提供商，提供免费的 cdn 服务，虽然 cdn 节点都在国外，但还是比直接访问 github.io 要快的多，不过免费版请求次数限制有 10w 次的限制，但对于我们博客而言是绰绰有余了，下面介绍配置过程。

2. 准备

使用 cloudflare 的 cdn 服务需要我们拥有一个可配置的域名，所以需要先购买一个域名，本人是在腾讯云上购买的.space的后缀的域名，10 年价格也只要一百多，还是很便宜的，购买域名的教程就跳过了。

3. 教程

注：教程中的qinyu.me和qinyu.space都是本人域名，所以在以下内容中可以视为同一个。

3.1 配置 cloudflare

  1. 进入https://www.cloudflare-cn.com/，注册账号并登录

  2. 在左侧栏中进入网站一栏，点击右方添加站点

    image-20231204222749831

  3. 输入自己的域名，注意不要带www或者https，比如我的就直接填写qinyu.space

    image-20231204223059530

  4. 选择套餐，free即可

    image-20231204223242693

  5. 点击继续后 cloudflare 会自动扫描域名的 dns 记录，如果是刚刚创建的域名，可能扫描的结果为空。截图中的几条记录可以不用管

    image-20231204223942549

  6. 这一步很重要，点击添加记录，按照如下方式添加类型为 A，名称为@，IPv4 地址为185.199.108.153

    image-20231204224450727

    按照上述方式再添加以下三条记录，类型和名称和上述相同，IPv4 地址分别为：

    185.199.109.153
185.199.110.153
185.199.111.153

    完成之后应该能看到列表中有以下四条这样的记录，除了名称是自己的域名外其他应该都和图中相同

    image-20231204225200173

    上述添加的 4 条 ip 地址均是 GitHub Pages 的 IP 地址，具体可查看【https://docs.github.com/zh/pages/configuring-a-custom-domain-for-your-github-pages-site/managing-a-custom-domain-for-your-github-pages-site】

  7. 点击继续后，cloudflare 会要求将我们 DNS 服务器修改为以下图中所示的的服务器，可以先截个图或者存文档里：

    image-20231204230559749

  8. 点击下方继续后会有一个快速入门指南，里面的配置可以都开启：

    image-20231204233423686

3.2 修改 DNS 服务器

进入腾讯云控制台，修改的 DNS 服务器为 3.1 第 7 步中 cloudflare 提供的 DNS 服务器，如下所示：

image-20231204231234047

DNS 服务器更改后生效需要一段时间，少则几分钟，慢则需要几个小时

过一段时间可以看到 DNS 服务器已经修改成功了

image-20231204232327896

返回 cloudflare，如果看到 “Cloudflare 正在保护您的站点”说明已经配置成功了：

image-20231204233838791

3.3 设置 Github page

进入 github.io 对应的仓库，进入 Settings：

image-20231204234453901

进入左栏中的pages，在 Custom domain中输入自己的域名，点击save，如果成功会显示下图：

image-20231204234850740

这样就可以通过域名来访问自己的博客了，还可以在上图中勾选 Enforcrs HTTPS，这样网站仅会通过 https 提供服务。

如果如下图显示 dns 配置不正确，推测可能是使用了 cloudflare 后，GitHub 验证 DNS 时返回的是 cdn 服务器的 ip 地址，而不是在 cloudflare 上开始配置的 4 个 GitHub page 的 ip 地址，可以在线 dig 一下自己的域名验证一下。不过只要网站能通过域名正常访问就没什么问题。

img