import { Message } from 'element-ui'; import { GetLiveRoomInfo } from '@/api/live'; import { rtc, publishStream, closeVideo } from '@/views/live/common'; export { initSDK, sendMsg, getLiveStat, getDevice, downloadWebSDK, createScript, handsDown } from '@/views/live/common'; // 分组讨论 let r; export function init(data) { r = new Rtc(data); return r; } // 连麦 /** * 学生端接受老师的上麦邀请,同意上麦 */ export function inviteAccept(object) { rtc.inviteAccept(object); } /** * 申请连麦 */ export function handsUp(data) { rtc.handsUp(data); } /** * 取消订阅远程流 */ function unSubscribeStream(stream) { rtc.unSubscribeStream({ unSubStream: stream, success: function (str) { console.log('取消订阅流成功', str); }, fail: function (str) { console.log(str); } }); } /** * 初始化监听事件 */ export function initListener(vue) { rtc.on('login_success', data => { console.log('登录成功', data); Message({ message: '登录成功', type: 'success' }); vue.roomData = data; // 初始化画板需要的数据 let canvasInitData = { allowDraw: false, // 是否具有书写画笔权限(讲师权限) true / false id: 'draw-parent', pptDisplay: 1, // 文档展示方式。默认0,按窗口 1,按宽度 liveId: data.live.status === 1 ? data.live.id : '' // 如果直播已经开始,需将直播 id 传入 sdk 中 }; // 初始化画板 rtc.canvasInit(canvasInitData); }); rtc.on('login_failed', data => { console.log('登录失败', data); Message({ message: '登录失败:' + JSON.stringify(data), type: 'warning' }); }); // 教师 必须在加入房间成功的事件回调里创建本地流 rtc.on('conference_join', () => { console.log('加入房间成功'); }); rtc.on('conference_join_failed', err => { // 加入房间失败 err为错误原因 console.log('加入房间失败', err); }); // 新增订阅流事件 rtc.on('allow_sub', stream => { if (stream.isMixed()) { console.log('是混合流,不订阅'); } else { // 订阅远程流 rtc.trySubscribeStream({ tryStream: stream, success: stream => { // 订阅流成功 let streamType = stream.streamType(); vue.remoteStreamType = streamType; console.log('订阅流成功', streamType); let id = streamType === 0 ? 'live' : 'student'; stream.show(id, 'contain'); // 将流显示到指定 id 的盒子中 if (streamType === 1 || streamType === 10) { vue.connect = true; vue.callLoading = false; } }, fail: function (err) { console.log('订阅流失败', err); } }); } }); // 推流前查询直播状态失败,导致没有推流 rtc.on('local_stream_publish_failed', function () { console.log('推流前查询直播状态失败,导致没有推流'); Message({ message: '推流前查询直播状态失败,导致没有推流', type: 'warning' }); }); // 房间全量信息事件(人员进出时广播) rtc.on('room_context', roomData => { vue.roomContext = JSON.parse(roomData); vue.getLiveRoomStudentList(); console.log('房间全量信息事件(人员进出时广播)', JSON.parse(roomData)); }); rtc.on('publish_stream', str => { console.log('直播已开启', str); Message({ type: 'success', message: '直播已开启' }); vue.liveStat = true; }); rtc.on('end_stream', str => { console.log('直播已关闭', str); Message({ type: 'success', message: '直播已关闭' }); vue.liveStat = false; }); // 单个用户配置监听 rtc.on('switch_user_settings', settingData => { console.log('单个用户配置监听', JSON.parse(settingData)); }); // 人员列表事件(人员麦序变化时广播) rtc.on('speak_context', speakData => { vue.speakData = JSON.parse(speakData); console.log('人员列表事件(人员麦序变化时广播)', JSON.parse(speakData)); }); rtc.on('switch_settings', data => { console.log('房间设置事件', JSON.parse(data)); // 房间设置事件 }); rtc.on('publishStreamErr', data => { console.log('推流意外终止:' + data.streamName); // 直播开启状态下,尝试重推这条流 }); rtc.on('kick_out', function () { console.log('自己被踢出房间'); }); // 视频无法自动播放 rtc.on('playError', data => { console.log('视频无法自动播放', data); }); // 监听通知移除流事件 rtc.on('stream_removed', function (stream) { console.log('监听通知移除流事件'); vue.connect = false; vue.remoteStreamType = -1; vue.connectStudent = ''; }); // 停止订阅流 rtc.on('unSub', function (stream) { console.log('停止订阅流'); unSubscribeStream(stream); }); /** * 排麦监听事件 */ // 监听自己被邀请事件 rtc.on('inviteUp', uid => { console.log('监听自己被邀请事件', uid); vue.callLoading = true; vue.invite = true; }); rtc.on('mcDown', () => { closeVideo('picture'); vue.connect = false; vue.invite = false; }); rtc.on('videoModeChange', data => { console.log('连麦音视频模式更新成功监听回调', data.settings.video_mode); vue.roomInfo.video_mode = data.settings.video_mode; }); rtc.on('createLocalStream', () => { // 创建本地流推流 GetLiveRoomInfo({ task_id: vue.task_id }).then(({ video_mode }) => { console.log('创建本地流推流'); vue.roomInfo.video_mode = video_mode; const createData = { video: video_mode === 1, audio: true }; rtc.createLocalStream({ streamName: 'picture', createData, success: function (stream) { vue.connect = true; vue.callLoading = false; console.log('创建本地流成功', stream); // 创建本地流成功,将流展示到id为 student 的dom元素盒子中 stream.show('student'); publishStream('picture'); // 如果需要立即推流,执行 publish 方法 }, fail: function (data) { console.log('创建本地流失败,应用层处理', data); // 创建本地流失败,应用层处理 Message({ type: 'error', message: '创建本地流失败:' + data }); } }); }); }); /** * 监听聊天事件 */ rtc.on('chat_message', data => { let dat = JSON.parse(data); console.log(dat); // 敏感词过滤:如果发送的聊天消息被系统判定包含敏感词,则只有发送者能收到本条消息,房间内其他人都不会收到这条聊天消息。 // 如果返回消息中有 isFilterChat 字段(消息不包含敏感词返回数据中无isFilterChat字段),且isFilterChat的值为1,则说明该消息包含敏感字,除发送者外其他人不会收到这条消息。 if (dat.isFilterChat && dat.isFilterChat === 1) { return; } vue.chatList.push(dat); }); rtc.on('allowChatChange', function (data) { let msg = data.settings.allow_chat ? '开言' : '禁言'; Message({ type: 'success', message: `全体${msg}成功` }); }); // 接收自定义消息 rtc.on('publish_message', function (data) { // 连接中途下麦 if (data.type === 'handsDown-load' && data.uid === vue.room_user_id) { vue.callLoading = false; } // 连麦信息 if (data.type === 'inviteImage') { vue.connectStudent = data.connectStudent; } }); }