flytotmoon 博客后台管理系统介绍

flytotmoon 博客后台管理系统介绍

为 Hexo + AnZhiYu 博客「飞向月球」量身打造的在线内容管理系统（CMS）。 一个界面，两种模式：本机 Node 服务 与 GitHub 云端，覆盖博客全部内容板块，保存即自动发布。

一、一句话概括

以前写博客要开电脑、改 Markdown、跑命令、部署；现在打开浏览器就能管理整个博客——写文章、发说说、传照片、更新友链、改自我介绍，点「保存」，约 2~5 分钟后自动上线。

二、核心亮点

亮点 说明
🌐 在线化 后台页面随博客发布到 /admin/，任何设备、任何浏览器都能管理，无需安装任何软件
☁️ 零服务器成本 GitHub 云端模式直接调用 GitHub 仓库 API，配合 Actions 自动构建，不需要租服务器
💾 保存即发布 每次保存自动提交 → 自动触发 GitHub Actions 构建 → 自动部署到博客，全程无需手动操作
🖥️ 本地也能用 保留本机模式：一个零依赖的 Node 服务，直接读写本地文件，构建日志 SSE 实时推送
🧩 全板块覆盖 文章、草稿、说说、相册、自我介绍、友链、装备、创意、媒体库、配置、构建，一站式管理
🛡️ 安全设计 细粒度令牌仅存浏览器本地；路径校验防穿越；删除入回收站；配置修改自动备份
🧪 质量保障 45 项 API 回归测试全通过；front-matter 解析器双端共用，读写往返无损

三、双模式架构

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
┌─────────────────────────────┐        ┌──────────────────────────────┐
│        本机模式               │        │        GitHub 云端模式         │
│  浏览器 http://127.0.0.1:4321│        │  浏览器 blog.flytotmoon.cn/   │
│            │                 │        │          admin/               │
│            ▼                 │        │            │                  │
│   Node 服务（admin/server.js）│        │  直接调用 GitHub REST API     │
│   零第三方依赖 · scrypt口令   │        │  （Contents / Actions）       │
│   HMAC 令牌 · 登录限流       │        │            │                  │
│            │                 │        │            ▼                  │
│            ▼                 │        │   flytotmoon/flytotmoon.     │
│   本地文件 source/_posts…    │        │   github.io 仓库 source 分支   │
│   hexo generate / deploy     │        │            │                  │
│   （SSE 实时日志）            │        │            ▼                  │
└─────────────────────────────┘        │   GitHub Actions 自动构建       │
                                        │   产物推送 master（Pages）      │
                                        └──────────────────────────────┘

自动发布链路（云端）：

1
2
3
保存 → 提交到 source 分支 → push 事件触发 Actions
     → npm ci → 安装 pandoc → hexo clean && generate
     → 产物推送 master 分支 → GitHub Pages 更新（约 2~5 分钟）

四、功能全景

📝 文章管理

  • 新建 / 编辑 / 删除（本机模式入回收站，云端模式可经 Git 历史找回）
  • 完整 Front-matter 支持：标题、日期、分类、标签、封面、摘要、置顶、数学公式、评论开关
  • 搜索、分类/标签筛选、分页；标题改名自动重命名文件

📄 草稿箱

  • 草稿独立管理（_drafts，不会被发布）；一键「发布」转为正式文章

✍️ Markdown 编辑器

  • 工具栏（标题/加粗/引用/代码/链接/表格…）、实时预览、图片上传插入、字数统计、Ctrl+S 保存

💬 千言万语（即刻短文）

  • YAML 编辑 + 博客同款卡片实时预览 + 一键插入新条目 + 保存前格式检查

🖼️ 相册集

  • 相册分组管理（瀑布流/画廊两种模式），封面与照片缩略图预览，一键新建相册模板

👤 自我介绍

  • 关于页 20 个板块（头像技能/书本/人格/座右铭/游戏/读书/打赏等）的分区概览编辑

🔗 友链管理

  • 分组 + 三种卡片样式（flexcard/telescopic/anzhiyu）+ 推荐/标签徽标预览

