feat: 初始化考培练系统项目
- 从服务器拉取完整代码 - 按框架规范整理项目结构 - 配置 Drone CI 测试环境部署 - 包含后端(FastAPI)、前端(Vue3)、管理端 技术栈: Vue3 + TypeScript + FastAPI + MySQL
This commit is contained in:
132
知识库/Coze集成方案.md
Normal file
132
知识库/Coze集成方案.md
Normal file
@@ -0,0 +1,132 @@
|
||||
# Coze-Chat 集成方案分析
|
||||
|
||||
## 现状分析
|
||||
|
||||
### 技术栈差异
|
||||
- **主系统**:Vue3 + TypeScript + Element Plus
|
||||
- **Coze-Chat**:React 18 + TypeScript + Ant Design
|
||||
|
||||
### 功能定位
|
||||
Coze-Chat 是考培练系统的智能对话模块,提供:
|
||||
- 智能体列表展示
|
||||
- 实时流式对话
|
||||
- 语音输入输出
|
||||
- 会话管理
|
||||
|
||||
## 集成方案对比
|
||||
|
||||
### 方案一:独立服务部署(推荐短期方案)
|
||||
|
||||
**优势**:
|
||||
- 无需重写代码,立即可用
|
||||
- 保持模块独立性和稳定性
|
||||
- 部署灵活,可独立扩展
|
||||
|
||||
**实施方式**:
|
||||
1. 将 Coze-Chat 作为独立微服务部署在独立容器
|
||||
2. 通过 API Gateway 统一入口
|
||||
3. 主系统通过 iframe 或 API 调用集成
|
||||
|
||||
**配置示例**:
|
||||
```yaml
|
||||
# docker-compose.yml
|
||||
services:
|
||||
coze-service:
|
||||
build: ./参考代码/coze-chat-系统/coze-chat-backend
|
||||
ports:
|
||||
- "8001:8000"
|
||||
|
||||
coze-frontend:
|
||||
build: ./参考代码/coze-chat-系统/coze-chat-frontend
|
||||
ports:
|
||||
- "3002:80"
|
||||
```
|
||||
|
||||
### 方案二:逐步迁移到 Vue3(推荐长期方案)
|
||||
|
||||
**优势**:
|
||||
- 统一技术栈,降低维护成本
|
||||
- 更好的集成体验
|
||||
- 统一的组件库和样式
|
||||
|
||||
**实施计划**:
|
||||
1. **第一阶段**:API 层对接
|
||||
- 保留 Coze 后端服务
|
||||
- 在 Vue3 中创建对话组件
|
||||
- 复用现有 API 接口
|
||||
|
||||
2. **第二阶段**:功能迁移
|
||||
- 智能体列表页面
|
||||
- 对话界面
|
||||
- 语音功能模块
|
||||
|
||||
3. **第三阶段**:完全整合
|
||||
- 统一用户系统
|
||||
- 统一权限管理
|
||||
- 统一样式主题
|
||||
|
||||
## 推荐实施路径
|
||||
|
||||
### 短期(1-2周)
|
||||
1. 保持 Coze-Chat 作为独立服务
|
||||
2. 在主系统中通过 iframe 嵌入关键页面
|
||||
3. 统一认证 Token 传递
|
||||
|
||||
### 中期(1-2月)
|
||||
1. 抽取 Coze API 服务层
|
||||
2. 在 Vue3 中实现核心对话组件
|
||||
3. 逐步替换 React 页面
|
||||
|
||||
### 长期(3-6月)
|
||||
1. 完全迁移到 Vue3
|
||||
2. 优化集成体验
|
||||
3. 统一技术栈
|
||||
|
||||
## 技术要点
|
||||
|
||||
### API 对接
|
||||
```javascript
|
||||
// Vue3 中调用 Coze API
|
||||
import { cozeApi } from '@/api/coze'
|
||||
|
||||
export const cozeService = {
|
||||
// 获取智能体列表
|
||||
async getBots() {
|
||||
return await cozeApi.get('/agent/v1/cozechat/bots')
|
||||
},
|
||||
|
||||
// 创建对话
|
||||
async createChat(data) {
|
||||
return await cozeApi.post('/agent/v1/cozechat/create-chat-stream', data)
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
### iframe 集成
|
||||
```vue
|
||||
<template>
|
||||
<div class="coze-container">
|
||||
<iframe
|
||||
:src="cozeUrl"
|
||||
:style="{ width: '100%', height: '100%', border: 'none' }"
|
||||
@load="onCozeLoaded"
|
||||
/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
const cozeUrl = computed(() => {
|
||||
const token = useAuthStore().token
|
||||
return `http://localhost:3002?token=${token}`
|
||||
})
|
||||
</script>
|
||||
```
|
||||
|
||||
## 结论
|
||||
|
||||
建议采用**渐进式迁移策略**:
|
||||
1. 短期保持独立部署,通过 iframe 集成
|
||||
2. 中期开始组件级迁移
|
||||
3. 长期实现完全整合
|
||||
|
||||
这样既能快速上线,又为未来的技术栈统一留出空间。
|
||||
Reference in New Issue
Block a user