Featured image of post 实战教程: 搭建个人博客 pt.3
Tutorial QNAP NAS

实战教程: 搭建个人博客 pt.3

同步静态博客至 Backblaze B2 和 Cloudflare

本系列教程为你展示搭建个人博客的技巧, 分为三个部分:

  • pt.1 - 创建本地博客网站项目
    • 使用 Hugo 构建静态博客.
  • pt.2 - 同步静态博客至 QNAP NAS
    • 使用 Qsync 从本地将静态博客同步至 QNAP NAS 上专属虚拟主机目录下.
  • pt.3 - 同步静态博客至 Backblaze B2 和 Cloudflare (本文)
    • 使用 HBS 3 (Hybrid Backup Sync 3) 从 QNAP NAS 将静态博客同步至 Backblaze B2, 并设置 Cloudflare 加速.

在经历了第二部分的实战教程: 搭建个人博客 pt.2 - 同步静态博客至 QNAP NAS后, 你的静态博客应该已可用于测试且相当于多了一个备份. 但这并非最终目的, 因为它还未公开发布.

要想公开发布一个博客网站, 就必须准备一个类似 QNAP NAS 的部署环境, 不同之处在于它必须是对任何人都可访问的.

通常可以使用服务器或虚拟主机空间作为部署环境, 但为了节省成本 (毕竟只是搭建个人博客), 这里选择将静态博客部署至 Backblaze B2 和 Cloudflare.

非常幸运的是可以使用 HBS 3 (Hybrid Backup Sync 3) 从 QNAP NAS 将静态博客同步至 Backblaze B2, 并设置 Cloudflare 加速.

Backblaze B2 云存储简介

Backblaze B2 云存储是一个类似 Amazon S3 的对象存储服务, 但价格却低很多:

存储空间 ($/GB/月)0.021 GB/月0.005 GB/月76%+ 降低成本
下载 ($/GB)0.05 GB/月0.01 GB/月成本降低 80% 以上

此外, 它还提供免费额度:

  • 存储
    • 前 10GB 的存储空间是免费的.
    • 超过 10GB, 收取 $ 0.005 /GB/月的费用, 大约是其他领先的云对象存储 (比如 S3) 成本的四分之一.
    • 存储成本按小时计算, 没有最低保留要求, 按月计费.
  • 下载流量
    • 每天下载的前 1GB 流量是免费的.
    • 超过 1GB, 收取 $ 0.01 /GB,
    • 但是通过 CDN 和计算合作伙伴 (Cloudflare 就是其中之一) 下载是免费的.
  • 事务
    • 每个下载操作都算作一个 B 类事务.
    • 每天前 2,500 个 B 类事务是免费的.
    • 超过 2,500 个 B 类事务, 按 $ 0.004/10,000 个事务的费率收费.
  • 没有 “惊喜” 账单
    • 如果你已经注册了 Backblaze B2, 你可能已经注意到你不必提供信用卡号. 你的 10GB 免费存储空间永不过期, 你也不会意外产生任何费用.

由于 Backblaze B2 和 Cloudflare 的合作伙伴关系, 二者之间的流量无需客户付费. 再加上 Cloudflare 本身的 CDN 功能会大大减少回源 (事务) 次数, 因此只需通过 Cloudflare 访问部署于 Backblaze B2 的静态博客, 就近乎于全免费, 这也是选择 Backblaze B2 的重要原因之一.

设置 Backblaze B2

注册 B2 账号

点击此处进行注册, 这里 Region 选择 “US-West”.

绑定手机号

登录后, 提示要给手机发验证码, 目前支持中国大陆的手机号, 接收时可能会有比较大的延迟, 比如延迟 1~2 小时, 但也可能立即收到.

验证码的有效期是 24 小时, 如遇延迟, 请等待.

创建存储库 (Bucket)

绑定了手机号再次登录后, 默认进入 “Buckets” 页, 也可点击此处进入该页.

