Cloudflare + 腾讯云,博客白嫖再升级

这两天有时间,又升级了一下自己博客的部署方式,效率和性能又更好了,还不花钱👍。

效果

目前博客还是使用的 hexo 配合 next 主题,播客的内容是在 notion 中写的,通过一个 Github Action 拉取 notion 的内容,转换成 hexo 的 markdown 文件提交到代码库中, 同时图片上传到 Cloudflare 的 R2 对象存储中。

image.png

Notion 的写作体验还是很不错的,图片也可以正常插入,每次写完只需要到 Github 上执行一下 action 就不用管了。

Cloudflare 和 腾讯云都是白嫖的,博客的用量达不到收费标准。

Notion

在 Notion 中可以把所有博客都放在一个 database 中,这样状态管理和各种属性都可以随便设置供后续环节消费。例如和指定博客的日期,URL 路径,标签,是否还在编写中等。

image.png

Notion 中还可以增加一个 Button,点击直接跳转到对应的 Github Action 中。

image.png

至于 Notion 中内容的读取,我们可以使用 Notion 官方提供的 SDK,再配合 notion-to-md 写个简单的脚本就可以了。

Cloudflare R2 是兼容 aws s3 协议的,所以上传照片我直接用的 @aws-sdk/client-s3,AI 时代了,写这些东西都非常容易了。

Cloudflare images transformation

之前写博客一直有一个痛点,照片直接传原图,每个都要几M大小,访问起来太慢了。但 images transformation 的存储是要收费的,这里我转了一下,先把照片存储到了 Cloudflare R2,之后用一个 worker 搞了一个服务用于访问 Cloudflare R2 中的照片,还可以加上 refer 检查。之后再用 images transformation 处理 Cloudflare R2 中的照片就好了。

开启 Image Transformation 很简单,只需要在选项中开启某个域名就可以了。

image.png

之后就可以通过拼接 URL 参数的形式对图片进行裁剪了,例如我们有这样一个图片域名,已经不论通过什么方式经过 Cloudflare 了:https://yourdomain.com/path/to/image.jpg 那么只需要在 hostname 后面的 path 中加上参数就可以了:

https://yourdomain.com/cdn-cgi/image/width=500,height=300,quality=85,fit=cover/path/to/image.jpg ,中间加粗的是要拼的内容。

Tencent EdgeOne Pages

其实之前博客站点也是直接托管在 Cloudflare 中的,但我的备案是在腾讯云完成的,要求我必须用腾讯的服务。之前腾讯有一个云开发 CloudBase 功能,可以直接帮助托管静态站点,但后来它收费了。收费本身是没有问题的,但一个 CDN 服务收的价格有点离谱,他是打包在低代码站点开发服务中一起卖的。不得已我就迁移成了传统的云服务器 + CDN 加速的模式。

现在腾讯云的边缘加速服务推出了 EdgeOne Pages,又又又是一个静态站点托管服务,目前还不收费,可以关联 Github 仓库直接编译生效,还不错。希望后面收费也不要太贵。

大功告成!文章虽然没写几篇,但是东西鼓捣的不少 😓。