AI 仓库情报摘要

FR-AI / ANALYSIS

为什么值得关注

它提供了一个完整的零成本无服务器导航解决方案，支持基于 Git 的简易部署、内置数据备份/迁移，并可跳过 R2 仅使用外部图片链接，灵活性强。

适合谁使用

希望学习 Cloudflare 生态的无服务器项目的开发者
想要搭建个人书签或导航站点的用户
需要一个轻量级内部资源中心的团队
对 Cloudflare D1、R2 和 Hono 集成感兴趣的技术爱好者

典型使用场景

整理常用链接的个人起始页
团队分享内部工具和资源的门户
学习 Cloudflare Pages Functions 和 D1 的演示或参考项目
自托管替代云端书签服务

项目优势

完全无服务器，运行在 Cloudflare 免费额度上，配额慷慨
既支持 R2 图片上传，也支持纯外部链接，部署灵活
包含完整的后台管理面板，支持 JWT 认证和数据备份/导入
通过 Git 集成一键部署到 Cloudflare Pages

使用前须知

与 Cloudflare 生态（D1、R2、Pages Functions）紧密绑定
本地开发需要 Wrangler CLI 并手动配置数据库
上传和图片库功能依赖 R2，若不绑定则这些后台功能不可用

README 快速开始

Nav-item · 导航站（Cloudflare 全家桶版）

👨‍💻 致谢

基于 eooce 的 nav-item 改造为 Cloudflare Pages 部署版。

一个现代化的导航网站：Vue 3 前端 + Cloudflare Pages Functions (Hono) 后端，数据存 Cloudflare D1，图片存 Cloudflare R2。完全 Serverless，可跑在 Cloudflare 免费额度上，Fork 一下、连接 Git 就能部署。

📸 项目预览

首页导航	后台管理

🛠️ 技术栈

前端：Vue 3 + Vue Router + Vite（构建产物输出到 web/dist）
后端：Cloudflare Pages Functions + Hono
数据库：Cloudflare D1（SQLite 兼容）
对象存储：Cloudflare R2（上传的图标 / 背景图）
认证：JWT（hono/jwt）+ bcryptjs

⚙️ 绑定与变量一览

名称	类型	必需	说明
`DB`	D1	✅	主数据库
`BUCKET`	R2	⬜	上传的图标 / 背景图（不绑定则改用外链，详见下方）
`JWT_SECRET`	机密/变量	✅	JWT 签名密钥，生产环境务必用强随机值
`TOKEN_TTL_HOURS`	变量	⬜	登录 token 有效期（小时），默认 `168`（7 天）

🚀 快速部署（推荐：连接 Git 自动部署）

准备工作：一个 Cloudflare 账号 + 一个 GitHub 账号。

步骤 1：Fork / 推送本仓库到 GitHub

把本项目推到你自己的 GitHub 仓库（或 Fork 原仓库）。

步骤 2：连接到 Cloudflare Pages

进入 Cloudflare 控制台 → Workers 和 Pages → 创建 → Pages → 连接到 Git，授权并选择你的仓库。在构建设置里填：

设置项	值
框架预设 Framework preset	`None`（无）
构建命令 Build command	`npm run build`
构建输出目录 Build output directory	`web/dist`

其余保持默认，点击 保存并部署。（首次部署因为还没绑定数据库，/api/* 会报错，属正常，绑定后重新部署即可。）

步骤 3：创建 D1 数据库

控制台 → 存储和数据库 → D1 SQL 数据库 → 创建，名称填 nav-item-db。

步骤 4：创建 R2 存储桶

控制台 → R2 对象存储 → 创建存储桶，名称填 nav-item-uploads。

🖼️ 不使用 R2（纯外链模式）

R2 只用来存"从后台上传的图片文件"，卡片图标、背景图、Favicon、广告图、友链 logo 这些字段本身在 D1 里就是普通的 URL 字符串，与 R2 无关。所以可以完全不绑定 R2，只用外链（图床 / 图片 API / 任意可访问的图片 URL）：

部署时跳过「步骤 4：创建 R2 存储桶」和「步骤 5」中 BUCKET 的绑定，DB 和 JWT_SECRET 照常配置。
后台的每个图片位置都提供两种模式：
- 输入 URL → 直接粘贴外链，走这条路径不需要 R2。
- 上传图片 / 选择已上传 → 依赖 R2，未绑定时点击会报错，请忽略。
卡片图标既可以填外链，也可以留空由前端自动获取网站 favicon。

优点：零对象存储成本、图片自带 CDN。代价：图片依赖第三方服务的可用性；后台的"上传"与"图片库"功能不可用。

步骤 5：绑定服务

进入你的 Pages 项目 → 设置 → 绑定 → 添加绑定，添加以下三项（变量名必须完全一致）：

类型	变量名	指向
D1 数据库	`DB`	`nav-item-db`
R2 存储桶	`BUCKET`	`nav-item-uploads`

再到 设置 → 变量和机密，添加一个机密：

变量名	值
`JWT_SECRET`	一段强随机字符串（用于签名登录 token）

步骤 6：重新部署

Pages 项目 → 部署 → 在最近一次部署右侧选择 *重新部署

nav-item-cf