22 KiB
22 KiB
工单服务 + Jitsi Meet 视频会议 技术方案
📋 目录
业务流程分析
完整业务流程
用户进入小程序
↓
AI客服对话（默认）
↓
连续3次AI对话后询问是否转人工
↓
用户触发转人工
↓
AI自动生成工单信息预填表单
↓
用户创建工单
↓
【核心变更】创建IM聊天室（取代微信客服）
↓
同步AI对话记录到聊天室
↓
客服人员加入聊天室
↓
客服与客户IM对话
↓
【可选】发起Jitsi Meet视频会议
↓
工单处理和状态更新
↓
工单完成/撤销，生成总结和词云
关键改动点
取消微信客服 → 使用自建IM + Jitsi Meet
- IM聊天室：文字、图片、文件、语音消息
- 视频会议：通过iframe嵌入Jitsi Meet，最简实现
- 权限控制：只有聊天室成员才能创建/加入会议
数据表结构设计
核心表结构（6+1张表）
1. tb_chat_room - 聊天室表 ⭐核心表
用途：一个工单对应一个聊天室
room_id -- 聊天室ID（主键）
workcase_id -- 关联工单ID（唯一）
room_name -- 聊天室名称
status -- 状态：active-活跃 closed-已关闭 archived-已归档
guest_id -- 来客ID
guest_name -- 来客姓名
ai_session_id -- AI对话会话ID（从ai.tb_chat同步）
current_agent_id -- 当前负责客服ID
agent_count -- 已加入客服人数
message_count -- 消息总数
unread_count -- 未读消息数（客服端）
last_message_time -- 最后消息时间
last_message -- 最后消息内容（列表展示用）
业务规则：
- 创建工单时自动创建聊天室
- 聊天室状态随工单状态变化
- 工单完成后聊天室归档
2. tb_chat_room_member - 聊天室成员表
用途：记录聊天室内的所有成员
member_id -- 成员记录ID（主键）
room_id -- 聊天室ID
user_id -- 用户ID（来客ID或员工ID）
user_type -- 用户类型：guest-来客 agent-客服 ai-AI助手
user_name -- 用户名称
role -- 角色：owner-创建者 admin-管理员 member-普通成员
status -- 状态：active-活跃 left-已离开 removed-被移除
unread_count -- 该成员的未读消息数
last_read_time -- 最后阅读时间
last_read_msg_id -- 最后阅读的消息ID
join_time -- 加入时间
leave_time -- 离开时间
业务规则：
- 来客自动加入（创建者）
- 客服手动加入或系统分配
- 用于权限校验：只有成员能发消息和发起会议
3. tb_chat_message - 聊天室消息表
用途：存储所有聊天消息（AI对话+人工客服对话）
message_id -- 消息ID（主键）
room_id -- 聊天室ID
sender_id -- 发送者ID
sender_type -- 发送者类型：guest-来客 agent-客服 ai-AI助手 system-系统消息
sender_name -- 发送者名称
message_type -- 消息类型：text image file voice video system meeting
content -- 消息内容
content_extra -- 扩展内容（JSONB：图片URL、文件信息、会议链接等）
reply_to_msg_id -- 回复的消息ID（引用回复）
is_ai_message -- 是否AI消息
ai_message_id -- AI原始消息ID（追溯用）
status -- 状态：sending sent delivered read failed recalled
read_count -- 已读人数
send_time -- 发送时间
业务规则：
- 从ai.tb_chat同步AI对话时设置
is_ai_message=true - 会议通知作为系统消息
message_type=meeting - 支持引用回复和消息撤回
4. tb_video_meeting - 视频会议表 ⭐Jitsi Meet
用途：记录聊天室内创建的视频会议
meeting_id -- 会议ID（主键，也是Jitsi房间名）
room_id -- 关联聊天室ID
workcase_id -- 关联工单ID
meeting_name -- 会议名称
meeting_password -- 会议密码（可选）
jwt_token -- JWT Token（身份验证）
jitsi_room_name -- Jitsi房间名（格式：workcase_{workcase_id}_{timestamp}）
jitsi_server_url -- Jitsi服务器地址（默认：https://meet.jit.si）
status -- 状态：scheduled ongoing ended cancelled
creator_id -- 创建者ID
creator_type -- 创建者类型：guest-来客 agent-客服
creator_name -- 创建者名称
participant_count -- 参与人数
max_participants -- 最大参与人数
start_time -- 实际开始时间
end_time -- 实际结束时间
duration_seconds -- 会议时长（秒）
iframe_url -- iframe嵌入URL（生成后存储）
config -- Jitsi配置项（JSONB自定义配置）
业务规则：
- 只有聊天室成员能创建会议
jitsi_room_name唯一，格式：workcase_{workcaseId}_{timestamp}iframe_url在创建时生成，前端直接使用
5. tb_meeting_participant - 会议参与记录表（可选）
用途：用于审计和统计
participant_id -- 参与记录ID（主键）
meeting_id -- 会议ID
user_id -- 用户ID
user_type -- 用户类型：guest-来客 agent-客服
user_name -- 用户名称
join_time -- 加入时间
leave_time -- 离开时间
duration_seconds -- 参与时长（秒）
is_moderator -- 是否主持人
join_method -- 加入方式：web mobile desktop
device_info -- 设备信息
业务规则：
- 记录每个参与者的加入和离开时间
- 用于统计会议时长和参与情况
- 可用于生成会议报告
6. tb_customer_service - 客服人员配置表（可选）
用途：管理有客服权限的员工
agent_id -- 客服ID（关联sys用户ID）
agent_name -- 客服姓名
agent_code -- 客服工号
status -- 状态：online busy offline
skill_tags -- 技能标签（如：电力、燃气、水务）
max_concurrent -- 最大并发接待数
current_workload -- 当前工作量
total_served -- 累计服务次数
avg_response_time -- 平均响应时间（秒）
satisfaction_score -- 满意度评分（0-5）
业务规则：
- 用于客服负载均衡
- 技能标签用于智能分配
- 实时更新工作量
7. tb_word_cloud - 词云统计表（已有）
用途：记录聊天和工单中的关键词
word_id -- 词条ID（主键）
word -- 词语
frequency -- 词频
source_type -- 来源类型：chat workcase global
source_id -- 来源ID（room_id/workcase_id）
category -- 分类：fault device emotion等
stat_date -- 统计日期（按天聚合）
核心服务功能
Service层设计
1. ChatRoomService - 聊天室服务
// 创建聊天室（工单创建时调用）
ChatRoomVO createChatRoom(CreateChatRoomDTO dto);
// 关闭聊天室（工单完成时调用）
void closeChatRoom(String roomId, String closedBy);
// 获取聊天室详情
ChatRoomVO getChatRoomByWorkcaseId(String workcaseId);
// 同步AI对话记录到聊天室
void syncAiMessages(String roomId, String aiSessionId);
// 更新聊天室统计信息
void updateChatRoomStats(String roomId);
2. ChatMemberService - 聊天室成员服务
// 添加成员到聊天室
void addMember(String roomId, String userId, String userType);
// 移除成员
void removeMember(String roomId, String userId);
// 检查用户是否是聊天室成员（权限校验）
boolean isMemberOfRoom(String roomId, String userId);
// 获取聊天室成员列表
List<ChatMemberVO> getRoomMembers(String roomId);
// 更新成员未读数
void updateMemberUnreadCount(String roomId, String userId);
3. ChatMessageService - 聊天消息服务
// 发送消息
ChatMessageVO sendMessage(SendMessageDTO dto);
// 获取聊天历史
PageResult<ChatMessageVO> getChatHistory(String roomId, PageParam pageParam);
// 标记消息已读
void markMessagesAsRead(String roomId, String userId, List<String> messageIds);
// 撤回消息
void recallMessage(String messageId, String userId);
// 同步AI消息（从ai.tb_chat）
void syncAiMessages(String roomId, String aiSessionId);
4. VideoMeetingService - 视频会议服务 ⭐核心
// 创建会议
VideoMeetingVO createMeeting(CreateMeetingDTO dto);
// 验证加入会议权限
boolean validateMeetingAccess(String meetingId, String userId);
// 生成会议iframe URL
String generateMeetingIframeUrl(String meetingId, String userId);
// 开始会议
void startMeeting(String meetingId);
// 结束会议
void endMeeting(String meetingId);
// 获取会议详情
VideoMeetingVO getMeetingInfo(String meetingId);
// 记录参与者加入
void recordParticipantJoin(String meetingId, String userId);
// 记录参与者离开
void recordParticipantLeave(String meetingId, String userId);
5. JitsiTokenService - Jitsi JWT Token服务
// 生成JWT Token（用于身份验证）
String generateJwtToken(String roomName, String userId, String userName, boolean isModerator);
// 验证JWT Token
boolean validateJwtToken(String token);
// 生成iframe嵌入URL
String buildIframeUrl(String roomName, String jwtToken, JitsiConfig config);
API接口设计
聊天室相关接口
1. 创建聊天室
POST /api/workcase/chat-room/create
请求体：{
"workcaseId": "WC20231220001",
"guestId": "GUEST001",
"guestName": "张三",
"aiSessionId": "AI_SESSION_123"
}
响应：{
"code": 0,
"data": {
"roomId": "ROOM001",
"roomName": "工单#WC20231220001的客服支持",
"status": "active"
}
}
2. 发送消息
POST /api/workcase/chat-room/send-message
请求体：{
"roomId": "ROOM001",
"senderId": "USER001",
"senderType": "agent",
"messageType": "text",
"content": "您好，我是客服小李，请问有什么可以帮到您？"
}
响应：{
"code": 0,
"data": {
"messageId": "MSG001",
"sendTime": "2023-12-20T10:00:00Z"
}
}
3. 获取聊天历史
GET /api/workcase/chat-room/messages?roomId=ROOM001&page=1&size=50
响应：{
"code": 0,
"data": {
"total": 120,
"list": [
{
"messageId": "MSG001",
"senderId": "USER001",
"senderName": "客服小李",
"senderType": "agent",
"messageType": "text",
"content": "您好，我是客服小李",
"sendTime": "2023-12-20T10:00:00Z",
"status": "read"
}
]
}
}
视频会议相关接口 ⭐
1. 创建视频会议
POST /api/workcase/meeting/create
请求头：Authorization: Bearer <token>
请求体：{
"roomId": "ROOM001",
"workcaseId": "WC20231220001",
"meetingName": "工单技术支持会议",
"maxParticipants": 10
}
响应：{
"code": 0,
"data": {
"meetingId": "MEET001",
"jitsiRoomName": "workcase_WC20231220001_1703059200",
"iframeUrl": "https://meet.jit.si/workcase_WC20231220001_1703059200?jwt=eyJhbGc...",
"status": "scheduled"
}
}
业务逻辑：
- 验证请求用户是否是聊天室成员
- 生成唯一的
jitsi_room_name - 生成JWT Token（包含用户身份和权限）
- 构建iframe URL
- 发送系统消息到聊天室通知会议创建
2. 获取会议信息（用于加入会议）
GET /api/workcase/meeting/info/{meetingId}
请求头：Authorization: Bearer <token>
响应：{
"code": 0,
"data": {
"meetingId": "MEET001",
"meetingName": "工单技术支持会议",
"jitsiRoomName": "workcase_WC20231220001_1703059200",
"iframeUrl": "https://meet.jit.si/workcase_WC20231220001_1703059200?jwt=eyJhbGc...",
"status": "ongoing",
"participantCount": 2,
"maxParticipants": 10,
"canJoin": true
}
}
业务逻辑：
- 验证请求用户是否是聊天室成员
- 生成用户专属的JWT Token
- 返回带Token的iframe URL
- 记录参与者加入时间
3. 开始会议
POST /api/workcase/meeting/start/{meetingId}
响应：{
"code": 0,
"message": "会议已开始"
}
4. 结束会议
POST /api/workcase/meeting/end/{meetingId}
响应：{
"code": 0,
"data": {
"durationSeconds": 1800,
"participantCount": 3
}
}
前端集成方案
最简iframe嵌入实现
Vue 3 组件示例
<template>
<div class="video-meeting-container">
<!-- 会议控制按钮 -->
<div v-if="!meetingStarted" class="meeting-controls">
<Button @click="createMeeting" variant="gradient-blue">
<Video class="w-4 h-4 mr-2" />
发起视频会议
</Button>
</div>
<!-- Jitsi Meet iframe -->
<div v-if="meetingStarted" class="meeting-iframe-wrapper">
<iframe
:src="iframeUrl"
allow="camera; microphone; fullscreen; display-capture"
allowfullscreen
class="meeting-iframe"
></iframe>
<Button @click="endMeeting" variant="danger" class="end-meeting-btn">
结束会议
</Button>
</div>
</div>
</template>
<script setup lang="ts">
import { ref } from 'vue';
import { Video } from 'lucide-vue-next';
import { Button } from '@/components/ui';
import { createVideoMeeting, endVideoMeeting } from '@/api/workcase';
const props = defineProps<{
roomId: string;
workcaseId: string;
}>();
const meetingStarted = ref(false);
const iframeUrl = ref('');
const meetingId = ref('');
// 创建会议
const createMeeting = async () => {
try {
const res = await createVideoMeeting({
roomId: props.roomId,
workcaseId: props.workcaseId,
meetingName: `工单 ${props.workcaseId} 技术支持`,
maxParticipants: 10
});
if (res.code === 0) {
meetingId.value = res.data.meetingId;
iframeUrl.value = res.data.iframeUrl;
meetingStarted.value = true;
}
} catch (error) {
console.error('创建会议失败:', error);
}
};
// 结束会议
const endMeeting = async () => {
try {
await endVideoMeeting(meetingId.value);
meetingStarted.value = false;
iframeUrl.value = '';
} catch (error) {
console.error('结束会议失败:', error);
}
};
</script>
<style scoped lang="scss">
.video-meeting-container {
width: 100%;
height: 100%;
position: relative;
}
.meeting-iframe-wrapper {
width: 100%;
height: 100%;
position: relative;
}
.meeting-iframe {
width: 100%;
height: 100%;
border: none;
border-radius: 8px;
}
.end-meeting-btn {
position: absolute;
bottom: 20px;
right: 20px;
z-index: 1000;
}
</style>
API请求封装
// src/api/workcase/meeting.ts
import { http } from '@/utils/http';
export interface CreateMeetingParams {
roomId: string;
workcaseId: string;
meetingName: string;
maxParticipants?: number;
}
export interface VideoMeetingVO {
meetingId: string;
meetingName: string;
jitsiRoomName: string;
iframeUrl: string;
status: string;
participantCount: number;
maxParticipants: number;
}
// 创建视频会议
export const createVideoMeeting = (params: CreateMeetingParams) => {
return http.post<VideoMeetingVO>('/api/workcase/meeting/create', params);
};
// 获取会议信息
export const getMeetingInfo = (meetingId: string) => {
return http.get<VideoMeetingVO>(`/api/workcase/meeting/info/${meetingId}`);
};
// 结束会议
export const endVideoMeeting = (meetingId: string) => {
return http.post(`/api/workcase/meeting/end/${meetingId}`);
};
移动端适配
<template>
<div class="mobile-meeting" v-if="isMobile">
<!-- 移动端全屏展示 -->
<div class="mobile-iframe-container">
<iframe
:src="iframeUrl"
allow="camera; microphone; fullscreen"
allowfullscreen
class="mobile-iframe"
></iframe>
</div>
</div>
</template>
<style scoped lang="scss">
.mobile-meeting {
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: 9999;
background: #000;
}
.mobile-iframe {
width: 100vw;
height: 100vh;
border: none;
}
</style>
安全方案
1. 会议权限控制
后端验证逻辑
public boolean validateMeetingAccess(String meetingId, String userId) {
// 1. 获取会议信息
VideoMeetingDO meeting = meetingMapper.selectById(meetingId);
if (meeting == null) {
throw new BusinessException("会议不存在");
}
// 2. 检查用户是否是聊天室成员
ChatRoomMemberDO member = memberMapper.selectByRoomAndUser(
meeting.getRoomId(), userId
);
if (member == null || !"active".equals(member.getStatus())) {
throw new BusinessException("您不是聊天室成员，无法加入会议");
}
return true;
}
2. JWT Token生成
public String generateJwtToken(String roomName, String userId, String userName, boolean isModerator) {
long now = System.currentTimeMillis();
long exp = now + (2 * 60 * 60 * 1000); // 2小时有效期
return Jwts.builder()
.setIssuer("urbanLifeline")
.setSubject(roomName)
.setAudience("jitsi")
.claim("context", Map.of(
"user", Map.of(
"id", userId,
"name", userName,
"moderator", isModerator
)
))
.claim("room", roomName)
.setIssuedAt(new Date(now))
.setExpiration(new Date(exp))
.signWith(SignatureAlgorithm.HS256, jitsiSecretKey)
.compact();
}
3. iframe URL构建
public String buildIframeUrl(String roomName, String jwtToken, JitsiConfig config) {
StringBuilder url = new StringBuilder();
url.append(jitsiServerUrl).append("/").append(roomName);
// JWT认证
url.append("?jwt=").append(jwtToken);
// Jitsi配置项
url.append("&config.startWithAudioMuted=").append(config.isStartWithAudioMuted());
url.append("&config.startWithVideoMuted=").append(config.isStartWithVideoMuted());
url.append("&config.enableWelcomePage=false");
url.append("&config.prejoinPageEnabled=false");
url.append("&config.disableDeepLinking=true");
// 界面配置
url.append("&interfaceConfig.SHOW_JITSI_WATERMARK=false");
url.append("&interfaceConfig.SHOW_WATERMARK_FOR_GUESTS=false");
url.append("&interfaceConfig.DISABLE_JOIN_LEAVE_NOTIFICATIONS=true");
return url.toString();
}
4. 防止未授权访问
@PostMapping("/create")
@PreAuthorize("hasAuthority('workcase:meeting:create')")
public ResultDomain<VideoMeetingVO> createMeeting(
@RequestBody @Valid CreateMeetingDTO dto,
@RequestHeader("Authorization") String token
) {
// 1. 从token解析用户信息
String userId = JwtUtil.getUserIdFromToken(token);
// 2. 验证是否是聊天室成员
if (!chatMemberService.isMemberOfRoom(dto.getRoomId(), userId)) {
return ResultDomain.failure("您不是聊天室成员，无法创建会议");
}
// 3. 创建会议
VideoMeetingVO meeting = videoMeetingService.createMeeting(dto, userId);
return ResultDomain.success(meeting);
}
技术要点总结
✅ 优势
- 最简实现：iframe嵌入，无需深度集成Jitsi服务端
- 权限安全：JWT Token + 聊天室成员校验
- 无状态：Jitsi Meet本身无状态，只记录必要的会议元数据
- 可扩展：可后续升级为自建Jitsi服务器
- 成本低：使用官方meet.jit.si服务器，免费
⚠️ 注意事项
- 会议记录：使用官方服务器无法录制，需自建服务器
- 并发限制：官方服务器有并发限制，建议后续自建
- 网络要求：需要良好的网络环境，可能需要科学上网
- 数据隐私：敏感场景建议自建Jitsi服务器
下一步工作
- ✅ 数据表已创建（createTableWorkcase.sql）
- ⏳ 实现Service层业务逻辑
- ⏳ 实现Controller层API接口
- ⏳ 实现前端IM聊天室组件
- ⏳ 实现前端视频会议组件
- ⏳ 测试和调优
附录：Jitsi Meet配置参考
推荐配置项
const jitsiConfig = {
// 音视频设置
startWithAudioMuted: false,
startWithVideoMuted: false,
// 功能开关
enableWelcomePage: false,
prejoinPageEnabled: false,
disableDeepLinking: true,
// 录制和直播
recordingEnabled: false,
liveStreamingEnabled: false,
// 聊天和屏幕共享
enableChat: true,
enableScreenSharing: true,
// 界面定制
hideConferenceSubject: false,
hideConferenceTimer: false,
// 安全设置
enableE2EE: false, // 端到端加密
requireDisplayName: true
};
文档版本：v1.0
最后更新：2023-12-20
作者：Cascade AI Assistant