Iori Nav：在 Cloudflare 上零成本搭建优雅的个人书签导航站

项目介绍

在互联网信息爆炸的时代，我们每天都会接触到大量有用的网站和资源。如何高效地收藏、整理和分享这些书签，成为了一个普遍的需求。传统的浏览器书签功能虽然基础，但缺乏美观的展示、便捷的分享和跨设备的统一管理。而 Iori Nav 的出现完美解决了这一问题——它是一个优雅、快速、易于部署的书签（网址）收藏与分享平台，完全基于 Cloudflare 全家桶构建，让你可以在零服务器成本的情况下，拥有一个功能完整、界面美观的个人导航站。

项目地址：https://github.com/luochen-zhang/iori-nav

开源协议：MIT

核心优势

费用：0 元（利用 Cloudflare 免费额度）
性能：极速（利用 Cloudflare 边缘缓存，秒级加载，节省 D1 数据库读取成本）[reference:0]
美观：界面简洁优雅，支持自定义主色调与夜间模式[reference:1]
安全：基于 KV 的管理员认证，提供 HttpOnly 会话 Cookie[reference:2][reference:3]
运维成本：零——无需管理服务器

核心功能

Iori Nav 是一套完整的书签管理与分享解决方案，功能覆盖了日常使用的方方面面：

功能	说明
响应式设计	完美适配桌面、平板和手机等各种设备[reference:4]
主题美观	界面简洁优雅，支持自定义主色调与夜间模式[reference:5]
快速搜索	内置站内模糊搜索，迅速定位所需网站[reference:6]
分类清晰	通过多级分类组织书签，浏览直观高效[reference:7]
安全后台	基于 KV 的管理员认证，提供完整的书签增删改查后台[reference:8]
用户提交	支持访客提交书签，经管理员审核后显示（可通过环境变量关闭）[reference:9]
数据管理	支持书签数据的导入与导出，兼容 Chrome 导出的 HTML 格式[reference:10]
AI 一键描述	提供 Workers AI、Google Gemini 和 OpenAI 接口自动生成描述[reference:11]
Logo 自动生成	默认使用 faviconsnap.com 接口自动补全网站图标[reference:12]
后台会话安全	HttpOnly 会话 Cookie（默认 1 天，可选 1/7/30/60/90 天），一键退出登录[reference:13]
输入与展示双重校验	URL 规范化、HTML 转义与排序值归一化，防止脏数据和潜在 XSS[reference:14]
访客投稿可控	通过环境变量关闭前台投稿入口[reference:15]
人机验证	集成 Cloudflare Turnstile，防止批量注册和恶意登录[reference:16]

版本亮点

Iori Nav 持续迭代，近期版本带来了诸多重要更新：

后台会话安全升级：登录 /admin 后颁发 HttpOnly 会话 Cookie，凭据不再暴露在 URL 中，并新增一键退出登录[reference:17]
输入与展示双重校验：新增 URL 规范化、HTML 转义与排序值归一化逻辑，前后台同时防止脏数据和潜在 XSS[reference:18]
访客投稿可控：通过 ENABLE_PUBLIC_SUBMISSION 环境变量即可关闭前台投稿入口[reference:19]
AI 一键自动生成描述：提供 Workers AI、Google Gemini 和 OpenAI 接口[reference:20]
导入导出数据：支持书签数据的导入与导出，兼容 Chrome 导出的 HTML 格式一键导入[reference:21]
卡片风格多样：增加卡片风格三，风格增加默认壁纸[reference:22]
增强分类结构与私密数据支持[reference:23]

效果预览

Iori Nav 提供了多种风格选择：

风格一/二/三：桌面端与手机端可分别配置卡片列数、卡片风格、切换动画、是否隐藏描述/链接行/分类、毛玻璃效果、圆角以及标题和描述的字体样式[reference:24]
手机端独立设置：支持 1/2/3 列布局，并根据卡片密度自动优化复制按钮显示[reference:25]
后台设置页：URL 后加 /admin 即可进入[reference:26]

💡 在线体验：https://iori.hidns.vip[reference:27]

部署教程

准备工作

开始部署前，你需要准备：

一个 Cloudflare 账号[reference:28]
一个 GitHub 账号

方式一：Cloudflare Pages 可视化部署（推荐）

这是最简单的部署方式，全程在浏览器中完成。

第 1 步：Fork 仓库

第 2 步：部署到 Cloudflare Pages

登录 Cloudflare 控制台，进入 Workers & Pages 创建页面[reference:30]
点击 连接到 Git，选择 GitHub，授权后选择你刚刚 Fork 的 iori-nav 项目[reference:31]
点击 开始设置，构建输出目录填写为 public，其他保持默认即可[reference:32]

第 3 步：创建 D1 数据库

在 Cloudflare 控制台，进入 存储和数据库 → D1 SQL 数据库[reference:33]
点击 创建数据库，数据库名称输入 book，然后创建[reference:34]

第 4 步：创建 KV 存储

在 Cloudflare 控制台，进入 存储和数据库 → Worker KV[reference:35]
点击 创建命名空间，名称输入 NAV_AUTH[reference:36]
创建后，为此 KV 添加两个条目，用于设置后台登录的用户名和密码[reference:37]：
- admin_username：你的管理员用户名（例如 admin）[reference:38]
- admin_password：你的管理员密码[reference:39]

⚠️ 重要：请使用强密码，不要使用简单密码。

第 5 步：绑定服务

进入你刚刚创建的 Pages 项目的 设置 → 绑定，添加以下绑定[reference:40]：

点击 添加绑定，选择 D1 数据库：
- 变量名称：NAV_DB[reference:41]
- D1 数据库：选择你创建的 book[reference:42]
点击 添加绑定，选择 KV 命名空间：
- 变量名称：NAV_AUTH[reference:43]
- KV 命名空间：选择你创建的 NAV_AUTH[reference:44]
（可选）如需使用 Cloudflare Workers AI，继续点击 添加绑定，选择 Workers AI：
- 变量名称：AI[reference:45][reference:46]

第 6 步：重新部署

点击项目的部署选项，在最后一次的部署后边选择 重新部署，等待部署完成[reference:47]。

第 7 步：访问使用

部署成功后，绑定自定义域名即可开始使用[reference:48]。后台管理页面地址为：https://你的域名/admin[reference:49]。

💡 如使用 Workers 默认域名（*.pages.dev），部分网络环境可能无法直连，建议绑定自定义域名。

方式二：CLI 本地开发部署（适合开发者）

如果你习惯使用命令行，也可以在本地开发并部署：

# 克隆仓库
git clone https://github.com/luochen-zhang/iori-nav.git
cd iori-nav

# 安装依赖（TailwindCSS / Husky）
npm install[reference:50]

# 复制本地配置模板，并填入你自己的 D1/KV 资源 ID
cp wrangler.example.toml wrangler.toml[reference:51]

# 构建 CSS（首次或修改 tailwind.css 后执行）
npm run build:css[reference:52]

# 启动本地开发服务器
npm run dev[reference:53]

# 本地执行数据库 schema（可选）
npx wrangler d1 execute book --local --file=schema.sql[reference:54]

在 Cloudflare 上零成本搭建优雅的个人书签导航站

洛宸