🧭 智能导航站 · 让你的书签管理优雅如诗

一个基于 Cloudflare Workers + D1 + KV 的轻量级导航站，集前台展示、后台管理、分类拖拽排序、访客提交审核、链接健康检查于一体。
不花哨，但该有的都有，还带点小幽默 🤡。
仓库地址：https://github.com/luochen-zhang/lc_navigation/

📖 简介

你是否还在为浏览器书签栏的“乱葬岗”而头痛？
是否想拥有一个自己专属的、可随时随地方便管理的导航页？
这个项目就是为你准备的——自带后台管理面板，支持分类拖拽排序、链接一键导入导出、访客提交待审核，还贴心地内置了自动获取网站图标的“魔术棒”功能 ✨。

前台采用毛玻璃设计，自适应移动端，自带一句“每日一言”和快速搜索框；后台功能强大，你甚至可以直接拖拽卡片调整分类顺序，刷新页面即生效。

技术栈极其清爽：Cloudflare Workers + D1 数据库 + KV 存储，部署简单，免费额度足够个人使用，拿来即用，随心改造。

✨ 特性一览

🚀 部署指南

整个部署过程大约需要 10 分钟，准备好你的 Cloudflare 账号即可。

1. 准备工作

• 一个 Cloudflare 账号
• 已开通 Workers 和 D1 数据库（免费套餐即可）
• 可选：一个自定义域名（用于绑定 Worker）

2. 克隆项目

git clone https://github.com/your-username/nav-site.git
cd nav-site

3. 配置数据库

在 Cloudflare Dashboard 中创建 D1 数据库，比如命名为 nav-db。
然后执行以下 SQL 创建表结构：

-- ============================================================
-- 1. sites 表（链接主表）
-- ============================================================
CREATE TABLE IF NOT EXISTS sites (
  id INTEGER PRIMARY KEY AUTOINCREMENT,
  name TEXT NOT NULL,
  url TEXT NOT NULL,
  logo TEXT,
  desc TEXT,
  catelog TEXT NOT NULL,
  sort_order INTEGER DEFAULT 9999,
  create_time TIMESTAMP DEFAULT CURRENT_TIMESTAMP,
  update_time TIMESTAMP DEFAULT CURRENT_TIMESTAMP,
  health_status INTEGER DEFAULT 0,        -- 0=未检查, 1=正常, 2=异常
  health_error TEXT,                      -- 异常原因
  health_checked_at TIMESTAMP
);

-- 索引优化（提升查询性能）
CREATE INDEX IF NOT EXISTS idx_sites_catelog ON sites(catelog);
CREATE INDEX IF NOT EXISTS idx_sites_sort_order ON sites(sort_order);
CREATE INDEX IF NOT EXISTS idx_sites_health_status ON sites(health_status);

-- ============================================================
-- 2. pending_sites 表（待审核链接）
-- ============================================================
CREATE TABLE IF NOT EXISTS pending_sites (
  id INTEGER PRIMARY KEY AUTOINCREMENT,
  name TEXT NOT NULL,
  url TEXT NOT NULL,
  logo TEXT,
  desc TEXT,
  catelog TEXT NOT NULL,
  create_time TIMESTAMP DEFAULT CURRENT_TIMESTAMP
);

CREATE INDEX IF NOT EXISTS idx_pending_catelog ON pending_sites(catelog);

-- ============================================================
-- 3. category_orders 表（分类排序）
-- ============================================================
CREATE TABLE IF NOT EXISTS category_orders (
  catelog TEXT PRIMARY KEY,
  sort_order INTEGER NOT NULL
);

4. 配置 KV 存储

在 Cloudflare Dashboard 中创建一个 KV 命名空间，例如 NAV_AUTH，用于存储会话和站点配置。
然后在 wrangler.toml 中绑定：

kv_namespaces = [
  { binding = "NAV_AUTH", id = "your-kv-id" }
]

5. 设置管理员账号