现在创建一个存储库 (Bucket), 点击 “Create a Bucket”:

Bucket Unique Name: blog-zhaijia-fun, 不能包含 “.”, 即不能与域名同名, 最少6个字符, 且需在 Backblaze B2 全站范围内唯一.

Files in Bucket are: 选择 “public”, 表示对所有人都是可访问的.

其他选项保持默认值即可.

获取存储库的域名

随意上传一张示例图片, 例如: smiley.png

并查看其信息:

记下其中的域名 (图中红线所示的部分), 即: f000.backblazeb2.com, 你的可能和示例不同, 请以你自己的为准.

创建 App Key

为使用 HBS 3 (Hybrid Backup Sync 3) 从 QNAP NAS 将静态博客同步至 Backblaze B2, 首先要创建一个 App Key.

进入 “App Keys” 页, 也可点击此处进入该页.

Name of Key: NAS-HBS

Allow access to Bucket(s): 允许访问的存储库 (Bucket), 只选中 blog-zhaijia-fun

其他选项保持默认值即可.

点击 “Copy to Clipboard”, 会将 applicationKey 的值拷贝至剪贴板.

该值只在此处显示一次, 以后将无法查到.

强烈建议你将 applicationKey 和相对应的 keyID 保存至安全的地方, 它们是执行同步所需的关键参数, 千万不要泄露!

设置 Cloudflare 加速

你必须要有一个 Cloudflare 账号, 如果没有, 点击此处注册.

你必须要有一个域名并按照 Cloudflare 的指引将其导入 Cloudflare.

注意:

为行文方便, 本教程以 blog.zhaijia.fun 作为示例的静态博客域名和 Repo 名.

请勿照抄, 务必将其替换为你自己的域名!

登录 Cloudflare 后, 选择域名 zhaijia.fun .

设置 SSL/TLS

切换到 “SSL/TLS” 项.

点击右侧的 “Full (strict)",确保它被选中:

设置 DNS

切换到 “DNS” 项.

添加一个类型为 “CNAME” 的解析项目:

这里将域名 (子) blog.zhaijia.fun 作为前面找到的 f000.backblazeb2.com 的别名 (CNAME).

也就是说访问 blog.zhaijia.fun 就相当于访问 f000.backblazeb2.com.

请确保最右侧的开关是打开的 (图中红线所示的部分), 并点击 “Save” 保存.

此 CNAME 的 DNS 解析可能需要一定的时间才能生效, 请耐心等待.

此时, 拷贝示例图片的 Friendly URL, 并将其中的域名替换为 blog.zhaijia.fun, 可得:

https://blog.zhaijia.fun/file/blog-zhaijia-fun/smiley.png.

如果一切正常, 在浏览器中访问新的图片 URL, 你将看到这张图片.

设置 Transform Rules

切换到 “Rules” -> “Transform Rules” 项.

缩减 URL

点击 “Create transform rule” -> “Rewrite URL”:

Rule name: fix url path 1

然后点击 “Edit expression”, 并在下方输入框中输入:

1

not starts_with(http.request.uri.path, "/file/blog-zhaijia-fun") and not ends_with(http.request.uri.path, "/")

该文本中的 blog-zhaijia-fun 为存储库 (Bucket) 名称

点击 “Path” 下方的 “Rewrite to…” -> “Dynamic”, 并在右侧的输入框中输入:

1

concat("/file/blog-zhaijia-fun", http.request.uri.path)

最后点击 “Deploy”.

现在删除示例图片 URL 中的 “/file/blog-zhaijia-fun”, 可得:

https://blog.zhaijia.fun/smiley.png

如果一切正常, 在浏览器中访问新的图片 URL, 你将看到这张图片.

至此, 该 URL 将被用作示例图片的最终 URL .

自动搜索索引文件

