提交 f64a291c 编写于 作者: huangwensu's avatar huangwensu

Merge branch 'dev-diagnosis-20210323' of...

Merge branch 'dev-diagnosis-20210323' of http://192.168.110.53/com.pica.cloud.education.frontend/pica-admin-consultation into dev-diagnosis-20210323
......@@ -1270,7 +1270,6 @@
"resolved": "http://192.168.110.93:4873/boom/-/boom-2.10.1.tgz",
"integrity": "sha1-OciRjO/1eZ+D+UkqhI9iWt0Mdm8=",
"dev": true,
"optional": true,
"requires": {
"hoek": "2.x.x"
}
......@@ -2735,8 +2734,7 @@
"ansi-regex": {
"version": "2.1.1",
"bundled": true,
"dev": true,
"optional": true
"dev": true
},
"aproba": {
"version": "1.2.0",
......@@ -2757,14 +2755,12 @@
"balanced-match": {
"version": "1.0.0",
"bundled": true,
"dev": true,
"optional": true
"dev": true
},
"brace-expansion": {
"version": "1.1.11",
"bundled": true,
"dev": true,
"optional": true,
"requires": {
"balanced-match": "^1.0.0",
"concat-map": "0.0.1"
......@@ -2779,20 +2775,17 @@
"code-point-at": {
"version": "1.1.0",
"bundled": true,
"dev": true,
"optional": true
"dev": true
},
"concat-map": {
"version": "0.0.1",
"bundled": true,
"dev": true,
"optional": true
"dev": true
},
"console-control-strings": {
"version": "1.1.0",
"bundled": true,
"dev": true,
"optional": true
"dev": true
},
"core-util-is": {
"version": "1.0.2",
......@@ -2909,8 +2902,7 @@
"inherits": {
"version": "2.0.4",
"bundled": true,
"dev": true,
"optional": true
"dev": true
},
"ini": {
"version": "1.3.5",
......@@ -2922,7 +2914,6 @@
"version": "1.0.0",
"bundled": true,
"dev": true,
"optional": true,
"requires": {
"number-is-nan": "^1.0.0"
}
......@@ -2937,7 +2928,6 @@
"version": "3.0.4",
"bundled": true,
"dev": true,
"optional": true,
"requires": {
"brace-expansion": "^1.1.7"
}
......@@ -2945,14 +2935,12 @@
"minimist": {
"version": "1.2.5",
"bundled": true,
"dev": true,
"optional": true
"dev": true
},
"minipass": {
"version": "2.9.0",
"bundled": true,
"dev": true,
"optional": true,
"requires": {
"safe-buffer": "^5.1.2",
"yallist": "^3.0.0"
......@@ -2971,7 +2959,6 @@
"version": "0.5.3",
"bundled": true,
"dev": true,
"optional": true,
"requires": {
"minimist": "^1.2.5"
}
......@@ -3033,8 +3020,7 @@
"npm-normalize-package-bin": {
"version": "1.0.1",
"bundled": true,
"dev": true,
"optional": true
"dev": true
},
"npm-packlist": {
"version": "1.4.8",
......@@ -3062,8 +3048,7 @@
"number-is-nan": {
"version": "1.0.1",
"bundled": true,
"dev": true,
"optional": true
"dev": true
},
"object-assign": {
"version": "4.1.1",
......@@ -3075,7 +3060,6 @@
"version": "1.4.0",
"bundled": true,
"dev": true,
"optional": true,
"requires": {
"wrappy": "1"
}
......@@ -3153,8 +3137,7 @@
"safe-buffer": {
"version": "5.1.2",
"bundled": true,
"dev": true,
"optional": true
"dev": true
},
"safer-buffer": {
"version": "2.1.2",
......@@ -3190,7 +3173,6 @@
"version": "1.0.2",
"bundled": true,
"dev": true,
"optional": true,
"requires": {
"code-point-at": "^1.0.0",
"is-fullwidth-code-point": "^1.0.0",
......@@ -3210,7 +3192,6 @@
"version": "3.0.1",
"bundled": true,
"dev": true,
"optional": true,
"requires": {
"ansi-regex": "^2.0.0"
}
......@@ -3254,14 +3235,12 @@
"wrappy": {
"version": "1.0.2",
"bundled": true,
"dev": true,
"optional": true
"dev": true
},
"yallist": {
"version": "3.1.1",
"bundled": true,
"dev": true,
"optional": true
"dev": true
}
}
},
......@@ -3622,8 +3601,7 @@
"version": "2.16.3",
"resolved": "http://192.168.110.93:4873/hoek/-/hoek-2.16.3.tgz",
"integrity": "sha1-ILt0A9POo5jpHcRxCo/xuCdKJe0=",
"dev": true,
"optional": true
"dev": true
},
"home-or-tmp": {
"version": "2.0.0",
......@@ -8079,6 +8057,12 @@
"resolved": "http://192.168.110.93:4873/throttle-debounce/-/throttle-debounce-1.1.0.tgz",
"integrity": "sha512-XH8UiPCQcWNuk2LYePibW/4qL97+ZQ1AN3FNXwZRBNPPowo/NRU5fAlDCSNBJIYCKbioZfuYtMhG4quqoJhVzg=="
},
"tim-js-sdk": {
"version": "2.10.1",
"resolved": "http://192.168.110.93:4873/tim-js-sdk/-/tim-js-sdk-2.10.1.tgz",
"integrity": "sha1-ZJRyjqdXXRJAE1o7oPPZsLYXRTE=",
"dev": true
},
"time-stamp": {
"version": "2.2.0",
"resolved": "http://192.168.110.93:4873/time-stamp/-/time-stamp-2.2.0.tgz",
......@@ -8187,6 +8171,12 @@
"integrity": "sha1-yy4SAwZ+DI3h9hQJS5/kVwTqYAM=",
"dev": true
},
"trtc-js-sdk": {
"version": "4.9.0",
"resolved": "http://192.168.110.93:4873/trtc-js-sdk/-/trtc-js-sdk-4.9.0.tgz",
"integrity": "sha1-A/Gy957d/zaSBX1+/Sc+6hCyvs8=",
"dev": true
},
"true-case-path": {
"version": "1.0.3",
"resolved": "http://192.168.110.93:4873/true-case-path/-/true-case-path-1.0.3.tgz",
......
<template>
<div class="diog-wrap" @click.stop="cancle" v-if="show">
<div class="diog-box">
<div class="diog-main" @click.stop="">
<div class="diog-message">
<div class="diog-left">
<img :src="warningImg" alt="" srcset="">
</div>
<div class="diog-right">
<p class="title">{{title}}</p>
</div>
</div>
<div class="btn">
<div @click.stop="confirm" class="confirm-btn">{{confirmTxt}}</div>
<div @click.stop="cancle" class="cancle-btn" v-if="cancleTxt">{{cancleTxt}}</div>
</div>
</div>
</div>
</div>
</template>
<script>
export default {
data() {
return {
warningImg: require('@/assets/image/live/warning.png'),
show: false,
title: '',
confirmTxt: '确定',
cancleTxt: '',
_promise: null
}
},
created() {},
methods: {
reset() {
this.title = ''
this.confirmTxt = '确定'
this.cancleTxt = ''
this._promise = null
},
init(obj={}) {
Object.assign(this,obj)
this.show = true
return new Promise((resolve,reject) => {
this._promise = {
resolve,
reject
};
})
},
async cancle() {
this.show = false
await this._promise.reject && this._promise.reject()
this.reset()
},
async confirm() {
this.show = false
await this._promise.resolve && this._promise.resolve()
this.reset()
},
hide() {
this.show = false
this.reset()
}
}
}
</script>
<style lang="scss" scoped>
.diog-wrap {
position: fixed;
top: 0;
right: 0;
left: 0;
bottom: 0;
z-index: 3000;
.diog-box {
position: absolute;
top: 64px;
right: 0;
left: 255px;
bottom: 0;
display: flex;
align-items: center;
justify-content: center;
background: rgba(0,0,0,0.6);
.diog-main {
width:480px;
padding: 34px 32px 24px 34px;
box-sizing: border-box;
background:rgba(31,31,31,1);
box-shadow:0px 12px 48px 16px rgba(0,0,0,0.12),0px 9px 28px 0px rgba(0,0,0,0.2),0px 6px 16px -8px rgba(0,0,0,0.32);
border-radius:2px;
.diog-message {
display: flex;
.diog-left {
height: 21px;
width: 21px;
margin-right: 17px;
}
.diog-right {
.title {
font-size:16px;
font-family:PingFangSC-Medium,PingFang SC;
font-weight:500;
color:rgba(255,255,255,0.85);
line-height:24px;
}
}
}
.btn {
margin-top: 24px;
display: flex;
flex-direction: row-reverse;
.confirm-btn {
margin-left: 12px;
padding: 0 16px;
height:32px;
background:rgba(47,134,246,1);
border-radius:2px;
font-size:14px;
font-family:PingFangSC-Regular,PingFang SC;
font-weight:400;
color:rgba(255,255,255,1);
line-height:32px;
text-align: center;
cursor: pointer;
}
.cancle-btn {
width:60px;
height:32px;
border-radius:2px;
border:1px solid rgba(255,255,255,0.2);
font-size:14px;
font-family:PingFangSC-Regular,PingFang SC;
font-weight:400;
color:rgba(255,255,255,0.65);
line-height:32px;
text-align: center;
cursor: pointer;
}
}
}
}
}
</style>
......@@ -13,6 +13,8 @@ import vViewer from 'v-viewer';
import 'viewerjs/dist/viewer.css';
import ClipboardJS from 'clipboard';
import '@/utils/directive';
import TRTC from 'trtc-js-sdk';
import TIM from 'tim-js-sdk';
Vue.prototype.ClipboardJS = ClipboardJS;
Vue.use(vViewer, {
......@@ -47,6 +49,11 @@ const router = new VueRouter({
}
})
Vue.use(TRTC)
window.TRTC = TRTC
Vue.use(TIM)
window.TIM = TIM
// 加入混合
Vue.mixin({
...mixins
......
export const IM_MESSAGE = {
PLEASE_ACTION: 100, // 请求连麦-------------------------------------------------------------嘉宾
CALL_ACTION: 101, // 连麦通知
CALL_ACCEPT: 1, // 主播同意嘉宾连麦----------------------------------------------------------主播
CALL_REFUSE: 0, // 主播拒绝嘉宾连麦----------------------------------------------------------主播
DOWN_ACTIONL: 102, //下麦通知
DOWN_COMMAND: 102, //让嘉宾下麦-------------------------------------------------------------主播
CUSTOM_ACTION: 301, //自定义通知
CUSTOM_COMMAND_MC: 333, //自己下麦----------------------------------------------------------嘉宾
CUSTOM_COMMAND_IN: 666, // 自已在房间-------------------------------------------------------嘉宾
CUSTOM_COMMAND_OUT: 999, // 离开房间--------------------------------------------------------嘉宾
CUSTOM_COMMAND_ON: 777, //上课--------------------------------------------------------------主播
CUSTOM_COMMAND_DOWN: 888, //下课------------------------------------------------------------主播
CUSTOM_COMMAND_DOWN_MC: 852, //关闭麦克风----------------------------------------------------主播
CUSTOM_COMMAND_DOWN_V: 851, // 关闭摄像头 ---------------------------------------------------主播
CUSTOM_COMMAND_HERE: 123, //嘉宾还在不在-----------------------------------------------------主播
CUSTOM_COMMAND_YES: 321, //嘉宾还在----------------------------------------------------------嘉宾
CUSTOM_COMMAND_INVITE: 741, //邀请嘉宾连麦----------------------------------------------------主播
CUSTOM_COMMAND_INVITE_OK: 742, //嘉宾同意连麦-------------------------------------------------嘉宾
CUSTOM_COMMAND_INVITE_NO: 743, //嘉宾拒绝连麦-------------------------------------------------嘉宾
CUSTOM_COMMAND_INVITE_EMPTY: 745, //主播告诉嘉宾有空位置--------------------------------------主播
CUSTOM_COMMAND_SPEAKER_ON: 201, //主播设置嘉宾为主讲--------------------------------------------主播
CUSTOM_COMMAND_SPEAKER_DOWN: 202, //主播取消嘉主讲----------------------------------------------主播
}
// 主播发送的消息-------------------------------------------------
export const imAgreeCall = () => {
let data = { data: '{"version":"","action":' + IM_MESSAGE.CALL_ACTION + ',"accept":' + IM_MESSAGE.CALL_ACCEPT + ',"reason":"同意连麦"}', description: '', extension: '' }
return data
}
export const imRefuseCall = () => {
let data = { data: '{"version":"","action":' + IM_MESSAGE.CALL_ACTION + ',"accept":' + IM_MESSAGE.CALL_REFUSE + ',"reason":"拒绝连麦"}', description: '', extension: '' }
return data
}
export const imCallDown = (nick) => {
let data = { data: '{"version":"","action":' + IM_MESSAGE.DOWN_ACTIONL + ', "command":"' + IM_MESSAGE.DOWN_COMMAND + '", "accept":0,"message":"' + nick + '","reason":"下麦"}', description: '', extension: '' }
return data
}
export const imMcDown = (nick) => {
let data = { data: '{"version":"","action":' + IM_MESSAGE.CUSTOM_ACTION + ',"command": "' + IM_MESSAGE.CUSTOM_COMMAND_DOWN_MC + '","accept":0,"message":"' + nick + '","reason":"主播关闭了您的麦克风"}', description: '', extension: '' }
return data
}
export const imVDown = (nick) => {
let data = { data: '{"version":"","action":' + IM_MESSAGE.CUSTOM_ACTION + ',"command": "' + IM_MESSAGE.CUSTOM_COMMAND_DOWN_V + '","accept":0,"message":"' + nick + '","reason":"主播关闭了您的摄像头"}', description: '', extension: '' }
return data
}
export const imClassOn = () => {
let data = { data: '{"version":"","action":' + IM_MESSAGE.CUSTOM_ACTION + ', "command":"' + IM_MESSAGE.CUSTOM_COMMAND_ON + '","accept":0,"reason":"上课啦","message":""}', description: '', extension: '' }
return data
}
export const imClassDown = () => {
let data = { data: '{"version":"","action":' + IM_MESSAGE.CUSTOM_ACTION + ', "command":"' + IM_MESSAGE.CUSTOM_COMMAND_DOWN + '","accept":0,"reason":"下课啦","message":""}', description: '', extension: '' }
return data
}
export const imJbHere= () => {
let data = { data: '{"version":"","action":' + IM_MESSAGE.CUSTOM_ACTION + ', "command":"' + IM_MESSAGE.CUSTOM_COMMAND_HERE + '","accept":0,"reason":"在么?","message":""}', description: '', extension: '' }
return data
}
export const imInviteCall = (nick) => {
let data = { data: '{"version":"","action":' + IM_MESSAGE.CUSTOM_ACTION + ', "command":"' + IM_MESSAGE.CUSTOM_COMMAND_INVITE + '","accept":0,"reason":"主播请您连麦","message":"' + nick + '"}', description: '', extension: '' }
return data
}
export const imInviteEmpty= (nick,replaceId) => {
let data = { data: '{"version":"","action":' + IM_MESSAGE.CUSTOM_ACTION + ', "command":"' + IM_MESSAGE.CUSTOM_COMMAND_INVITE_EMPTY + '","accept":0,"reason":"有空位置了,可以连麦了","replaceId":"' + replaceId + '","message":"' + nick + '"}', description: '', extension: '' }
return data
}
export const imSetSpeaker= (nick) => {
let data = { data: '{"version":"","action":' + IM_MESSAGE.CUSTOM_ACTION + ', "command":"' + IM_MESSAGE.CUSTOM_COMMAND_SPEAKER_ON + '","accept":0,"reason":"主播设置您为主讲人","message":"' + nick + '"}', description: '', extension: '' }
return data
}
export const imCancleSpeaker = (nick) => {
let data = { data: '{"version":"","action":' + IM_MESSAGE.CUSTOM_ACTION + ', "command":"' + IM_MESSAGE.CUSTOM_COMMAND_SPEAKER_DOWN + '","accept":0,"reason":"主播取消您的主讲人身份","message":"' + nick + '"}', description: '', extension: '' }
return data
}
// 嘉宾发的消息----------------------------------------------------------------------
export const imPleaseCall = () => {
let data = { data: '{"version":"","action":' + IM_MESSAGE.PLEASE_ACTION + ',"accept":1,"reason":"申请连麦"}', description: '', extension: '' }
return data
}
export const imInhome = (nick, callStatus, pendCalling, faceUrl, loadingTime, isSpeaker) => {
let data = { data: '{"version":"","action":' + IM_MESSAGE.CUSTOM_ACTION + ',"command":"' + IM_MESSAGE.CUSTOM_COMMAND_IN + '","accept":1,"reason":"我已经在房间了" ,"message":"' + nick + '","callStatus":"' + callStatus + '","pendCalling":"' + pendCalling + '","isSpeaker":"' + isSpeaker + '","loadingTime":"' + loadingTime + '","faceUrl":"' + faceUrl + '"}', description: '', extension: '' }
return data
}
export const imMcDownSelf = () => {
let data = { data: '{"version":"","action":' + IM_MESSAGE.CUSTOM_ACTION + ', "command":"' + IM_MESSAGE.CUSTOM_COMMAND_MC + '","accept":0,"reason":"我下麦了","message":""}', description: '', extension: '' }
return data
}
export const imJbYes = () => {
let data = { data: '{"version":"","action":' + IM_MESSAGE.CUSTOM_ACTION + ', "command":"' + IM_MESSAGE.CUSTOM_COMMAND_YES + '","accept":0,"reason":"在的","message":""}', description: '', extension: '' }
return data
}
export const imInviteOk = (nick) => {
let data = { data: '{"version":"","action":' + IM_MESSAGE.CUSTOM_ACTION + ', "command":"' + IM_MESSAGE.CUSTOM_COMMAND_INVITE_OK + '","accept":0,"reason":"嘉宾接受主播连麦请求","message":"' + nick + '"}', description: '', extension: '' }
return data
}
export const imInviteNo = (nick) => {
let data = { data: '{"version":"","action":' + IM_MESSAGE.CUSTOM_ACTION + ', "command":"' + IM_MESSAGE.CUSTOM_COMMAND_INVITE_NO + '","accept":0,"reason":"嘉宾拒绝主播连麦请求","message":"' + nick + '"}', description: '', extension: '' }
return data
}
\ No newline at end of file
此差异已折叠。
/* 浏览器兼容提示 */
export const CHECK_BROWSER_TIPS = {
BROWSER_NOT_COMPATIBLE: '您的浏览器不支持直播功能!',
BROWSER_NOT_SUPPORT_SCREEN_SHARE: '您的浏览器不支持直播功能!'
};
export const setLgTenText = time => {
return time < 10 ? `0${time}` : time;
}
export const getLiveTimeText = (lt, name) => {
let hr = parseInt(lt / 1000 / 60 / 60); // 時
let min = parseInt((lt - hr * 1000 * 60 * 60) / 1000 / 60); // 分 ex: 90秒
let sec = parseInt((lt - min * 1000 * 60 - hr * 1000 * 60 * 60) / 1000); // 秒
sessionStorage.setItem(`TIME_${name}`, lt);
return `${setLgTenText(hr)}:${setLgTenText(min)}:${setLgTenText(sec)}`;
}
export const countDown = (endtime) => {
let nowtime = new Date(); //获取当前时间
let time = endtime- nowtime.getTime(); //距离结束时间的毫秒数
if (time > 0) {
let lefth = Math.floor(time / (1000 * 60 * 60) % 24); //计算小时数
let leftm = Math.floor(time / (1000 * 60) % 60); //计算分钟数
let lefts = Math.floor(time / 1000 % 60); //计算秒数
//返回倒计时的字符串
return `${setLgTenText(lefth)}:${setLgTenText(leftm)}:${setLgTenText(lefts)}`;
} else {
return '时间已到'
}
}
function listCompare(property, way) {
return function (obj1, obj2) {
var value1 = obj1[property];
var value2 = obj2[property];
return way ? value1 - value2 : value2 - value1; // 升序
}
}
// 参数为条件(如先排角色,后是通话中)
export const listSort = (one, two, three, four, arr) => {
let newList = [] // 新的列表
let callArr = [] // 正在通话的列表
let inviteArr = [] // 邀请中的列表
arr = JSON.parse(JSON.stringify(arr));
let h = arr.sort(listCompare(four))
let a = h.sort(listCompare(three))
let b = a.sort(listCompare(two))
newList = b.sort(listCompare(one, 1))
newList.forEach(item => {
if (item.isCalling) {
callArr.push(item)
}
if (item.inviteCall) {
inviteArr.push(item)
}
});
return {
newList,
callArr,
inviteArr
}
}
export const isWeixin = () => {
let ua = navigator.userAgent.toLowerCase();
return ua.indexOf('micromessenger') != -1
}
export const getBroswer = () => {
let sys = {};
let ua = navigator.userAgent.toLowerCase();
let s;
(s = ua.match(/edge\/([\d.]+)/)) ? sys.edge = s[1] :
(s = ua.match(/rv:([\d.]+)\) like gecko/)) ? sys.ie = s[1] :
(s = ua.match(/msie ([\d.]+)/)) ? sys.ie = s[1] :
(s = ua.match(/firefox\/([\d.]+)/)) ? sys.firefox = s[1] :
(s = ua.match(/chrome\/([\d.]+)/)) ? sys.chrome = s[1] :
(s = ua.match(/opera.([\d.]+)/)) ? sys.opera = s[1] :
(s = ua.match(/version\/([\d.]+).*safari/)) ? sys.safari = s[1] : 0;
if (sys.edge) return { broswer: "Edge", version: sys.edge };
if (sys.ie) return { broswer: "IE", version: sys.ie };
if (sys.firefox) return { broswer: "Firefox", version: sys.firefox };
if (sys.chrome) return { broswer: "Chrome", version: sys.chrome };
if (sys.opera) return { broswer: "Opera", version: sys.opera };
if (sys.safari) return { broswer: "Safari", version: sys.safari };
return { broswer: "", version: "0" };
}
\ No newline at end of file
import WebIMObj from '@/utils/live/WebIM.js'
module.exports = {
data() {
return {
}
},
created() {
},
methods: {
// 初始化Im
initIM() {
this.WebIM = new WebIMObj({roomId: this.roomId})
this.WebIM.init(this.sdkAppId)
this.WebIM.tim.on(TIM.EVENT.SDK_READY, this.onTimSdkReady)
this.WebIM.tim.on(TIM.EVENT.SDK_NOT_READY, this.onTimSdkNotReady)
this.IMlogin()
},
// TIM SDK 准备完成 注意:这时需要将vue实例传入
onTimSdkReady() {
this.IMJion();
console.log('TIM SDK 准备完成')
// this.createRoom();
// 将vue实例传入,方便消息回调
this.WebIM.addEvent(this)
},
// SDK 准备失败
onTimSdkNotReady(event) {
console.log('TIM SDK 准备失败 => ', event)
},
// Im登录
IMlogin() {
this.WebIM.login({
userId: this.userId,
userSig: this.userSig
}).then(() => {
// this.IMJion();
}, error => {
console.log('抱歉登录失败')
})
},
// WebIM创建聊天房间
createRoom() {
this.WebIM.createRoom(this.roomId).then(() => {
// 创建课堂-end
console.log('创建room成功')
this.IMJion()
}, error => {
console.log('创建room失败')
this.IMJion()
})
},
// WebIM加入房间
IMJion() {
this.WebIM.joinRoom(this.roomId).then(res => {
this.addFriends(this.nickShow)
this.joined = true
this.WebIM.updateMyProfile({
nick: this.nick,
avatar: this.faceUrl
}).then(() => {
console.log('im 个人信息更新成功');
}).catch((errr) => {
console.log('更新资料失败', err)
})
}).catch((err) => {
console.log('加入房间失败', err)
})
},
// 退出
leaveIm() {
vm.WebIM.quitGroup(vm.roomId)
},
//所有消息
onRecvMessage(msg) {
},
// 被踢出房间
onClassroomDestroy() {
},
// WebIm退出
quitClassroom() {
vm.WebIM.quitGroup().then(() => {
}).catch((error) => {
})
},
//销毁WebIm
destroyClassroom(classId, callback) {
vm.WebIM.destroyGroup(classId).then(data => {
// vm.ticWebRTC && vm.ticWebRTC.quit()
}).catch(error => {
})
},
}
}
\ No newline at end of file
此差异已折叠。
class ShareClient {
constructor(options) {
this.sdkAppId_ = options.sdkAppId;
this.userId_ = options.userId;
this.userSig_ = options.userSig;
this.roomId_ = options.roomId;
this.vueInstance = options.vueInstance;; //vue实例
this.isJoined_ = false;
this.isPublished_ = false;
this.localStream_ = null;
this.client_ = TRTC.createClient({
mode: 'live',
sdkAppId: this.sdkAppId_,
userId: this.userId_,
userSig: this.userSig_
});
//设置是否默认接收远端流。该方法可在 join() 调用前使用,若在进房后调用,会接收不到后续进房的远端用户音视频流。
this.client_.setDefaultMuteRemoteStreams(true);
this.handleEvents();
}
async join() {
// 如果已经加入时报错
if (this.isJoined_) {
// alert('共享失败,请稍后重试');
this.vueInstance.$message({
message: '共享失败,请稍后重试!',
type: 'error'
});
return;
}
try {
await this.client_.join({
roomId: this.roomId_
});
console.log('共享房间进入成功');
this.isJoined_ = true;
// 进入房间就创建共享本地流
this.localStream_ = TRTC.createStream({
// disable audio as RtcClient already enable audio
audio: false,
// enable screen share
screen: true,
userId: this.userId_,
});
// 设置视频分辨率等参数
this.localStream_.setScreenProfile({
width: this.vueInstance.viedoParams.screenProfileWidth,
height: this.vueInstance.viedoParams.screenProfileHeight,
frameRate: this.vueInstance.viedoParams.screenProfileFramerate,
bitrate: this.vueInstance.viedoParams.screenProfileBitrate /* kbps */
});
await this.publish()
return Promise.resolve();
} catch (e) {
console.error('ShareClient join room failed! ' + e);
}
}
// 发布本地流
async publish() {
if (!this.isJoined_) {
console.warn('共享屏幕请加入房间');
return;
}
if (this.isPublished_) {
console.warn('共享屏幕已经发布');
return;
}
try {
await this.stopPush()
try {
await this.localStream_.initialize()
} catch (error) {
throw new Error(error)
}
if (!this.vueInstance.canshare) {
this.vueInstance.$message({
message: '您当前不是主讲人,无屏幕分享权限!',
type: 'error'
});
this.leave();
return
}
// 监听播放状态 'PLAYING':开始播放 'PAUSED':暂停播放
this.localStream_.on('player-state-changed', event => {
console.log(`local stream ${event.type} player is ${event.state}`);
});
// // 监听屏幕分享结束
this.localStream_.on('screen-sharing-stopped', event => {
console.log('共享结束');
this.leave();
});
this.isPublished_ = true;
//创建共享屏幕div
var localVideoWrapEl = document.getElementById('share_video');
if (!localVideoWrapEl) {
localVideoWrapEl = document.createElement('div');
localVideoWrapEl.id = 'share_video';
document.querySelector("#paint_box").insertBefore(localVideoWrapEl, null);
}
if (localVideoWrapEl) {
// 本地流播放
await this.localStream_.play(localVideoWrapEl, {
muted: true,
objectFit: 'contain'
});
await this.client_.publish(this.localStream_);
this.showShare()
}
} catch (e) {
console.log('用户取消');
this.leave();
}
}
/**
* 结束推流
*/
async stopPush() {
if (this.localStream_ && this.isPublished_ && this.isJoined_) {
await this.client_.unpublish(this.localStream_);
this.isPublished_ = false;
if (document.getElementById('share_video')) {
document.getElementById('share_video').remove();
}
this.localStream_.close();
}
}
// 退出
async leave() {
if (!this.isJoined_) {
console.warn('leave() - please join() firstly');
return;
}
// 如果是正在发布流,就先停止流
if (this.isPublished_) {
await this.client_.unpublish(this.localStream_);
this.isPublished_ = false;
}
await this.client_.leave();
if (this.localStream_) {
this.localStream_.close();
this.localStream_ = null;
}
this.isShare = false;
this.isJoined_ = false;
this.hideShare()
}
handleEvents() {
this.client_.on('error', err => {
console.error(err);
this.leave();
// alert(err);
});
this.client_.on('client-banned', err => {
this.leave();
console.error('client has been banned for ' + err);
});
// 嘉宾加入房间时触发
this.client_.on('peer-join', evt => {
const userId = evt.userId;
console.log('嘉宾加入房间时触发 ' + userId);
});
// 嘉宾离开房间时触发
this.client_.on('peer-leave', evt => {
const userId = evt.userId;
console.log('嘉宾离开房间时触发' + userId);
});
// 在添加远程流时触发
this.client_.on('stream-added', evt => {
const remoteStream = evt.stream;
const id = remoteStream.getId();
const userId = remoteStream.getUserId();
console.log(`remote stream added: [${userId}] ID: ${id} type: ${remoteStream.getType()}`);
console.log(' 在添加远程流时触发');
});
// 在订阅远程流时触发
this.client_.on('stream-subscribed', evt => {
const uid = evt.userId;
const remoteStream = evt.stream;
const id = remoteStream.getId();
remoteStream.on('player-state-changed', event => {
console.log(`${event.type} player is ${event.state}`);
});
console.log('在订阅远程流时触发');
});
// 当远程流被移除时触发, e.g. the remote user called Client.unpublish()
this.client_.on('stream-removed', evt => {
const remoteStream = evt.stream;
const id = remoteStream.getId();
console.log(`stream-removed ID: ${id} type: ${remoteStream.getType()}`);
console.log('当远程流被移除时触发');
});
// 当远程流被更新时触发
this.client_.on('stream-updated', evt => {
const remoteStream = evt.stream;
console.log('当远程流被更新时触发');
});
this.client_.on('mute-audio', evt => {
console.log(evt.userId + ' mute audio');
});
this.client_.on('unmute-audio', evt => {
console.log(evt.userId + ' unmute audio');
});
this.client_.on('mute-video', evt => {
console.log(evt.userId + ' mute video');
});
this.client_.on('unmute-video', evt => {
console.log(evt.userId + ' unmute video');
});
}
// 显示分享屏幕div
showShare() {
if (this.vueInstance) {
this.vueInstance.isShare = true;
}
}
// 隐藏分享屏幕div
hideShare() {
if (this.vueInstance) {
this.vueInstance.isShare = false;
}
}
}
export default ShareClient
\ No newline at end of file
......@@ -82,7 +82,7 @@ export default {
JSON.stringify(vueMenuDtos)
);
// 做当前路由无权限时处理
//this.checkAuth(this.$route.path.split("/")[1], vueMenuDtos);
// this.checkAuth(this.$route.path.split("/")[1], vueMenuDtos);
}
});
},
......
Markdown 格式
0% or
您添加了 0 到此讨论。请谨慎行事。
先完成此消息的编辑!
想要评论请 注册