shumengya/tangfamily

Fork 0

Files

shumengya 8b55485a82 chore: sync remaining local changes to Gitea

2026-06-24 22:13:01 +08:00

3.2 KiB

Raw Blame History

唐家族谱网站

基于 Cloudflare Workers 的全栈家族族谱网站，使用树状图展示家族成员关系。

功能特性

密码保护访问（访问密码：tangfamily）
响应式设计，支持电脑端和手机端
树状图展示家族成员信息
管理后台用于添加、编辑、删除成员（管理密码：shumengya5201314）
数据存储在 Cloudflare KV

项目结构

tangfamily/
├── src/
│   ├── index.ts           # Worker 主文件，包含 API 路由
│   └── init-data.js       # 初始化数据脚本
├── public/
│   ├── index.html         # 访客登录页面
│   ├── tree.html          # 族谱树展示页面
│   ├── admin-login.html   # 管理员登录页面
│   └── admin.html         # 管理后台页面
├── wrangler.jsonc         # Cloudflare Workers 配置
└── package.json

本地开发

安装依赖：

npm install

启动开发服务器：

npm run dev

访问 http://localhost:8787/

初始化数据

项目已包含初始家族成员数据（唐治明、舒邦莲、唐永洪、唐伟）。

方式一：通过管理后台添加

访问 http://localhost:8787/admin-login.html
输入管理员密码：shumengya5201314
在管理后台逐个添加成员

方式二：查看初始化数据

运行以下命令查看初始化数据：

node src/init-data.js

访问说明

访客访问

访问首页
输入密码：tangfamily
查看族谱树

管理员访问

访问 /admin-login.html
输入管理员密码：shumengya5201314
在管理后台进行成员管理

部署到 Cloudflare

npx wrangler login

创建 KV 命名空间：

npx wrangler kv:namespace create "FAMILY_DATA"

将输出的 ID 更新到 wrangler.jsonc 中的 kv_namespaces.id 字段
部署 Worker：

npm run deploy

访问你的 Workers 域名即可使用

数据结构

每个家族成员包含以下信息：

id: 唯一标识符
name: 姓名
birthYear: 出生年份
gender: 性别（男/女）
fatherId: 父亲 ID（可选）
motherId: 母亲 ID（可选）

API 接口

POST /api/login - 登录（访客或管理员）
GET /api/members - 获取所有成员（需要认证）
POST /api/members - 添加/更新成员（需要管理员权限）
POST /api/members/delete - 删除成员（需要管理员权限）

技术栈

Cloudflare Workers - 边缘计算平台
Cloudflare KV - 键值存储
TypeScript - 类型安全
原生 HTML/CSS/JavaScript - 前端页面

安全说明

所有 API 接口都需要身份验证
Session Token 存储在 KV 中，有效期 24 小时
管理操作需要管理员权限验证
建议在生产环境中修改默认密码

自定义

修改密码

编辑 src/index.ts 中的常量：

const VISITOR_PASSWORD = 'tangfamily';
const ADMIN_PASSWORD = 'shumengya5201314';

修改样式

所有样式都内联在 HTML 文件中，可直接修改 public/*.html 文件中的 <style> 标签。

License

MIT

3.2 KiB Raw Blame History Unescape Escape