Backblaze B2 提供的云存储服务并不像 Web 服务器那样在收到一个以 “/” 结尾的 URL 时会自动搜索索引文件, 比如: index.html, 而是返回 HTTP 404 (Not Found) 错误. 不过只需创建特定的 Transform Rule 就可模拟自动搜索索引文件.

类似前面的创建过程, 再次创建一个 “Rewrite URL” 规则:

Rule name: fix url path 2

然后点击 “Edit expression”, 并在下方输入框中输入:

1

not starts_with(http.request.uri.path, "/file/blog-zhaijia-fun") and ends_with(http.request.uri.path, "/")

该文本中的 blog-zhaijia-fun 为存储库 (Bucket) 名称

点击 “Path” 下方的 “Rewrite to…” -> “Dynamic”, 并在右侧的输入框中输入:

1

concat("/file/blog-zhaijia-fun", http.request.uri.path, "index.html")

最后点击 “Deploy”.

从响应中删除 Backblaze B2 HTTP 标头

通常, 下面的 Backblaze B2 HTTP 标头将被包含在响应中:

  • x-bz-file-name
  • x-bz-file-id
  • x-bz-content-sha1
  • x-bz-upload-timestamp
  • x-bz-info-src_last_modified_millis

删除它们, 除了可以防止某些信息的泄露之外, 还能减少网络传输的字节数.

点击 “Create transform rule” -> “Modify Response Header”:

Rule name: remove b2 headers

然后点击 “Edit expression”, 并在下方输入框中输入: true

点击 “Select item…” -> “Remove”, 并在右边的输入框中输入某个 Backblaze B2 HTTP 标头.

可通过点击 “Set new header”, 添加另一个待删除的 Backblaze B2 HTTP 标头.

重复这个过程, 直至上面的 5 个 Backblaze B2 HTTP 标头都被添加:

最后点击 “Deploy”.

通过 ETag HTTP 标头优化缓存效率

编辑刚才创建的规则 “remove b2 headers”, 点击 “Set new header”, 选择 “Set dynamic”, 在下方的两个输入框中分别输入:

  • 左边:
1

ETag
  • 右边:
1
2
3

concat(http.response.headers["x-bz-content-sha1"][0],
http.response.headers["x-bz-info-src_last_modified_millis"][0],
http.response.headers["x-bz-file-id"][0])

这表示使用所访问资源的 sha1, src_last_modified_millis 和 file-id 构造 ETag HTTP 标头.

最后, 点击 “Save” 保存.

创建 HBS 3 同步任务

登录 QNAP NAS Web 端, 打开 “HBS 3 Hybrid Backup Sync”.

点击 “同步” -> “立即同步” -> “单向同步作业”:

名称: B2 blog-zhaijia-fun

keyID: Backblaze B2 中已创建的 keyID

应用程序密钥: Backblaze B2 中已创建的 applicationKey

作业名称: 同步 blog.zhaijia.fun

描述: 从 QNAP NAS 将静态博客同步至 Backblaze B2

操作: 镜像, 意为同步后, QNAP NAS 和 Backblaze B2 两方的目录/文件是相同的, 而 Backblaze B2 方存储的其他数据将被删除.

点击左侧 “添加配对文件夹” 右边的 “+”, 选择 QNAP NAS 上的目录: Web/blog.zhaijia.fun

点击右侧 “添加配对文件夹” 右边的 “+”, 选择 Backblaze B2 上的目录: /

保持默认选项 “没有计划”, 意为手工运行该同步任务.

点击 “下一步”, 查看任务摘要, 并 “创建”:

至此, 同步任务创建完毕.

任何时候, 只要点击图中的 “立即同步” 即可将静态博客从 QNAP NAS 同步至 Backblaze B2.

浏览静态博客

现在从浏览器中访问 https://blog.zhaijia.fun, 看看成果吧!

© 2020 - 2022 快乐宅家
Built with Hugo
主题 Stack 由 Jimmy 设计