joeseesun/qiaomu-blog-opensource
GitHub: joeseesun/qiaomu-blog-opensource
一套基于 Next.js 和 Cloudflare 全家桶的开源博客系统模板,内置 AI 写作辅助、多主题和完整后台管理,支持一键部署。
Stars: 243 | Forks: 107
# Qiaomu Blog Open Source
[](https://deploy.workers.cloudflare.com/?url=https://github.com/joeseesun/qiaomu-blog-opensource)
[](https://github.com/joeseesun/qiaomu-blog-opensource/generate)
如果你也想拥有一个真正属于自己的学习、写作、分享阵地,而不是把内容完全寄托在平台算法上,这个项目就是为此做的。
Qiaomu Blog Open Source 不是一个只会渲染 Markdown 的静态模板,而是一套完整的博客系统:前后台双编辑器、AI 写作辅助、AI 生图、主题系统、全文检索、API Token、外部发布生态都已经接好,目标就是让你更容易持续写下去。
- 在线示例:
- 介绍文章:
- 当前仓库:
## 为什么值得做成自己的站
- 自媒体账号可能被封,平台流量也可能波动,但自己的站点不会
- 写作系统应该足够轻,打开就能写,而不是被后台流程打断
- AI 最该服务的是摘要、标签、封面、slug、生图这些重复工作
- 博客不该只是展示页,还应该是你的长期知识资产
## 你会得到什么
- 前台、后台都能编辑,所见即所得,接近飞书 / Notion 的写作体验
- 四套首页主题,移动端友好,开箱即用
- Bubble Menu + Ask AI,选中文本就能改写、润色、扩写、翻译
- AI 自动处理摘要、标签、SEO slug、封面图
- AI 生图模型和模板配置、最近生成记录、插入和替换工作流
- 图片右键菜单:下载、设为封面、对齐、裁剪、参考生图
- 发布状态:公开、草稿、密码访问、链接访问
- 默认初始化配置:主题、导航、字体、AI 文本模型模板、AI 生图模型模板
- Cloudflare Workers + D1 + R2 部署,不需要自己维护服务器和 CDN
## 截图预览
### 四套首页主题

### 编辑器与所见即所得写作

### Ask AI / Bubble Menu

### 后台设置与主题、代码、API Token 管理

### 多种发布状态

### AI 模型与生图配置

## 配套生态也一起开源了
这个仓库不只开源博客主站,也把外部发布工具一起放进来了。你可以把“写作入口”放在最顺手的地方,但最终都回到同一个博客后台。
- [`ecosystem/chrome-clipper`](ecosystem/chrome-clipper/README.md):浏览器网页剪藏,直接进入博客草稿箱
- [`ecosystem/obsidian-publisher`](ecosystem/obsidian-publisher/README.md):从 Obsidian 一键发布到博客
- [`ecosystem/qiaomu-blog-publish-skill`](ecosystem/qiaomu-blog-publish-skill/README.md):通过 Claude Skill / 命令工作流直接发布
- [`ecosystem/README.md`](ecosystem/README.md):生态工具总览
## 一键部署到 Cloudflare
直接点击上面的 `Deploy to Cloudflare` 按钮即可。
这个模板已经补好了适合 Deploy Button 的配置:
- Cloudflare 会读取仓库里的 Worker 配置
- 自动创建需要的 `D1` / `R2` 绑定
- 使用仓库里的自定义 deploy script
- 部署时自动应用数据库 schema 和模板默认配置
部署时建议准备这些值:
- `NEXT_PUBLIC_SITE_URL`
- `ADMIN_PASSWORD`
- `ADMIN_TOKEN_SALT`
- `AI_CONFIG_ENCRYPTION_SECRET`
- `AI_API_KEY`(可选)
如果你更想手动掌控 Cloudflare 资源,也可以走 CLI:
npm install
cp .env.example .env.local
npx wrangler login
npm run cf:init -- --site-url=https://your-domain.com
npm run build
npm run deploy
## 本地开发
git clone https://github.com/joeseesun/qiaomu-blog-opensource.git
cd qiaomu-blog-opensource
npm install
cp .env.example .env.local
npm run dev
常用入口:
- 首页:`/`
- 后台:`/admin`
- 编辑器:`/editor`
如果你要在 Worker 运行时本地预览:
npm run preview
## 默认初始化内容
首次初始化后,模板会自动带上这些基础能力:
- 默认导航
- 默认主题与字体
- 默认分类
- AI 文本模型配置模板
- AI 生图模型配置模板
- 文章摘要、标签、slug、封面生成器
- 编辑器 Ask AI 预设动作
所有 API Key 都不会进入仓库,首次部署时通过 Cloudflare secret 或后台配置补齐。
## 技术栈
- Next.js 16
- React 19
- TypeScript
- OpenNext for Cloudflare
- Cloudflare Workers
- Cloudflare D1
- Cloudflare R2
- Novel / Tiptap
## 常用命令
| 命令 | 说明 |
| --- | --- |
| `npm run dev` | Next.js 本地开发 |
| `npm run build` | 构建应用 |
| `npm run verify:quick` | 跑 lint、test、build |
| `npm run verify` | 跑完整验证链路 |
| `npm run cf:init` | 初始化 Cloudflare 资源和模板默认设置 |
| `npm run preview` | Worker 运行时预览 |
| `npm run deploy` | 部署到 Cloudflare Workers |
## 作者
- 向阳乔木
- GitHub:
- X / Twitter:
- Blog:
标签:Cloudflare, MITRE ATT&CK, Serverless, Syscall, Web开发, 博客系统, 程序员工具, 自动化攻击