有奖捉虫:办公协同&微信生态&物联网文档专题 HOT
本文档主要介绍如何进入 TRTC 房间中,只有在进入音视频房间后,用户才能订阅房间中其他用户的音视频流,或者向房间中的其他用户发布自己的音视频流。


说明:
自2023年02月15日起,如需使用微信小程序 SDK 音视频通话和互动直播,需开通订阅TRTC 包月套餐以解锁小程序 SDK 能力,详见包月套餐功能与计费说明
2023年02月15日前创建过 TRTC 应用的腾讯云账号下的所有应用(SdkAppId),作为缓冲期可免费使用微信小程序 SDK 能力至2023年04月01日。

步骤1:初始化 TRTC 实例

// 生命周期函数--监听页面加载
onLoad(options) {
this.TRTC = new TRTC(this)
},

步骤2:绑定事件回调

参见 事件表
<live-pusher
bindstatechange="_pusherStateChangeHandler"
bindnetstatus="_pusherNetStatusHandler"
binderror="_pusherErrorHandler"
bindbgmstart="_pusherBGMStartHandler"
bindbgmprogress="_pusherBGMProgressHandler"
bindbgmcomplete="_pusherBGMCompleteHandler"
bindaudiovolumenotify="_pusherAudioVolumeNotify"
/>
// 生命周期函数--监听页面加载
onLoad(options) {
this.TRTC = new TRTC(this)
this.bindTRTCRoomEvent()
},
// 事件监听
bindTRTCRoomEvent() {
const TRTC_EVENT = this.TRTC.EVENT
// 初始化事件订阅
this.TRTC.on(TRTC_EVENT.LOCAL_JOIN, (event) => {
console.log('* room LOCAL_JOIN', event)
})
this.TRTC.on(TRTC_EVENT.LOCAL_LEAVE, (event) => {
console.log('* room LOCAL_LEAVE', event)
})
this.TRTC.on(TRTC_EVENT.ERROR, (event) => {
console.log('* room ERROR', event)
})
// 远端用户加入
this.TRTC.on(TRTC_EVENT.REMOTE_USER_JOIN, (event) => {
console.error('* room REMOTE_USER_JOIN', event)
})
// 远端用户退出
this.TRTC.on(TRTC_EVENT.REMOTE_USER_LEAVE, (event) => {
console.error('* room REMOTE_USER_LEAVE', event)
})
// 远端用户推送视频
this.TRTC.on(TRTC_EVENT.REMOTE_VIDEO_ADD, (event) => {
console.log('* room REMOTE_VIDEO_ADD', event)
})
// 远端用户取消推送视频
this.TRTC.on(TRTC_EVENT.REMOTE_VIDEO_REMOVE, (event) => {
console.log('* room REMOTE_VIDEO_REMOVE', event)
})
// 远端用户推送音频
this.TRTC.on(TRTC_EVENT.REMOTE_AUDIO_ADD, (event) => {
console.log('* room REMOTE_AUDIO_ADD', event)
})
// 远端用户取消推送音频
this.TRTC.on(TRTC_EVENT.REMOTE_AUDIO_REMOVE, (event) => {
console.log('* room REMOTE_AUDIO_REMOVE', event)
})
// 远端用户音量更新
this.TRTC.on(TRTC_EVENT.REMOTE_AUDIO_VOLUME_UPDATE, (event) => {
console.log('* room REMOTE_AUDIO_VOLUME_UPDATE', event)
})
// 本地用户音量更新
this.TRTC.on(TRTC_EVENT.LOCAL_AUDIO_VOLUME_UPDATE, (event) => {
console.log('* room LOCAL_AUDIO_VOLUME_UPDATE', event)
})
},
// 请保持跟 wxml 中绑定的事件名称一致
_pusherStateChangeHandler(event) {
this.TRTC.pusherEventHandler(event)
},
_pusherNetStatusHandler(event) {
this.TRTC.pusherNetStatusHandler(event)
},
_pusherErrorHandler(event) {
this.TRTC.pusherErrorHandler(event)
},
_pusherBGMStartHandler(event) {
this.TRTC.pusherBGMStartHandler(event)
},
_pusherBGMProgressHandler(event) {
this.TRTC.pusherBGMProgressHandler(event)
},
_pusherBGMCompleteHandler(event) {
this.TRTC.pusherBGMCompleteHandler(event)
},
_pusherAudioVolumeNotify(event) {
this.TRTC.pusherAudioVolumeNotify(event)
},
_playerStateChange(event) {
this.TRTC.playerEventHandler(event)
},
_playerFullscreenChange(event) {
this.TRTC.playerFullscreenChange(event)
},
_playerNetStatus(event) {
this.TRTC.playerNetStatus(event)
},
_playerAudioVolumeNotify(event) {
this.TRTC.playerAudioVolumeNotify(event)
}

步骤3:进入音视频通话房间

需要先调用 createpusher 初始化 pusher 实例并配置初始参数,再调用 enterroom 获取新的 pusher 实例,通过 setData 赋值给 live-pusher 标签,之后调用 start 开始进入音视频通话房间。
注意:
进房成功后,将会产生音视频通话用量和对应费用,包括观众观看用量或若仅主播单人在房时的音频用量,详细计费请见 音视频通话计费说明
// 生命周期函数--监听页面加载
onLoad(options) {
this.TRTC = new TRTC(this)
this.bindTRTCRoomEvent()
this.init()
this.enterRoom(options)
},
init() {
const pusherConfig = {
beautyLevel: 9,
}
this.setData({
pusher: this.TRTC.createPusher(pusherConfig)
})
},
enterRoom(options) {
const { roomID, sdkAppID, userID, userSig } = options
this.setData({
pusher: this.TRTC.enterRoom({
roomID,
sdkAppID,
userID,
userSig,
}),
}, () => {
this.TRTC.getPusherInstance().start() // 开始推流并进入trtc房间
})
},
<live-pusher
url="{{pusher.url}}"
mode="{{pusher.mode}}"
enable-camera="{{pusher.enableCamera}}"
enable-mic="{{pusher.enableMic}}"
/>