本demo是基于腾讯云calling小程序修改了相关逻辑来实现全局监听,在收到邀请信令后跳转到指定页面(该页面注册了TUICalling组件)进行组件初始化,使用前建议先了解官网demo的相关文档,这里就不多做说明,如果觉得这篇文章对你有帮助麻烦点个赞!
全局监听效果展示
基于calling组件的修改说明
全局监听的实现思路就是在原有calling组件的基础上将信令放到了app.js文件,并在appLaunch实现邀请信令的监听,监听到邀请事件后处理邀请事件,并且把需要的参数设置为globalData方便取的时候获取,然后跳转页面初始化组件处理邀请事件,此外由于邀请没有走TRTCDelegate,所以挂断事件也是用信令单独处理的,由于时间比较催促,所以本demo仅提供思路和参考
思维导图
修改点部分代码
import TSignaling from './components/TUICalling/TRTCCalling/node\_module/tsignaling-wx'
import TSignalingClient from './components/TUICalling/TRTCCalling/TSignalingClient'
import TIM from './components/TUICalling/TRTCCalling/node\_module/tim-wx-sdk'
import { CALL\_STATUS } from './components/TUICalling/TRTCCalling/common/constants'
userInfo: null,
headerHeight: 0,
statusBarHeight: 0,
sdkAppID: Signature.sdkAppID,
userID: '',
userSig: '',
token: '',
expiresIn: '',
phone: '',
sessionID: '',
callStatus: CALL\_STATUS.IDLE, // 用户当前的通话状态
callType: 1,
callEvent: null,
inviteId: '',
inviteID: '',
inviter: '',
roomID: '',
isSponsor: false,
\_connectUserIDList: [],
\_isGroupCall: false,
\_groupID: '',
\_unHandledInviteeList: [],
inviteData: null,
inviteeList: []
wx.$TIM = TIM.create({SDKAppID: Signature.sdkAppID})
wx.$TSignaling = new TSignaling({SDKAppID: Signature.sdkAppID, tim: wx.$TIM})
wx.TSignalingClient = new TSignalingClient({ TSignaling: wx.$TSignaling })
// 新的邀请回调事件
wx.$TSignaling.on(TSignaling.EVENT.NEW\_INVITATION\_RECEIVED, this.handleNewInvitationReceived, this);
// SDK Ready 回调
wx.$TSignaling.on(TSignaling.EVENT.SDK\_READY, this.handleSDKReady, this);
// 被踢下线
wx.$TSignaling.on(TSignaling.EVENT.KICKED\_OUT, this.handleKickedOut, this);
handleNewInvitationReceived(event) {
console.log(TAG\_NAME, 'onNewInvitationReceived', event);
const { data: { inviter, inviteeList, data, inviteID, groupID } } = event
const inviteData = JSON.parse(data)
wx.$globalData.inviteData = inviteData
wx.$globalData.inviteeList = inviteeList
// 此处判断inviteeList.length 大于2,用于在非群组下多人通话判断
// userIDs 为同步 native 在使用无 groupID 群聊时的判断依据
const isGroupCall = groupID || inviteeList.length >= 2 || inviteData.data && inviteData.data.userIDs && inviteData.data.userIDs.length >= 2 ? true : false
let callEnd = false
// 此处逻辑用于通话结束时发出的invite信令
// 群通话已结束时,room\_id 不存在或者 call\_end 为 0
if (isGroupCall && (!inviteData.room\_id || (inviteData.call\_end && inviteData.call\_end === 0))) {
callEnd = true
}
// 1v1通话挂断时,通知对端的通话结束和通话时长
if (!isGroupCall && inviteData.call\_end >= 0) {
callEnd = true
}
if(callEnd) {
return
}
if(wx.$globalData.callStatus === CALL\_STATUS.CALLING || wx.$globalData.callStatus === CALL\_STATUS.CONNECTED) {
wx.$TSignaling.reject({ inviteID, type: data.call\_type, lineBusy: 'line\_busy' })
return
}
const callInfo = {
\_isGroupCall: !!isGroupCall,
\_groupID: groupID || '',
\_unHandledInviteeList: [...inviteeList, inviter],
}
if (isGroupCall && !groupID) {
callInfo.\_unHandledInviteeList = [...inviteData.data.userIDs]
}
wx.$globalData.callStatus = CALL\_STATUS.CALLING
wx.$globalData.callType = inviteData.call\_type
wx.$globalData.inviteID = inviteID
wx.$globalData.inviter= inviter
wx.$globalData.roomID = inviteData.room\_id
wx.$globalData.isSponsor = false
wx.$globalData.\_connectUserIDList = [inviter]
wx.$globalData.\_isGroupCall = callInfo.\_isGroupCall
wx.$globalData.\_groupID = callInfo.\_groupID
wx.$globalData.\_unHandledInviteeList = callInfo.\_unHandledInviteeList
wx.$globalData.callEvent = event
wx.navigateTo({
url: '/pages/calling/calling', // 需要跳转的页面
})
}
<TUICalling
id="TUICalling-component"
config="{{config}}"
></TUICalling>
const config = {
sdkAppID: wx.$globalData.sdkAppID,
userID: wx.$globalData.userID,
userSig: wx.$globalData.userSig
}
this.setData({
config: { ...this.data.config, ...config },
}, () => {
this.TUICalling = this.selectComponent('#TUICalling-component')
this.TUICalling.init()
wx.$globalData.callStatus === CALL\_STATUS.CALLING && this.TUICalling.handleNewInvitationReceived(wx.$globalData.callEvent)
})
// 新的邀请回调事件
handleNewInvitationReceived(event) {
console.log(`${TAG\_NAME}, handleNewInvitationReceived`, event)
this.data.config.type = wx.$globalData.callType
this.getUserProfile([event.data.inviter || event.data.sponsor])
this.setData({
config: this.data.config,
callStatus: 'calling',
isSponsor: false,
})
}
/\*\*
\* 当您作为被邀请方收到的回调时,可以调用该函数拒绝来电
\*/
async reject() {
console.log(`${TAG\_NAME}, reject`)
const inviteID = wx.$globalData.inviteID
const data = wx.$globalData.callEvent.data
wx.$TSignaling.reject({
inviteID,
data: JSON.stringify(data)
}).then(res => {
this.triggerEvent('sendMessage', {
message: res.data.message,
})
})
原创声明:本文系作者授权腾讯云开发者社区发表,未经许可,不得转载。
如有侵权,请联系 cloudcommunity@tencent.com 删除。
原创声明:本文系作者授权腾讯云开发者社区发表,未经许可,不得转载。
如有侵权,请联系 cloudcommunity@tencent.com 删除。