首次启动后，需要通过 wrangler 或 Cloudflare 的 KV 控制台手动写入管理员账号密码：

# 使用 wrangler 命令行
wrangler kv:key put --binding=NAV_AUTH "admin_username" "your-admin-name"
wrangler kv:key put --binding=NAV_AUTH "admin_password" "your-strong-password"

6. 部署 Worker

wrangler deploy

完成后，访问你的 Worker 域名（或自定义域名）即可看到前台页面，访问 /admin 进入后台登录。

🧰 升级指南（v1 → v2）

如果你是从 v1 版本升级，需要执行以下数据库迁移：

-- 新增健康检查字段
ALTER TABLE sites ADD COLUMN health_status INTEGER DEFAULT 0;
ALTER TABLE sites ADD COLUMN health_error TEXT;
ALTER TABLE sites ADD COLUMN health_checked_at TIMESTAMP;

-- 创建索引
CREATE INDEX IF NOT EXISTS idx_sites_catelog ON sites(catelog);
CREATE INDEX IF NOT EXISTS idx_sites_sort_order ON sites(sort_order);
CREATE INDEX IF NOT EXISTS idx_sites_health_status ON sites(health_status);
CREATE INDEX IF NOT EXISTS idx_pending_catelog ON pending_sites(catelog);

然后拉取最新代码重新部署即可：

git pull origin main
wrangler deploy

👨‍💻 开发指南

项目结构

.
├── index-v2.js   # 主入口（包含所有路由、业务逻辑、前端模板）
├── wrangler.toml       # Cloudflare 配置
├── 数据库.txt           # 数据库表结构 SQL
└── README.md           # 你正在看的文档

注：为了简便，前端模板（HTML/CSS/JS）直接内嵌在主文件中，方便单文件部署。当然你也可以拆出来按需调整。

本地调试

wrangler dev

即可在 http://localhost:8787 预览，支持热重载。

核心 API 预览

🤝 贡献指南

欢迎提交 Issue 和 PR！
如果你有好的想法，请先开 Issue 讨论，避免重复劳动。
代码风格尽量保持现有简洁风格，并确保功能测试通过。

📝 更新日志

v2.0.0 (2026-07-20)

• 🩺 新增链接健康检查：支持批量检测当前页链接可用性，概览页显示健康/异常统计
• ✅ 批量操作：支持批量删除、批量修改分类，配合复选框选择
• ✏️ 分类重命名：一键修改分类名称，自动同步所有数据
• 🗑️ 分类删除增强：删除分类时自动删除该分类下所有链接
• 📥 导入去重：导入时自动跳过已存在的链接（基于 name+url）
• 📤 分类导出：支持按分类导出数据
• 🚀 站点配置缓存：KV 读取增加 5 分钟内存缓存，提升性能
• 🎨 UI 全面升级：
  • Toast 轻提示替代底部消息
  • 加载指示器（带进度文案）
  • 确认弹窗（告别 confirm 弹窗）
  • 健康状态图标（🟢 正常 / 🔴 异常）
  • 侧边栏分类高亮
  • 搜索空状态提示
• 🧹 代码优化：移除冗余函数，API 路由更清晰

v1.0.0 (2026-07-18)

• 🎉 首个正式版本发布
• ✅ 支持完整的前后台功能
• ✨ 分类拖拽排序、链接拖拽排序（交换/插入模式）
• 🔐 基于 KV 的会话认证
• 📤 数据导入导出
• 🖼️ 动态站点配置（背景图、站名等）

📸 效果截图

以下为示意位置，你可将实际截图放在 docs/ 目录下，并在此处引用。

前台首页

后台概览（v2 新增健康统计）

总览统计 + 健康链接/异常链接卡片 + 分类拖拽排序。

链接管理（v2 新增复选框 & 健康状态）

站点设置

📜 许可证

MIT © luochen-zhang

觉得有用的话，给个 ⭐ 吧～ 你的鼓励是我更新的最大动力！