Rin 博客简易部署教程 基于 Cloudflare Pages + Workers + D1 + R2 全家桶 - 资源荟萃 - LINUX DO
同步来源：树洞剪藏 源站剪藏 ID：190 原文地址：https://linux.do/t/topic/230624/12
Rin 博客简易部署教程 基于 Cloudflare Pages + Workers + D1 + R2 全家桶 - 资源荟萃 - LINUX DO
跳到主要内容
话题
我的帖子
关于
友链
文档
更多
外部链接
Status
Connect
Channel
Telegram
类别
开发调优
资源荟萃
文档共建
跳蚤市场
前沿快讯
福利羊毛
搞七捻三
运营反馈
深海幽域
所有类别
标签
抽奖
公告
精华神帖
快问快答
人工智能
所有标签
消息
收件箱
频道
常规频道
直接消息
聊天
Default
真诚 、 友善 、 团结 、 专业 ，共建你我引以为荣之社区。 《常见问题解答》
Rin 博客简易部署教程 基于 Cloudflare Pages + Workers + D1 + R2 全家桶
资源荟萃
771
浏览量
40
赞
6
链接
12
用户
2
10月 13 日
12 / 13
11月 13 日
11 天
前排围观支持一下 感谢分享大佬厉害啊 有点厉害支持~~
老王 baolaowang
1 10月 13 日 #1
Rin 是什么
一款基于 Cloudflare Pages + Workers + D1 + R2 全家桶的博客
本文章全搬运： 笨蛋小破站 73 网站
说人话：
前端纯静态页面，后端提供 API 给前端拉取文章和配置信息，一切都在 Cloudflare 上完成
0a279540c54c72ff10c5460367fe99c8_958bc2c1-1703-4127-920c-853291495bdc.jpg 1280×640 179 KB
写在前面
为什么应该 选择它
无需服务器无需备案，只需要一个解析到 Cloudflare 的域名，且在一定的用量内完全免费（对于小型个人博客绰绰有余）
它适合哪些人
不想架设服务器、维护动态博客的人
追求轻量化的人
喜欢云原生的人
希望一切皆可白嫖的人
它可能不适合的人
追求高大全的人
既要又要事多的人
已有较多博客文章需要迁移的人
目前 Rin 仅支持从 Wordpress 批量导入文章，其他博客的数据迁移可能会较为繁琐
注意
目前 Rin 属于刚起步阶段，功能还是稳定性上都稍不尽人意，请在部署前做好心理准备
Cloudflare 需要绑定支付方式才可启用 R2 功能，你可以绑定 Paypal 或银行卡来激活 （料卡也不是不行，它不验卡的）
本文所使用的 Rin 为 官方版本 16 ，而本站所使用的为 个人修改版 10 ，由于 99% 的代码都来自 ChatGPT 而且实现方式都是依托答辩， 不会考虑将自己的版本提交官方。如果有需要可以自行部署
如果使用我的修改版遇到了问题，请先行联系我而不是官方仓库以免造成困扰
准备工作
你需要先准备以下内容
一个 GitHub 账号
一个 Cloudflare 账号，同时已经解析自己的域名
带上脑子和手还有耐心
正式部署
首先打开 Rin 项目地址，点击 Fork 按钮
2c03e90cd31323f3a4344e6cd433f3dfcae433ca.png 1048×524 45.8 KB
由于 Rin 是一个前后端分离的项目，我们需要分别部署前端和后端
前端
打开 Cloudflare 控制台 4 ，进入侧边栏的 Workers 和 Pages，然后点击 创建
3bbeb32f6aba513b7b096f18b49bb4c9f06829c0.png 2090×1195 199 KB
转到 Pages 选项卡，点击 连接到 Git
ef8de23323091f433f06e586ae4d95ca62c44b61.png 921×791 50.3 KB
如果你之前没有使用过 Cloudflare Pages，那么这里会让你进行授权
授权之后，选择你所 Fork 的存储库，然后点击 下方的 开始设置
bdd5db90f527e614fb766eb06e0f402f9a010c06.png 1150×1441 63.5 KB
构建命令：bun b
构建输出目录：client/dist
没有提到的项目保持默认值
填写之后点开环境变量（高级），添加以下变量（注意不要有多余的空格）
NAME =Xeu # 昵称，显示在左上角
DESCRIPTION =杂食动物 # 个人描述，显示在左上角昵称下方
AVATAR =https://avatars.githubusercontent.com/u/ 36541432 # 头像地址，显示在左上角
API_URL =https://rin.xeu.life # 服务端域名，可以先使用默认值查看效果，后续部署服务端后再修改
PAGE_SIZE = 5 # 默认分页大小，推荐 5
SKIP_DEPENDENCY_INSTALL = true
UNSTABLE_PRE_BUILD =asdf install bun latest && asdf global bun latest && bun i
最后两行环境变量 SKIP_DEPENDENCY_INSTALL 和 UNSTABLE_PRE_BUILD 不要修改，按原样添加即可
a0fe2e468167372ed993872acc4865462a82d25f.png 1268×622 15.7 KB
点击 保存并部署，等待构建部署，不出意外的话约 30s 后即可部署完成
ee036926adc1deaa3fc3215018e1eef38f06f4b0.png 1219×253 4.87 KB
回到 Pages 管理页，转到 自定义域，点击 设置自定义域，绑定自己的前端域名
a7eb41026b2fc21ca2592152f4c7a4448a1f6967.png 1300×490 32.1 KB
等待状态变为 有效，打开域名即可看见前端页面
7c5287608f98df6c2bd7ac6ad2c154b6e34568ae.png 2560×1198 69.8 KB
至此，恭喜你，已经完成了一半的操作 其实真正复杂的是后端的部署
后端
这里并不需要自行去 Cloudflare Workers 新建项目，后端采用 GitHub Actions 部署，你只需要配置好 GitHub 这边就行
配置 Cloudflare R2 存储桶
新建存储桶
进入 Cloudflare 控制台，转到侧边栏的 R2，点击 新建存储桶
afd3f4affa25dc46ee34c001801af2a77bd0a31f.png 1575×802 65.1 KB
随意填入名称，然后点击 创建存储桶
提供位置提示 可不选，选择亚太地区也许能获得一部分速度提升（？
2c27ca6e396e38af8b32ff9c9c68e54de23b2103.png 1500×1065 86.2 KB
存储桶配置
进入存储桶，点击设置，复制 S3 API
4009ffb90645614bf2e9345020b4df5e4d8610b0.png 1320×1093 45.7 KB
在下方 公开访问 中绑定一个域名
f5135e8ea27e4457d69589b54e065b5e8112f986.png 1012×729 53.7 KB
下方 CORS 策略，点击 添加 CORS 策略
注：这一步可能并不需要，但为了避免问题还是建议提前配置跨域
将下方的 https://vcrr.us.kg 自行替换为自己的前端域名
[
{
"AllowedOrigins" : [
],
" AllowedMethods ": [
" GET ",
" DELETE ",
" HEAD ",
" POST ",
" PUT "
],
" AllowedHeaders ": [
" Content-Type "
]
}
]
回到 概述，点击 管理 R2 API 令牌
9668970b041b486b4e587c28846549508b4ac99b.png 719×282 17.6 KB
选择 创建 API 令牌
a0d51f19eb9574cb12785f0d026c50cc7902a086.png 1077×323 28.1 KB
名称随便填，权限选择 管理员读和写，然后点击 创建 API 令牌
5658563375894d050bf8a249d5cd17f9dc4f6e6e.png 1685×1808 175 KB
记录下下方的 访问密钥 ID 和 机密访问密钥 获得令牌的人会获得账户的控制权，请不要将令牌随意发送给他人或公开
d1bad391e7d86a9594f2fed8139b81086bbe6cf8.png 932×496 20.1 KB
前往 Cloudflare 获取 账户 ID 和 API 令牌
进入 Cloudflare 控制台，随意进入一个域名，记录下方的 账户 ID
进入右上角的 我的个人资料
进入侧边栏的 API 令牌，点击 创建令牌
cc19f283b0614137e6d5c954f6bb86f62bb5b8cf.png 1588×595 56 KB
点击最下方 编辑自定义令牌 右侧的 开始使用
f02015200118436a05d746782812b787b2e11b79.png 1255×274 17.4 KB
为令牌授予 Workers R2 存储 D1 Workers 脚本 的 编辑 权限
TTL 可以留空以永久生效，也可以设置一个时间（过期前需要重新生成令牌）
如下图所示，然后点击 继续以显示摘要
443dcb5f996de26adc5aa8f2c6fed8f83e456288 (1).png 1192×1717 154 KB
点击 创建令牌
729416e783cce6cd68360f51845484b979ac29c9.png 996×584 31.9 KB
记录下生成的令牌以便后续使用
获得令牌的人会获得账户的控制权，请不要将令牌随意发送给他人或公开
ac82210ddab22d01f54fe08ac85191d553dc9fd3.png 1090×367 27.9 KB
接入 GitHub OAuth
Rin 的登录系统采用的是 GitHub 授权，因此你需要先去申请一个 GitHub OAuth App
进入 GitHub OAuth Apps，点击 New OAuth App
按照以下参数进行填写
Homepage URL 填写上面的前端地址
Authorization callback URL 填写 https://<你的后端地址>/user/github/callback
这里的后端地址即后面你的 Cloudflare Workers 需要绑定的域名，我这里以 https://rin.obdo.cc/user/github/callback 1 为例
f5d004c7688fd0d77df793b31f78c959b25e0229.png 962×1089 61.8 KB
点击 Register application
然后点击 Generate a new client secret，这里可能会需要进行二步验证
记录下生成的 Client ID 和 Client secret
1122552f9f0bc975bb8034847d3619bb4601e3c0.png 1771×1207 142 KB
配置 GitHub Actions
打开自己 Fork 的 GitHub 仓库，依次转到 Settings、Secrets and variables、Actions、Variables
8df78014b903ed3d3b1c253e3c98a087475fe0b9.png 1991×847 77.6 KB
将以下的值，依次点击 New repository variables 并添加
FRONTEND_URL =前端地址，填写上文前端所绑定的域名，如 https://blog.obdo.cc
S3_BUCKET =R2 存储桶名称，如上文示例中的 rin-storage
S3_REGION =auto
S3_ENDPOINT =R2 的 S3 API，去掉域名后面的路径，如 https:// 1234567890 abcdef1234567890abcd.r2.cloudflarestorage.com
S3_ACCESS_HOST =R2 公开访问域名，如上文示例中的 https://rin-storage.obdo.cc
添加好之后应该是这样的
95bcd6346cdc8660a799d2f4636c9137cbb1e487.png 1379×596 33.2 KB
然后转到 Secrets
8df78014b903ed3d3b1c253e3c98a087475fe0b9 (1).png 1991×847 77.6 KB
将以下的值，依次点击 New repository secret 并添加
密码生成器 3
CLOUDFLARE_ACCOUNT_ID =Cloudflare 的 账户ID
CLOUDFLARE_API_TOKEN =Cloudflare 的 用户API令牌 值
RIN_GITHUB_CLIENT_ID =上文生成的 Github Client ID
RIN_GITHUB_CLIENT_SECRET =上文生成的 Github Client Secret
JWT_SECRET =加密用的密钥，你可以使用密码生成器随机生成一个
S3_ACCESS_KEY_ID =存储桶API的 访问密钥ID
S3_SECRET_ACCESS_KEY =存储桶API的 机密访问密钥
添加好之后应该是这样的
由于是 Secrets 所以不会显示值，添加时务必确认添加正确
00fb37c65d8a0f58a15c45209206065228b0edc6.png 801×736 31.1 KB
进入你 Fork 仓库的 Actions 界面
第一次进入时页面上只会显示一个按钮，点击之后开启 Actions 功能
进入 Deploy 菜单，点击 Run workflow
09306469facbffa5ef4f02a3037b4f728b7efa2e.png 1349×847 91.3 KB
静待约一分钟左右，等待出现绿勾代表部署完成
如果显示的是叉请检查环境变量的配置是否有误
对接前后端
首先，提前祝贺下自己，你已经完成了前端与后端的部署，接下来只差最后一步，就是对接前后端了
进入 Cloudflare 控制台 4 ，转到侧边栏的 Workers 和 Pages
如果前面部署的一切顺利，这里你应该会看到一个名为 rin-server 的 Worker
进入 rin-server 的设置，转到 触发器
点击 添加自定义域，绑定自己的后端域名
点击 添加路由，依次加入 前端域名 /sub/* 前端域名 /seo/*
如下图所示
f5daabbf93deb40ecfbdf00de79ef5dc659b8491.png 2387×1086 129 KB
回到前面创建的前端 Pages 设置
将 制作 与 预览 的 APL_URL 均修改为后端域名
fe6d86940ef98084021dbfb1b735d1310f6979e0.png 1767×1796 170 KB
进入部署页，点击 重试部署
1fcface135738d028859669d1b64400427c75459.png 1546×917 75.7 KB
等待一到两分钟部署完成
打开你的前端域名，点击右上角的 GitHub 登录
第一个登录的人会成为站点的管理员
至此，大功告成，恭喜你拥有了一个 Rin 博客
heart
+1
28
回复
771
浏览量
40
赞
6
链接
12
用户
2
吃瓜娜美 NaMei_ZZ 圆圆满满
10月 13 日 #2
前排围观支持一下 1 个回复
2 回复
大榕树 shuawag 活跃用户 吃瓜娜美 10月 13 日 #3
mark！mark！
1 回复
dogelee
10月 13 日 #4
支持下大佬
我用的方案 gridea+cloudflare pages，地址就在签名上
1 回复
大帅哥 handsome 种子用户
10月 13 日 #5
感谢大佬教程！
1 回复
Fish Yuccc 活跃用户
10月 14 日 #6
感谢分享，mark 一下
1 回复
zdd 浴火重生
10月 14 日 #7
感谢分享～mark 一下
1 回复
MeowcoQAQ （でらっくま） azQAQ 大预言家
10月 14 日 #8
不错，很详细
1 回复
10 天后
nax
10月 24 日 #9
CORS 配置不能用
1 回复
FrancisLiu 活跃用户
10月 26 日 #10
感谢大佬分享，正好需要
1 回复
mofish
10月 26 日 #11
太强了 教程写得十分详细
1 回复
17 天后
FrancisLiu 活跃用户
19 天 #12
大佬，有个疑问，这个怎么更新后端代码，重新部署报错数据库已存在，我看 workflow 中 scripts/migrator.ts 不会排除数据库已存在的情况
1 回复
jiangly QAWS12g 浴火重生
11 天 #13
我已经部署成功但是 github action 好像会重新部署拉取更新吗，出现了这个错误
1101 packages installed [18.30s]
Blocked 10 postinstalls. Run bun pm untrusted for details .
Failed to create D1 "rin"
⛅️ wrangler 3.69 . 1 (update available 3.88 . 0 )
✘ [ERROR] A request to the Cloudflare API (/accounts /***/ d1/database) failed. DUPLICATE_DATABASE_ERROR [code: 7500]
If you think this is a bug, please open an issue at: https://github.com/cloudflare/workers-sdk/issues/new/choose
Error: Process completed with exit code 1 .
回复
分享
加入书签
举报
回复
已取消置顶
常规
您会在别人 @ 您或回复您时收到通知。
推荐
相关
新话题和未读话题
话题列表，带有按钮的列标题可以排序。
话题
回复
浏览量
活动
唐纳德 • 特朗普钦定的 Java 脚手架，让 Java 再次伟大！v2.7 （已接入L站登录福利） 164 免打扰
资源荟萃
Java
779
11/10 00:00
7 小时
【Cloudflare系列教程】汇总帖 120 免打扰
资源荟萃
精华神帖
157
03/05 14:27
16 小时
DeepLX已切换至 LINUX DO Connect 认证 deeplx.org 121 免打扰
资源荟萃
DeepLX
1.4k
06/14 16:04
19 小时
开个帖子，大家一起来推荐Mac 下非常好用的软件吧 38 免打扰
资源荟萃
精华神帖
372
09/09 00:00
1 天
一个月全力打造，开源网站助您快速完成论文，集成 ChatGPT 实现真实文献引用 16 免打扰
资源荟萃
ChatGPT
583
02/10 13:47
2 天
有 108 个未读 话题 和 181 个新 话题，
或浏览 资源荟萃 中的其他话题
开始阅读 启用自动点赞
楼主 AI
等级