AI Content Automation Platform · 开发日志 Day1

日期：2026-03-15
项目：AI Content Automation Platform（基于 AI 的内容自动化 SaaS）

今天正式开工，完成从仓库初始化到「输入主题 → AI 生成文章 → 前端展示 + 临时落盘」的完整闭环，并搭好 Docker 与文档骨架。

一、项目初始化与结构

在本地创建仓库并推送到 GitHub（SSH 已配置），按文档搭好整体目录，便于后续前后端与 AI 模块并行开发。

整体结构：

bash 复制代码

AI-content-automation-platform
├── frontend/          # Vue3 + Vite 前端
├── backend/           # FastAPI 后端
├── ai-service/        # Prompt、生成逻辑、LLM 调用
├── database/          # 迁移、模型、种子（预留）
├── docker/             # 编排与 Dockerfile
├── scripts/            # 启动与初始化脚本
└── docs/               # 架构、开发指南、开发日志

项目根目录在 IDE 中的树状结构截图，或 docs/项目代码结构.md 的目录示意图。

已补充的工程文件：

README.md：技术栈、结构说明、快速开始
.gitignore：Python / Node / 环境变量 / 临时文件
LICENSE：MIT
.vscode/settings.json：Python 解释器指向 backend/.venv，便于 IDE 解析依赖

二、技术栈选型

模块	技术	说明
Frontend	Vue 3 + Vite	单页应用，后续可扩展路由与状态
UI	Element Plus	基础组件与中文文案
请求	Axios	统一 `request` 封装，拦截器返回 `res.data`
Backend	FastAPI	异步接口、自动 OpenAPI 文档
AI	DeepSeek API	兼容 OpenAI 接口，用于对话与文章生成
Database	PostgreSQL	异步驱动 asyncpg，后续文章入库
Cache	Redis	已进 compose，后续会话/限流可用
Deploy	Docker Compose	一键起 db / redis / backend / frontend

三、后端：API 与存储

3.1 文章生成（与 DeepSeek 对接）

接口：POST /api/generate
入参：{ "topic": "主题" }
逻辑：调用 DeepSeek 生成 Markdown 文章，并按「主题/标题」落盘到本地临时目录。
返回：{ "content": "全文 Markdown", "saved_path": "articles/tmp/日期/slug.md" }

生成用的 Prompt 已约束为：中文、Markdown、标题 + 小节 + 列表/代码块等，便于后续排版与多平台改写。

Swagger 中 POST /api/generate 的请求/响应示例截图。

3.2 临时落盘与读取（为后续入库预留）

文章生成后先写入服务器本地缓存目录，不直接写库，方便先跑通「生成 → 展示 → 再决定是否入库」的流程。

写入：save_article_markdown(title, markdown) → 路径由 ARTICLE_STORAGE_DIR 控制（默认 articles/tmp），支持环境变量，便于上线改目录。
读取：read_article_markdown(path)，按 save 返回的 path 读回全文。
列表：list_temp_articles()，按日期倒序列出临时文件，返回 path / title / date。

对应 HTTP 接口：

GET /api/articles/temp：临时文章列表
GET /api/articles/temp/content?path=xxx：按 path 读正文（path 校验在存储目录下，禁止 ..）

后续「用户确认保存」时再写入 PostgreSQL，临时读写保留为独立能力，可用于草稿、导出等场景。

3.3 历史文章（数据库）

表：articles（id, topic, title, content, saved_path, model, status, created_at, updated_at）
接口：
- GET /api/articles：分页列表（不含正文）
- GET /api/articles/{id}：单篇详情（含正文）

启动时执行 init_db() 自动建表；列表/详情依赖 DB，未接 DB 时列表为空，不影响生成与临时读取。

四、前端：页面与交互

4.1 布局

左侧：文章列表（新文章 + 临时 + 历史）
右侧：输入区 / 文章展示区（Markdown 渲染 + 复制全文）

主界面截图：左侧列表（含「新文章」「临时」「历史」分区）、右侧输入框与生成按钮、下方为 MD 渲染效果。

4.2 新文章

输入「文章主题 / 标题」，点击「生成文章」调用 POST /api/generate。
生成成功后右侧展示 Markdown，右上角提供「复制 MD 文档」。
同一主题可多次生成，每次会覆盖当日同 slug 的临时文件。

4.3 临时文章

左侧「临时」区块来自 GET /api/articles/temp，展示已落盘的临时文章（标题 + 日期）。
点击某一项请求 GET /api/articles/temp/content?path=xxx，右侧展示只读正文并支持复制。
临时文章标题由文件名 stem 或正文首行 # 标题 解析得到。

4.4 历史文章

「历史」区块来自 GET /api/articles（数据库），点击后通过 GET /api/articles/{id} 拉取详情并展示。
当前为只读展示 + 复制，暂不支持编辑标题；后续可加「保存到历史」把临时文章写入 DB。

4.5 请求封装

使用 Axios 创建 request 实例：baseURL: '/api'，超时 60s，响应拦截器统一返回 res.data，错误时抛出带 detail 的 Error。
文章相关接口集中在 api/article.js：generateArticle、listArticles、getArticle、listTempArticles、getTempArticleContent。

五、Docker 与脚本

编排：docker/docker-compose.yml，包含 db（PostgreSQL 16）、redis、backend、frontend；backend 依赖 db/redis，frontend 依赖 backend。
构建：docker compose -f docker/docker-compose.yml build --no-cache 可无缓存重建 backend 与 frontend；日常可用 up -d --build 构建并启动。
文档：docs/docker-build.md 中写了停止、构建、启动、验证、查看日志等步骤，便于复现与发布前自测。

终端中执行 docker compose up -d --build 后 ps 输出截图，或浏览器同时打开 5173（前端）与 8000/docs（API 文档）的截图。

本地开发时可用 scripts/run_backend.sh 或 backend/.venv/bin/python -m uvicorn app.main:app --reload 起后端，前端 npm run dev，通过 Vite 代理访问 /api。

Tip:docker构建容易超时的记得设置国内源
json 复制代码
{
  "registry-mirrors": [
      "https://mirror.ccs.tencentyun.com",
      "https://docker.mirrors.ustc.edu.cn"
 ]
}

六、今日小结

闭环：从「输入主题」到「AI 生成 → 前端展示 → 临时落盘 → 列表/按 path 读取」已打通；历史列表与详情接口就绪，待后续接「保存到 DB」与权限。
存储：临时目录可配置、与 save/read/list 对应，方便日后改为 DB 或保留双写（临时 + DB）。
工程：README、.gitignore、LICENSE、开发指南、Docker 构建说明、开发日志结构已就绪，便于协作与复盘。

七、明日计划

完善「保存到历史」：生成或临时文章一键写入 articles 表，并在左侧历史列表中刷新展示。
可选：Prompt 模板或简单工作流（例如一篇文章 → 多平台改写），为后续自动发布打基础。