🎒 我的装备

  • 分类 → 好物 → 设备三级结构的卡片预览编辑

⭐ 创意技能

  • 音乐墙图标网格预览编辑

📁 媒体库

  • 拖拽上传图片（存至 source/img/upload/，随构建发布）、网格预览、一键复制 Markdown 引用

⚙️ 站点设置

  • 可视化修改站点信息；高级模式直接编辑 _config.yml / _config.anzhiyu.yml（自动备份 / Git 历史即备份）
  • 本机模式支持修改后台密码

🚀 构建发布

  • 本机模式：hexo clean / generate / deploy 一键执行，SSE 实时日志流，可取消
  • 云端模式：触发 GitHub Actions，状态自动轮询（构建结束自动停止轮询，节省 API 配额）

📊 仪表盘

  • 文章/草稿/分类/标签/字数统计、分类分布条、标签云、最近文章、快捷操作

五、快速上手

本机模式

1
npm run admin          # 启动，浏览器打开 http://127.0.0.1:4321/

默认账号 admin / admin123（登录后请立即修改密码）。

GitHub 云端模式

  1. 源码推送至仓库 source 分支（master 留给构建产物）
  2. 创建 GitHub 细粒度令牌：Contents: Read and write + Workflows: Read and write，仅授权该仓库
  3. 打开 https://blog.flytotmoon.cn/admin/ → 「GitHub 云端」→ 填令牌与仓库 → 连接测试 → 进入后台

六、技术特点

  • 零第三方依赖：本机服务仅用 Node 内置模块（http / crypto / fs / child_process），单文件可运行
  • 双端共用解析器：fm.js 同时运行在 Node 服务端与浏览器端，front-matter 解析/回写完全一致，读写往返无损（含无缩进列表等非标写法）
  • 登录安全：scrypt 口令哈希 + HMAC 签名令牌（7 天有效期）+ 登录失败限流
  • 细粒度令牌：云端模式令牌只保存在浏览器 localStorage，页面公开但无令牌无法操作
  • 防限流优化：目录树缓存 120s、统计缓存 60s、构建完成自动停止轮询、限流错误中文提示
  • 防缓存策略：资源带版本号（?v=x.y.z）+ 登录页版本标识，避免旧版缓存困扰
  • 格式安全：YAML 类数据页保存前做解析检查，格式错误时二次确认，防止博客构建失败

七、版本演进

版本 内容
v1.0.0 本机模式：认证、文章/草稿、媒体、设置、构建（SSE 日志），33 项 API 测试
v1.2.0 GitHub 云端模式上线：/admin 在线后台、Actions 自动构建部署
v1.3.0 资源版本号防缓存 + 版本标识
v1.4.0 UI 全新重设计（深空分屏登录、渐变侧边栏）+ 修复 hexo 主题布局污染（skip_render）
v1.4.1 API 调用频率优化 + 限流中文提示
v1.4.2 保存即自动发布的提示文案修正
v1.5.0 千言万语集成
v1.5.1 相册集集成
v1.5.2 自我介绍集成
v1.6.0 友链 / 装备 / 创意技能全部集成（45 项 API 测试全通过）

八、目录结构

1
2
3
4
5
6
7
8
9
10
11
12
admin/
├── server.js            # 本机模式后端服务（零依赖，单文件）
├── config.json          # 本机凭据（自动生成，已 gitignore）
├── test-api.js          # API 回归测试（45 项）
├── backups/  trash/     # 本机模式备份与回收站
└── README.md            # 完整使用文档

source/admin/            # 后台前端（随博客发布到 /admin/）
├── index.html  app.js  style.css  fm.js

.github/workflows/
└── auto-deploy.yml      # GitHub Actions 自动构建部署

九、安全说明

  • 本机模式默认仅监听 127.0.0.1；密码 scrypt 加盐哈希；令牌 HMAC 签名
  • 云端模式：令牌仅存浏览器本地；请使用细粒度令牌并只授权本仓库，定期更换
  • 所有文件操作均做路径校验（防目录穿越）；删除仅入回收站 / Git 历史可找回
  • 修改配置文件自动备份（本机）或依赖 Git 历史（云端）