# content-ops **Repository Path**: lxp-freestyle/content-ops ## Basic Information - **Project Name**: content-ops - **Description**: 跨平台运营自媒体中台 - **Primary Language**: Unknown - **License**: Not specified - **Default Branch**: main - **Homepage**: None - **GVP Project**: No ## Statistics - **Stars**: 0 - **Forks**: 0 - **Created**: 2026-03-12 - **Last Updated**: 2026-05-07 ## Categories & Tags **Categories**: Uncategorized **Tags**: None ## README # Content-Ops AI 驱动的中文社交媒体内容创作与运营 SaaS 平台。 ## 项目简介 Content-Ops 是一个面向中文社交媒体的 AI 内容创作平台,支持小红书、抖音、微信、微博、快手五大平台。提供完整的内容创作工作流:热点选题 → 大纲生成 → 内容创作 → 发布快照与平台发布。 ## 技术栈 - **Next.js 16** (App Router) + React 19 + TypeScript - **Prisma 7** + PostgreSQL - **NextAuth.js 5** (JWT 认证) - **Zustand 5** (状态管理 + localStorage 持久化) - **Tailwind CSS 4** - **Dify** (AI 工作流平台) - **公开热榜直连 + 可选 DailyHot fallback** (热点数据源) ## 快速开始 ### 安装依赖 ```bash npm install ``` ### 配置环境变量 复制 `.env.example` 为 `.env` 并填写必要的配置: ```bash DATABASE_URL="postgresql://postgres:password@localhost:5432/content_ops" NEXTAUTH_SECRET="your-secret-key" DIFY_DEPLOYMENT="local" DIFY_LOCAL_BASE_URL="http://localhost/v1" DIFY_LOCAL_KEY_OUTLINE="your-dify-content-workflow-key" DIFY_LOCAL_KEY_CONTENT="your-dify-content-workflow-key" DIFY_LOCAL_KEY_COVER="your-dify-cover-workflow-key" ``` ### 初始化数据库 ```bash npx prisma migrate dev npx prisma generate ``` ### 启动开发服务器 ```bash npm run dev ``` 打开 [http://localhost:3000](http://localhost:3000) 查看应用。 ## 主要功能 ### 🔥 热点选题 - **微博、抖音、快手**公开热榜抓取;可选 `HOT_TOPICS_DAILYHOT_BASE_URL` 作为 fallback;服务端缓存后返回 - 小红书 / 微信热点列表当前为**空数据**(抓取未接入);页面与 API 会标注 **`dataCoverage`**,避免误以为「坏了」 - 热点列表由 **`POST /api/hot-topics`** 提供(**抓取 + 服务端缓存 + 过滤**,不经过 Dify / 大模型) ### 📝 四步创作流程(`/creation`,步骤 0–3) 1. **选题**:确认标题、描述、标签与目标平台(可从热点一键带入) 2. **大纲**:Dify 工作流 `outline`,输出 JSON 结构;失败可查看原始输出或手改 3. **内容**:Dify `content` 多平台并行/流式,写入 `platformContents`;支持全局/按平台**创作偏好**(风格、必含/必不含等) 4. **发布**:不再调用 Dify `publish` 工作流;服务端基于当前内容生成发布快照。**微信公众号真实发文**,其余平台多为**手动发布**(`manual_pending`);手动流程支持 **复制发布包**(含各平台创作者后台链接) ### 💬 AI 对话助手 - 每个步骤独立的 AI 对话会话 - 支持内容直接替换模式 - 流式响应,实时反馈 ### 📱 多平台预览 - 手机模拟器实时预览(小红书、抖音、微信、微博、快手) - 微信公众号全屏预览,支持原生全屏模式 - 可直接选中文本复制到各平台编辑器 - 真实排版效果,所见即所得 ### 📢 发布中心 - 以服务端发布快照为主,统一查看草稿箱、待人工发布、已提交平台、已发布和失败记录 - 支持从发布快照返回关联草稿继续编辑 ### 👤 画像与偏好 - 新手引导可选 **K12 网课老师** 或 **通用自媒体**,并写入服务端用户字段与本地默认创作偏好 - 个人资料页维护头像、简介、行业标签、创作身份、内容模式和平台级风格偏好 ## UI/UX 特性 - **全宽布局**:所有页面统一采用全宽设计,充分利用屏幕空间 - **响应式设计**:适配不同屏幕尺寸 - **流式交互**:AI 生成内容实时流式显示 - **手机预览**:固定高度手机框架,支持滚动查看完整内容 - **全屏模式**:微信预览支持浏览器原生全屏 ## 项目结构 采用**企业级垂直切片架构**,按功能模块组织代码: ``` content-ops/ ├── src/ # 源代码目录 │ ├── app/ # Next.js App Router │ │ ├── (auth)/ # 认证路由组(/login, /register) │ │ ├── (main)/ # 主应用路由组(含 Sidebar) │ │ │ ├── creation/ # 创作工作台 │ │ │ ├── publish/ # 发布中心 │ │ │ ├── hot-topics/ # 热点广场 │ │ │ ├── accounts/ # 平台账号 │ │ │ ├── profile/ # 个人资料与风格偏好 │ │ │ ├── help/ # 帮助文档页面 │ │ │ └── layout.tsx # 主应用布局 │ │ └── api/ # API 路由 │ │ │ ├── features/ # 功能模块(垂直切片) │ │ ├── creation/ # 内容创作功能 │ │ │ ├── components/ # 创作组件 │ │ │ ├── step0..step3/ # 四步创作 UI、hooks 与纯函数 │ │ │ ├── workspace/ # 预览与助手工作区 │ │ │ └── store/ # 草稿与助手状态 │ │ ├── hot-topics/ # 热点系统 │ │ │ └── api/ # 热点抓取和缓存 │ │ ├── wechat/ # 微信发布 │ │ │ ├── components/ # 微信预览组件 │ │ │ └── api/ # 微信 API 客户端 │ │ ├── workflow-content/ # 内容解析、数学渲染、微信 HTML 渲染 │ │ ├── publish/ # 发布快照与发布中心 │ │ ├── accounts/ # 平台账号绑定 │ │ ├── profile/ # 用户资料、引导和偏好 │ │ └── auth/ # 认证功能 │ │ │ ├── shared/ # 共享代码 │ │ ├── components/ # 通用组件 │ │ │ ├── ui/ # 基础 UI 组件 │ │ │ └── layout/ # 布局组件 │ │ ├── hooks/ # 通用 hooks │ │ ├── lib/ # 通用工具库 │ │ ├── providers/ # 全局 Providers │ │ ├── store/ # Zustand 全局状态 │ │ └── types/ # 全局类型定义 │ │ │ └── middleware.ts # Next.js 中间件 │ ├── prisma/ # 数据库 Schema ├── prompts/ # AI 提示词资产 ├── public/ # 静态资源 └── dify-workflows/ # Dify 工作流导出(可选) ``` ### 架构特点 - **垂直切片**:每个 feature 包含自己的组件、hooks、API 逻辑 - **功能内聚**:相关代码集中在一起,易于维护 - **低耦合**:功能间通过 shared/ 共享通用代码 - **易扩展**:新增功能只需添加新的 feature 目录 ## 常用命令 ```bash npm run dev # 启动开发服务器 (http://localhost:3000) npm run build # 生产构建 npm run start # 启动生产服务器 npx prisma studio # 打开数据库管理界面 npx prisma migrate dev # 运行数据库迁移 npx prisma generate # 重新生成 Prisma 客户端 ``` ## 环境变量说明 ### 必需配置 - `DATABASE_URL` - PostgreSQL 数据库连接字符串 - `NEXTAUTH_SECRET` - JWT 签名密钥 - `DIFY_DEPLOYMENT` - 当前 Dify 实例,默认按 `local` 处理;`remote` 表示官方网页版,`local` 表示本地部署版 - `DIFY_REMOTE_KEY_CONTENT` / `DIFY_LOCAL_KEY_CONTENT` - 内容工作流 Key,按当前 deployment 读取 - `DIFY_REMOTE_KEY_COVER` / `DIFY_LOCAL_KEY_COVER` - 封面与插图工作流 Key,按当前 deployment 读取 ### 可选配置 - `DIFY_REMOTE_BASE_URL` / `DIFY_LOCAL_BASE_URL` - 远程/本地 Dify API 地址,官方网页版默认为 `https://api.dify.ai/v1` - `DIFY_REMOTE_KEY_OUTLINE` / `DIFY_LOCAL_KEY_OUTLINE` - 大纲工作流 Key;如果和内容工作流是同一个应用,可填同一个值 - `DIFY_REMOTE_CHAT_APP_KEY_STEP_1` / `DIFY_LOCAL_CHAT_APP_KEY_STEP_1` - 大纲助手 Chat 应用 Key - `DIFY_REMOTE_CHAT_APP_KEY_STEP_2` / `DIFY_LOCAL_CHAT_APP_KEY_STEP_2` - 正文助手 Chat 应用 Key - `DIFY_KEY_{PLATFORM}_{STEP}` / `DIFY_KEY_{STEP}` / `DIFY_API_KEY` / `DIFY_CHAT_APP_KEY_STEP_1/2` - 本地版本旧变量别名;仅在 `DIFY_DEPLOYMENT=local` 时作为 `DIFY_LOCAL_*` 的兜底 - `DASHSCOPE_API_KEY` - 封面与插图工作流内部调用阿里云百炼 DashScope 千问图像模型时使用 - `WECHAT_APP_ID` / `WECHAT_APP_SECRET` - 微信公众号配置 ## 数据持久化策略 项目采用双层持久化架构: 1. **localStorage**(通过 Zustand persist) - 快速响应,离线可用 - 立即更新 UI - Persisted keys are split by domain: `content-ops-ui-v1`, `content-ops-settings-v1`, `content-ops-drafts-v1`, `content-ops-step-chat-v1` 2. **PostgreSQL**(通过 Prisma) - 服务端持久化存储 - 草稿创建/更新等后台 `POST` / `PATCH` 同步 数据流:UI → Zustand (localStorage) → 后台 HTTP → Prisma (PostgreSQL) ## 部署 ### Vercel 部署(推荐) 1. Fork 本仓库 2. 在 Vercel 导入项目 3. 配置环境变量 4. 部署 ### 自托管部署 ```bash npm run build npm run start ``` 确保配置好环境变量和数据库路径。 ## 开发指南 - 开发与架构说明见 [CLAUDE.md](./CLAUDE.md)(与代码同步维护)。 ## 许可证 MIT License ## 贡献 欢迎提交 Issue 和 Pull Request。