什么是 TalkCode
TalkCode 是一个 AI 驱动的应用生成与全托管部署平台。您只需要用自然语言描述想要的应用功能,AI 即自动生成完整的项目代码,并支持一键部署到云端。无论是不会编程的产品经理、需要快速验证 MVP 的创业者,还是希望提高效率的全栈开发者,TalkCode 都能帮助您将想法快速落地为真实可用的线上应用。
核心理念:出口成码
TalkCode 的名字来源于"Talk to Code"——用对话的方式编写代码。平台借鉴了 CodeBuddy Craft、Cursor Agent 等业界成熟方案的"先约束再生成"理念,将 AI 代码生成从简单的"一问一答"升级为六步质量保证流程:架构规划 → 契约生成 → 代码生成 → 一致性验证 → 自动修复 → 质量评估。
适用人群
核心功能
TalkCode 提供从需求描述到线上部署的完整工具链,覆盖应用全生命周期。
AI 代码生成
部署与运维
社交与体验
安全
系统架构
TalkCode 采用前后端分离架构,后端为 Express.js 单体服务,前端为原生 HTML/CSS/JS 无框架实现,极致轻量。
六步质量保证流程
与业界方案的对比
| 设计维度 | TalkCode v2.1 | CodeBuddy Craft | Cursor Agent |
|---|---|---|---|
| 规划深度 | 跨文件契约(DOM ID/CSS 类名/JS API 签名) | 三层语义索引 + Dependency Graph | Plan Mode + .cursor/rules/ |
| 生成策略 | 前端合并 + 后端逐文件(契约驱动) | Agent 批量协同生成 | Agent 自主识别文件边界 |
| 一致性约束 | 生成前契约 + 编译时验证 + 生成后检查 | 生成前 token 查询 + 类型强制 | .cursorrules + ESLint |
| 验证机制 | DOM ID/CSS 类名/JS API 跨文件一致性检查 | 视觉回归测试 | TDD + Hooks 自动迭代 |
| 可观测性 | SSE 事件流(契约/一致性/合并生成) | diff 视图 + 版本树 | Plan 确认 + diff 视图 |
技术栈
| 分类 | 技术 | 用途 |
|---|---|---|
| 后端框架 | Express.js | HTTP 服务与路由 |
| 数据库 | sql.js (SQLite) | 嵌入式关系数据库 |
| 实时通信 | ws (WebSocket) | 状态推送 |
| 认证 | jsonwebtoken + bcryptjs | JWT + 密码哈希 |
| AI 集成 | axios (OpenAI 兼容 API) | 代码生成/修改/质询 |
| SSH 部署 | ssh2 | 远程服务器代码上传 |
| 文件处理 | multer + adm-zip | 上传 + ZIP 解压 |
| 前端 | 原生 HTML/CSS/JS | 无框架,极致轻量 |
| 代码编辑器 | CodeMirror 5 | 在线代码编辑 |
注册与登录
使用 TalkCode 需要一个账号,注册完全免费,社区版即可体验所有核心功能。
注册流程
- 进入注册页面
访问首页,点击右上角
登录按钮,在登录页底部点击"还没有账号?立即注册",或直接访问/register。 - 填写账号信息
输入您的邮箱(唯一标识)、用户名(唯一标识,不可修改)、昵称(可随时修改)和密码。请使用高强度密码以保障账号安全。
- 完成注册
提交注册信息后系统将自动跳转至登录页面,输入账号密码即可进入控制台。
登录与找回
访问 /login 页面输入邮箱和密码即可登录。如忘记密码,请通过 联系客服 进行身份验证后重置。
用户角色
| 角色 | 权限 | 说明 |
|---|---|---|
admin | 全部权限 | 管理员,可查看所有项目、管理用户、配置平台 |
user | 标准权限 | 普通用户,可管理自己的项目和环境 |
快速开始
只需三步,即可创建您的第一个 AI 应用。
- 描述需求
在首页点击
基于AI构建,输入项目名称和需求描述。 - AI 生成代码
提交后 AI 将自动分析需求并生成完整项目代码,通常耗时 30 秒到 2 分钟。生成过程中可通过 SSE 事件流实时查看进度。
- 部署上线
代码生成完毕后,在项目详情页点击部署,即可将应用发布到公网。
AI 构建应用
AI 构建是 TalkCode 的核心能力。您描述需求,AI 负责编写代码——让编程回归创意本身。
操作步骤
- 发起构建
确保已登录,在首页点击
基于AI构建按钮,弹出构建配置弹窗。 - 配置参数
- 项目名称 — 起一个描述性名称,如"智能日程助手"
- 开发语言 — 当前支持
Node.js + Express和Python + Flask - 需求描述 — 用自然语言详细描述功能,越具体输出越精准
- 公开/私有 — 选择是否在应用市场中展示
- 等待生成
提交后系统将调用 AI 模型分析需求并生成代码。生成期间可在项目详情页通过 SSE 事件流实时查看进度。
- 审查与编辑
代码生成完成后自动进入项目详情页,您可查看所有文件、在线编辑任意代码,并随时预览效果。
写好需求描述的技巧
需求描述示例
创建一个在线任务管理应用,要求如下:
1. 用户系统:支持注册、登录、个人资料编辑
2. 任务管理:创建、编辑、删除、标记完成
3. 任务字段:标题(必填)、描述、截止日期、优先级(高/中/低)
4. 列表功能:按优先级和截止日期排序,关键词搜索
5. 已完成任务归档查看,支持恢复
6. 界面风格:现代简约,移动端友好,使用柔和配色
AI 生成全流程
当您提交 AI 构建请求后,系统会执行一个完整的六步流程,确保生成代码的质量和一致性。
1. 架构规划(planArchitecture)
一次 LLM 调用,输出完整的 JSON 架构规划,包含项目分析、技术栈选择、文件结构、API 端点设计、数据库表设计、数据模型、API 契约、前端组件树、依赖清单,以及跨文件契约(domContract/cssContract/jsContract)。
| 字段 | 说明 |
|---|---|
analysis | 项目需求分析 |
techStack | 技术栈选择 |
fileStructure | 文件列表(filename, purpose, priority, filePath) |
projectType | 项目类型(game/web_app/api_service 等) |
apiEndpoints | API 端点设计 |
databaseTables | 数据库表设计 |
domContract NEW | DOM 契约:屏幕 ID、元素 ID 映射、切换方式 |
cssContract NEW | CSS 契约:类名映射、CSS 变量名 |
jsContract NEW | JS 契约:全局 API 签名、事件绑定、状态变量 |
assets | 素材清单(TTS/文生图) |
文件按 priority 排序(1=必须 → 2=重要 → 3=可选),核心入口文件优先生成。
2. 代码生成(v3.0 — Pi-Agent Agent Loop)
旧的逐文件生成(_generateWithArchitecture)、静态验证(verifyGeneratedFiles/verifyCrossFileConsistency)
与逐文件修复(fixIssues)流程已在 v3.0 全部移除,统一交由 Pi-Agent 融合层(pi-agent-service.js)执行。
Pi-Agent 借鉴 Pi Coding Agent 的 Agent Loop 设计,以契约驱动 + 工具调用循环完成生成,替代旧的逐文件串行生成。
generateWithAgentLoop:
1. 契约校验网关(validateContractBeforeUse)-> 不通过则自动修复
2. Pi 生态注入:AGENTS.md 风格项目指令 + 技能摘要 + 扩展自定义工具
3. 脚手架骨架注入 + 素材摘要注入
4. Agent Loop(最多 40 轮 / 10 分钟超时 / 死循环检测):
模型调用 -> 工具执行 -> 结果回注 -> 循环
工具:write_file / read_file / edit_file(补丁)/ search_code / grep / ls
/ bash(安全命令)/ verify_contract / list_planned_files / load_skill
5. 上下文压缩(借鉴 Pi 的 /compact)避免上下文爆炸
6. 前后端 API 一致性终验(verifyApiContract)
核心优势:契约即护栏(不允许自创 ID/类名/API);打破信息孤岛(Agent 可回读已生成文件);生成-验证-修复闭环;脚手架智能复用。
v3.1 Pi 生态功能
- Skills(技能系统,pi-skills.js):渐进式披露——启动只注入技能 name+description,模型按需用
load_skill拉取完整指令;内置前端一致性、API 契约对齐、Python/Node.js 项目搭建、游戏开发 5 个技能。 - Extensions(扩展系统,pi-extension-api.js):
registerTool、registerCommand、on()生命周期事件、registerProvider、sendMessage;自动从.pi/extensions/与extensions/加载。 - AGENTS.md 风格项目指令:按语言与项目类型注入强制约束(如 Node.js 禁止 better-sqlite3、依赖写 requirements.txt)。
- 工具级安全边界:
bash15 秒超时 + 破坏性命令黑名单;edit_file单文件 200KB 上限;路径遍历(..)拦截。
3. 运行时验证(runtimeVerify)与运行时修复(agentFixWithRuntime)
Pi-Agent 生成完成后,真实运行代码做运行时验证,发现静态检查无法发现的 bug。
流程:语法检查 → 安装依赖 → 启动进程 → 健康检查(探测 API 端点)+ 日志解析。
失败时进入 agentFixWithRuntime:Agent 通过 read_file/write_file/run_project 自主完成
定位→修复→验证闭环,内置 5 分钟超时 + 死循环检测 + 回归基线检测。
4. 质量评估报告(generateQualitySummary)
生成质量评级(A/A-/B/C),包含文件数、代码行数、严重问题数、警告数。
6. 部署
SSH 远程部署或本地部署,WebSocket 实时推送状态。
跨文件契约机制
传统逐文件串行生成存在"规划太浅、约束太弱、验证太粗"的问题,导致多文件代码不一致。TalkCode v2.1 通过契约机制从根本上解决这一问题。
为什么需要契约?
旧方案的问题示例("别踩白块"项目):
index.html + api.js 是一套设计:
- 4个屏幕:screen-start, screen-game, screen-over, screen-leaderboard
- 使用 id="hud-score", id="over-score", id="leaderboard-list"
- 使用 .mode-btn.selected 类
- 调用 Api.submitScore() 和 Api.getLeaderboard()
game.js + style.css 是另一套设计:
- 寻找 id="score-display", id="mode-selector"(HTML中不存在!)
- 使用 .mode-btn.active 类(与HTML的.selected不一致!)
- 调用 window.Api.getScores()(api.js中不存在!)
契约的三层结构
{
"domContract": {
"screenIds": ["screen-start", "screen-game", "screen-over", "screen-leaderboard"],
"elementIds": {
"hud-score": "游戏分数显示",
"over-score": "结算分数显示",
"input-name": "玩家昵称输入框",
"btn-start": "开始游戏按钮"
},
"screenToggleMethod": "通过添加/移除 active 类切换屏幕显示"
},
"cssContract": {
"classMap": {
"mode-btn": "模式选择按钮",
"mode-btn.selected": "模式按钮选中状态",
"btn-primary": "主按钮样式",
"active": "屏幕/元素激活状态"
},
"variableNames": ["--primary-color", "--accent-color"]
},
"jsContract": {
"globalAPI": {
"Api.submitScore": "(playerName, score, mode) => Promise",
"Api.getLeaderboard": "() => Promise"
},
"eventBindings": {
"btn-start": "click -> startGame",
"btn-restart": "click -> restartGame"
},
"stateVariables": {
"currentScore": "当前游戏分数",
"isPlaying": "游戏是否正在进行"
}
}
}
契约强制规则
- HTML 中所有关键元素的 id 必须与
domContract.elementIds完全一致 - CSS 中所有关键类名必须与
cssContract.classMap完全一致 - JS 中 getElementById/querySelector 引用的 ID 必须与
domContract.elementIds一致 - JS 中 classList 操作使用的类名必须与
cssContract.classMap一致 - JS 中调用其他文件的 API 必须按
jsContract.globalAPI签名调用 - 屏幕切换必须使用
domContract.screenToggleMethod定义的方式 - 严禁自创 ID、类名或 API 方法名,必须使用契约中预定义的名称
AI 对话修改
代码生成完成后,您可以通过对话方式让 AI 修改代码,无需手动编辑每个文件。
操作流程
- 发起修改
在项目详情页的 AI 对话区域输入修改需求,如"把背景色改为深色主题"。
- AI 分析与修改
系统通过 SSE 流式推送 AI 的分析过程和修改结果。修改结果暂存到 temp/ 目录,不会直接覆盖原文件。
- 预览 Diff
修改完成后,点击"预览修改"查看 AI 修改的 diff 对比,确认修改是否符合预期。
- 确认或丢弃
- 确认应用 — 修改将覆盖原文件并自动重新部署
- 丢弃修改 — temp/ 目录中的修改将被删除,恢复原状
代码质询
代码质询功能让您可以向 AI 提问关于项目代码的任何问题,AI 会基于项目上下文流式回答。
使用方式
- 进入质询模式
在项目详情页的 AI 对话区域,输入您的问题,如"这个项目的主要功能是什么"或"server.js 中的路由是如何组织的"。
- AI 流式回答
AI 会读取项目代码上下文,通过 SSE 流式推送回答内容。
常见质询场景
- 理解项目整体架构和功能
- 查找特定功能的实现位置
- 了解 API 端点的请求/响应格式
- 分析代码中的潜在问题
- 学习项目使用的技术和设计模式
源码构建应用
如果您已有现成的项目代码,使用源码构建功能可直接上传并部署,无需从头开始。
操作步骤
- 创建构建环境
登录后在首页点击
基于源码构建,填写环境名称(仅支持字母和数字)、项目名称和运行时(Node.js/Flask)。 - 编写或粘贴代码
进入环境编辑页面后,使用在线 IDE 手动创建文件并编写代码,或将已有代码逐文件粘贴。
- 确认入口文件
确保项目根目录存在正确的入口文件(Node.js 为
server.js或index.js,Flask 为app.py)。 - 部署运行
代码准备完毕后,点击部署按钮,系统将自动安装依赖并启动服务。
package.json / requirements.txt)正确无误。项目结构指引
# Node.js 项目推荐结构
my-project/
├── server.js # 入口文件
├── package.json # 项目依赖配置
├── public/ # 静态资源目录
│ ├── index.html
│ └── style.css
└── routes/ # 路由模块(可选)
# Python Flask 项目推荐结构
my-project/
├── app.py # 入口文件
├── requirements.txt # 项目依赖配置
├── static/ # 静态资源目录
│ ├── css/
│ └── js/
└── templates/ # Jinja2 模板目录
上传 ZIP 文件
如果已有完整项目 ZIP 包,可通过环境编辑页面的上传功能直接导入。系统会自动解压并保持目录结构。
在线 IDE
TalkCode 内置功能完整的在线代码编辑器,基于 CodeMirror 5 构建,支持语法高亮、在线编辑和保存。
编辑器功能
文件管理
在项目详情页或环境编辑页,左侧文件树支持:
- 创建文件/文件夹 — 右键或点击新建按钮
- 编辑文件 — 点击文件名即可在编辑器中打开
- 删除文件 — 右键删除(支持文件夹递归删除)
- 上传文件 — 支持单文件和 ZIP 批量导入
控制台管理
控制台是您的项目管理中心,登录后可查看和管理所有项目与环境。
功能概览
项目状态说明
| 状态 | 说明 | 建议操作 |
|---|---|---|
creating | 项目正在创建中 | 稍等片刻 |
generating | AI 正在生成代码 | 耐心等待,可刷新查看 |
generated | 代码生成完毕 | 可查看/编辑代码并部署 |
deploying | 正在部署到云端 | 等待部署完成 |
deployed | 部署成功 | 通过域名访问应用 |
error | 生成或部署出错 | 查看日志,重试或联系支持 |
editing | 源码构建环境编辑中 | 编辑完成后部署 |
modifying | 正在进行 AI 修改 | 等待修改完成 |
状态流转图
[用户创建项目]
|
v
generating ---→ error
|
v
generated ---&rtr; editing <--> modifying
| |
v v
deploying --&rtr; deployment_error
|
v
deployed
部署上线
代码生成或编写完成后,部署功能将应用发布到云端,获得公网可访问的 URL。
部署流程
- 进入项目详情
在控制台点击目标项目,进入详情页。
- 确认代码无误
在部署前检查代码是否完整,依赖是否正确配置。可通过内置终端进行本地测试。
- 点击部署
在详情页找到部署按钮,点击启动部署流程。系统将自动打包、安装依赖并启动服务。
- 获取访问地址
部署完成后,您将获得一个公网地址,可直接访问或分享给他人。
部署模式
SSH 远程部署(默认)
代码将被上传到远程服务器的 /var/www/{domain}/ 目录并自动运行。需要在环境变量中配置 SSH 连接信息。
DEPLOY_MODE=ssh
SERVER_IP=你的服务器IP
SERVER_PORT=22
SERVER_USERNAME=root
SERVER_PASSWORD=你的密码
本地部署
代码将部署在本机 user_sites/deployed/{domain}/ 目录,作为独立进程运行。使用 PORT_START 配置自动分配端口。
DEPLOY_MODE=local
部署日志
部署过程中,系统通过 WebSocket 实时推送部署状态到前端。部署完成后可在项目详情页查看完整部署日志。
应用市场
应用市场是 TalkCode 的社区功能,用户可以将自己的公开应用分享给社区,也可以浏览和体验他人创建的应用。
浏览应用
访问首页即可看到公开应用列表,支持:
- 排序 — 按时间(最新发布)或热度(点赞数)排序
- 搜索 — 通过关键词搜索应用名称
- 分页 — 每页显示 12 个应用
分享应用
创建项目时选择"公开",应用将自动出现在应用市场中。您还可以上传预览截图,让应用更有吸引力。
社交互动
认证 API
所有需要认证的接口需携带 Header:Authorization: Bearer <token>
| 方法 | 路径 | 认证 | 说明 |
|---|---|---|---|
| POST | /api/auth/register | 无 | 用户注册 |
| POST | /api/auth/login | 无 | 用户登录,返回 JWT |
| GET | /api/auth/me | 必须 | 获取当前用户信息 |
注册
POST /api/auth/register
Content-Type: application/json
{
"email": "user@example.com",
"username": "alice",
"password": "123456",
"nickname": "Alice"
}
登录
POST /api/auth/login
Content-Type: application/json
{
"email": "user@example.com",
"password": "123456"
}
// 响应
{
"success": true,
"data": {
"token": "eyJhbGciOiJI...",
"user": { "id": 1, "email": "user@example.com", "username": "alice" }
}
}
项目 API
| 方法 | 路径 | 认证 | 说明 |
|---|---|---|---|
| GET | /api/projects | 必须 | 获取我的项目列表 |
| GET | /api/projects/:id | 必须 | 获取项目详情 |
| PUT | /api/projects/:id | 必须 | 更新项目配置 |
| DELETE | /api/projects/:id | 必须 | 删除项目 |
| GET | /api/projects/:id/files/:fileId/content | 必须 | 获取文件内容 |
| PUT | /api/projects/:id/files/:fileId | 必须 | 保存文件内容 |
| GET | /api/projects/:id/logs | 必须 | 获取项目日志 |
| DELETE | /api/projects/:id/logs | 必须 | 清空项目日志 |
| POST | /api/projects/:id/fetch-remote-code | 必须 | 从远程服务器拉取代码 |
获取项目详情
GET /api/projects/42
Authorization: Bearer <token>
响应包含项目基本信息、文件列表(不含内容)、部署状态等。
保存文件内容
PUT /api/projects/42/files/100
Authorization: Bearer <token>
Content-Type: application/json
{
"content": "console.log('hello world');"
}
AI 功能 API
| 方法 | 路径 | 认证 | 说明 |
|---|---|---|---|
| POST | /api/projects/ai | 必须 | AI 构建:自然语言创建项目 |
| GET | /api/projects/:id/generate-stream | 必须 | SSE 流:查看生成进度 |
| POST | /api/projects/:id/regenerate/:filename? | 必须 | 重新生成文件 |
| POST | /api/projects/:id/modify-stream | 必须 | SSE 流:多轮 AI 修改代码 |
| GET | /api/projects/:id/modify-preview | 必须 | 预览 AI 修改的 diff |
| POST | /api/projects/:id/modify-apply | 必须 | 确认并应用修改 |
| POST | /api/projects/:id/modify-discard | 必须 | 丢弃修改 |
| GET | /api/projects/:id/inquiry | 必须 | SSE 流:代码质询 |
AI 构建
POST /api/projects/ai
Authorization: Bearer <token>
Content-Type: application/json
{
"name": "智能日程助手",
"language": "Node.js",
"prompt": "一个可以添加、删除、查看日程的Web应用",
"port": 10001,
"is_public": true
}
项目创建后状态为 generating,前端通过 SSE 实时查看生成进度。
AI 修改代码
POST /api/projects/42/modify-stream
Authorization: Bearer <token>
Content-Type: application/json
{
"requirement": "把背景色改为深色主题"
}
返回 SSE 流,修改结果先存入 temp/ 目录,确认后调用 modify-apply 应用。
代码质询
GET /api/projects/42/inquiry?question=这个项目的主要功能是什么
Authorization: Bearer <token>
部署 API
| 方法 | 路径 | 认证 | 说明 |
|---|---|---|---|
| POST | /api/projects/:id/deploy | 必须 | 部署项目 |
| GET | /api/deployments/:id/logs | 必须 | 获取部署日志 |
| POST | /api/projects/:id/stop | 必须 | 停止运行中进程 |
| GET | /api/processes | 必须 | 查看运行中进程列表 |
部署项目
POST /api/projects/42/deploy
Authorization: Bearer <token>
Content-Type: application/json
{
"mode": "ssh",
"is_public": true
}
mode: "ssh"→ SSH 远程部署到配置的服务器mode: "local"→ 本地部署,在本机启动进程
部署状态通过 WebSocket 实时推送到前端。
环境管理 API
源码构建模式下的 IDE 文件管理接口:
| 方法 | 路径 | 认证 | 说明 |
|---|---|---|---|
| POST | /api/environments | 必须 | 创建源码构建环境 |
| GET | /api/environments/:id/files | 必须 | 获取文件列表 |
| POST | /api/environments/:id/folder | 必须 | 创建文件夹 |
| POST | /api/environments/:id/file | 必须 | 创建文件 |
| POST | /api/environments/:id/upload | 必须 | 上传文件(支持 ZIP) |
| GET | /api/environments/:id/file-content | 必须 | 读取文件内容 |
| PUT | /api/environments/:id/file-content | 必须 | 更新文件内容 |
| DELETE | /api/environments/:id/file | 必须 | 删除文件或文件夹 |
社交互动 API
| 方法 | 路径 | 认证 | 说明 |
|---|---|---|---|
| GET | /api/public/projects | 可选 | 首页公开应用列表 |
| POST | /api/projects/:id/like | 必须 | 点赞/取消点赞 |
| POST | /api/projects/:id/view | 可选 | 记录浏览 |
| POST | /api/projects/:id/preview-image | 必须 | 上传预览截图 |
公开应用列表
GET /api/public/projects?page=1&pageSize=12&sort=time&search=日程
| 参数 | 默认值 | 说明 |
|---|---|---|
page | 1 | 页码 |
pageSize | 12 | 每页数量 |
sort | time | 排序:time(按时间)/ hot(按热度) |
search | 空 | 搜索关键词 |
WebSocket 实时通信
客户端连接到服务端 WebSocket 后,可订阅项目频道并接收实时状态推送。
连接与订阅
v4.8 WebSocket 连接需要携带登录 token(query 参数),未认证连接将被服务端以 4401 关闭;订阅时会校验项目归属(owner 或管理员),越权订阅将收到 subscribe_denied 事件。
// 连接 WebSocket(携带 token 鉴权)
const ws = new WebSocket('ws://localhost:3000/?token=YOUR_JWT_TOKEN');
// 订阅项目频道(服务端校验项目归属)
ws.send(JSON.stringify({ type: 'subscribe', projectId: 42 }));
// 心跳检测
ws.send(JSON.stringify({ type: 'ping' }));
// 收到 { "type": "pong" }
服务端推送事件
| 事件类型 | 触发时机 |
|---|---|
generation_complete | AI 代码生成完成 |
generation_error | AI 代码生成失败 |
files_modified | 文件被修改 |
modify_redeploy_complete | 修改确认并重新部署完成 |
modify_redeploy_error | 修改重新部署失败 |
deployment_complete | 部署完成 |
deployment_error | 部署失败 |
SSE 事件流
TalkCode 通过 SSE(Server-Sent Events)实时推送 AI 生成进度,v2.1 新增了多个事件类型。
生成阶段事件
| 事件类型 | 说明 | 新增 |
|---|---|---|
phase | 流程阶段切换(planning/generating/verifying/deploying) | - |
plan_detail | 架构规划详情 | - |
contract_generated | 跨文件契约已生成,包含 DOM/CSS/JS 契约和前端文件组 | NEW |
frontend_group_generating | 前端文件组开始合并生成 | NEW |
frontend_group_complete | 前端文件组生成完成 | NEW |
frontend_group_error | 前端文件组生成失败 | NEW |
file_generating | 单个文件开始生成 | - |
file_complete | 单个文件生成完成 | - |
file_error | 单个文件生成失败 | - |
验证阶段事件
| 事件类型 | 说明 | 新增 |
|---|---|---|
verification_result | 验证结果,新增跨文件一致性摘要 | NEW |
fix_detail | 自动修复详情 | - |
fix_error | 修复出错 | - |
quality_report | 质量评估报告 | - |
verification_result 事件增强
{
"type": "verification_result",
"passed": false,
"issues": [...],
"warnings": [...],
"crossFileIssues": [
{
"severity": "critical",
"file": "game.js",
"message": "JS 中 getElementById('score-display') 引用的 DOM ID 在 HTML 中不存在"
}
],
"crossFileWarnings": [
{
"severity": "warning",
"file": "style.css",
"message": "契约中定义的 CSS 类名 game-canvas 在 CSS 中未定义"
}
],
"crossFileSummary": "跨文件一致性检查发现 2 个严重问题、1 个警告"
}
contract_generated 事件示例
{
"type": "contract_generated",
"domContract": { "screenIds": [...], "elementIds": {...} },
"cssContract": { "classMap": {...} },
"jsContract": { "globalAPI": {...} },
"frontendGroups": [
{
"html": "index.html",
"cssFiles": ["static/css/style.css"],
"jsFiles": ["static/js/game.js", "static/js/api.js"]
}
],
"message": "跨文件契约已生成:6 个 DOM ID、8 个 CSS 类名、2 个 JS API"
}
数据库设计
TalkCode 使用 SQLite 嵌入式数据库,文件存储在 ./talkcode.db。可通过 DB_PATH 环境变量自定义路径。
核心数据表
| 表名 | 用途 | 主要字段 |
|---|---|---|
users | 用户表 | id, email, username, nickname, password, role, created_at |
projects | 项目表 | id, name, build_type, language, runtime, env_name, port, domain, status, is_public, user_id, access_token |
project_files | 项目文件表 | id, project_id, filename, file_path, content, file_type |
environment_configs | 环境配置表 | id, project_id, config_key, config_value |
deployment_logs | 部署日志表 | id, project_id, log_type, message, created_at |
project_logs | 项目操作日志表 | id, project_id, action, details, created_at |
user_quotas | 用户配额表 | id, user_id, project_count, daily_ai_calls, max_projects |
invite_codes | 邀请码表 | id, code, used, created_by, used_by |
verification_codes | 验证码表 | id, email, code, expires_at |
redeem_codes | 兑换码表 | id, code, quota_type, quota_value, used |
redeem_usages | 兑换码使用记录 | id, redeem_code_id, user_id, used_at |
user_daily_usage | 用户每日使用量 | id, user_id, date, ai_calls, deploy_count |
环境变量配置
在项目根目录创建 .env 文件:
# 基础配置
PORT=3000
SECRET_KEY=your-jwt-secret-key
# 数据库
DB_PATH=./talkcode.db
# AI 配置
OPENAI_API_KEY=sk-xxxxxxxx
OPENAI_BASE_URL=https://api.openai.com/v1
OPENAI_MODEL=gpt-4
# 部署配置
DEPLOY_MODE=ssh # ssh 或 local
SERVER_IP=your-server-ip
SERVER_PORT=22
SERVER_USERNAME=root
SERVER_PASSWORD=your-password
# 域名与端口
DOMAIN_SUFFIX=your-domain.com
PORT_START=10001
# 用户源码存储目录
USER_SITES_FOLDER=./user_sites
SECRET_KEY,默认值不安全!请使用随机生成的长字符串。OpenAI API Key 存储在数据库中,仅管理员可查看。最佳实践
以下建议可帮助您获得更高质量的 AI 生成代码和更顺畅的部署体验。
跨文件一致性保障
TalkCode v2.1 的契约机制已自动处理大部分一致性问题,但以下场景仍需注意:
复杂交互逻辑
对于有复杂交互(如拖拽、WebSocket 实时通信、Canvas 绑定事件)的项目,建议在 Prompt 中详细描述事件绑定关系:
事件绑定:
- btn-start 的 click 事件 -> startGame() 函数
- btn-restart 的 click 事件 -> restartGame() 函数
- game-canvas 的 click 事件 -> handleTileClick(event) 函数
- 游戏结束时自动切换到 screen-over 屏幕
多页面项目
如果项目有多个 HTML 页面(如 index.html + admin.html),每个页面会形成独立的文件组,分别合并生成。确保在 Prompt 中描述每个页面的用途和共享的 CSS/JS。
纯后端项目
纯后端项目(无 HTML 前端页面)不需要填写 domContract/cssContract/jsContract,架构规划会自动将这些字段留空。
部署最佳实践
SSH 远程部署
- 确保 SSH 服务器已安装 Node.js(>= 16.x)或 Python(>= 3.8)
- 建议使用非 root 用户部署,配置
SERVER_USERNAME=deploy - 端口范围建议从 10001 开始,避免与系统服务冲突
本地部署
- 适合开发调试和快速预览
- 自动分配端口,从
PORT_START开始递增 - 进程独立运行,停止后端口释放
Prompt 技巧
好的 Prompt 是生成高质量代码的关键。以下是一些实用技巧。
1. 明确描述交互逻辑
不好的 Prompt:
"做一个别踩白块游戏"
好的 Prompt:
"做一个别踩白块游戏,包含4个屏幕:
1. 开始屏幕:显示游戏标题、3个模式按钮、开始按钮
2. 游戏屏幕:4列方块从下往上移动,点击黑块得分
3. 结束屏幕:显示最终分数、玩家昵称输入框、提交按钮
4. 排行榜屏幕:显示前10名玩家分数、返回按钮
屏幕切换通过添加/移除 active 类实现"
2. 指定技术栈和端口
"使用 Node.js + Express,端口 10001,前端用原生 HTML/CSS/JS(不用框架)"
3. 描述数据存储需求
"分数数据存储在 SQLite 中,API 端点:
- POST /api/scores -- 提交分数(参数:playerName, score, mode)
- GET /api/scores -- 获取排行榜(支持 mode 筛选和分页)"
4. 描述用户角色和权限
"用户角色:
- 管理员:可以管理所有数据,包括增删改查
- 普通用户:只能查看和编辑自己的数据
- 游客:只能浏览公开内容"
安全指南
TalkCode 在设计时已考虑多层安全保障,但自托管部署时仍需注意以下事项。
认证与授权
- JWT 认证 — 所有需要认证的 API 均通过 JWT 验证用户身份
- bcrypt 密码哈希 — 密码使用 bcryptjs 哈希存储,不存储明文
- 用户数据隔离 — 每个用户只能访问自己的项目和环境
- 管理员权限 — admin 角色可查看所有项目,普通用户仅限自己的
文件安全
- 路径遍历防护 — 所有文件操作均有
startsWith(envDir)校验 - 文件双存储 — 数据库 + 磁盘双存储,确保数据一致性
- AI 修改暂存 — 修改结果先存入 temp/ 目录,不影响正式代码
API 安全
- 速率限制 — 默认启用 API 速率限制,防止滥用
- API Key 保护 — OpenAI API Key 存储在数据库中,仅管理员可查看
- SECRET_KEY — 务必修改默认的 JWT 密钥
openssl rand -hex 32 生成的密钥。自托管部署
TalkCode 是开源项目,您可以自行部署在自己的服务器上。
前置要求
- Node.js >= 16.x
- npm >= 8.x
- (远程部署需)一台可 SSH 连接的 Linux 服务器
- (AI 功能需)OpenAI 兼容 API Key
安装步骤
# 克隆仓库
git clone https://github.com/aynuzbh/talkcode.git
cd talkcode
# 安装依赖
npm install
# 配置环境变量
cp .env.example .env
# 编辑 .env 填入你的配置
# 启动服务
node server.js
服务默认启动在 http://localhost:3000
开发模式
# 使用 nodemon 热重载
npx nodemon server.js
项目结构
talkcode/
├── server.js # 主服务入口
├── package.json # 项目元数据与依赖
├── database.js # 数据库模块(SQLite)
├── ai-service.js # AI 服务(代码生成/修改/质询)
├── deployment-service.js # SSH 远程部署服务
├── local-deployment-service.js # 本地部署服务
├── auth.js # JWT 认证中间件
├── public/ # 前端页面
│ ├── index.html # 首页
│ ├── login.html # 登录页
│ ├── register.html # 注册页
│ ├── dashboard.html # 用户控制台
│ ├── project.html # 项目详情页
│ ├── environment.html # 环境编辑页
│ └── docs.html # 本文档
├── uploads/ # 文件上传临时目录
└── user_sites/ # 用户源码文件存储
贡献指南
- Fork 本仓库
- 创建特性分支 (
git checkout -b feature/amazing-feature) - 提交更改 (
git commit -m 'Add amazing feature') - 推送到分支 (
git push origin feature/amazing-feature) - 创建 Pull Request
定价方案
我们提供社区版和商业版两种方案,满足不同场景的需求。
企业定制方案
对于大规模需求和特殊场景,我们提供企业级定制方案,包括私有化部署、API 定制集成、专属模型调优等服务。欢迎联系销售团队沟通需求。
商务咨询:2178523692@qq.com
常见问题
更新日志
v2.1.0 最新
- 跨文件契约驱动 — 架构规划阶段自动生成 DOM/CSS/JS 三层契约
- 前端文件合并生成 — HTML + CSS + JS 强耦合文件合并为一次 LLM 调用
- 跨文件一致性验证 — 自动检查 DOM ID、CSS 类名、JS API 调用匹配度
- 新增 SSE 事件 — contract_generated、frontend_group_generating/complete/error
- 增强 verification_result — 新增 crossFileIssues/crossFileWarnings/crossFileSummary
- 增强上下文提取 — 从 15 行扩展到 30 行关键代码
v2.0.0
- AI 代码生成与源码部署平台
- 支持 Node.js + Express 和 Python + Flask
- SSH 远程部署和本地部署
- 在线 IDE(CodeMirror)代码编辑
- 多轮 AI 对话修改(暂存 + diff 预览)
- 代码质询功能
- 公开应用市场(点赞、浏览、搜索)
- JWT 认证 + bcrypt 密码哈希
- WebSocket 实时状态推送
- SSE 流式生成进度
联系我们
如果您在使用过程中遇到任何问题,或有商业合作需求,欢迎通过以下方式联系我们:
商业版购买、企业定制
提交 Issue、贡献代码
详细描述问题,附上截图
我们认真对待每一条反馈