Web
DingRTC的基本功能包含初始化SDK、加入頻道、本地發(fā)布、訂閱遠(yuǎn)端和離開頻道等。通過閱讀本文,您可以了解DingRTC的基本功能。
前提條件
您已下載并集成最新版本的SDK。具體操作,請參見如何在Web端集成音視頻通信SDK。
您已獲取加入頻道必需的頻道鑒權(quán)令牌(Token)。具體操作,請參見使用Token鑒權(quán)。
基本概念
您在接入DingRTC Web SDK時,會接觸到以下基礎(chǔ)概念:
DingRTCClient類,它的實例代表本地客戶端,其方法提供加入、離開房間,發(fā)布、訂閱音視頻流等功能;
LocalTrack類和RemoteTrack類,它們的實例以及以它們作為基類的其他類的實例代表一個音視頻對象,主要提供對音視頻流的播放、暫停等控制操作。
基本邏輯
調(diào)用createClient()方法創(chuàng)建一個客戶端實例;
調(diào)用join()進入一個RTC頻道;
發(fā)布本地音視頻軌道:
通過createCameraVideoTrack()創(chuàng)建一個攝像頭軌道或createMicrophoneAudioTrack()創(chuàng)建一個麥克風(fēng)軌道;
在加入頻道后把這些音視頻軌道對象作為參數(shù)來調(diào)用publish()來發(fā)布到頻道中;
訂閱遠(yuǎn)端音視頻軌道:
在加入頻道前監(jiān)聽"user-published"事件,可獲取到所有遠(yuǎn)端用戶的推流事件,其回調(diào)參數(shù)包含發(fā)布人的信息與音視頻軌道的類型;
從客戶端實例上的remoteUsers屬性上,可獲取所有在會中的遠(yuǎn)端用戶,可用來訂閱在加入頻道前已在頻道中發(fā)布的音視頻軌道;
調(diào)用subscribe()來訂閱遠(yuǎn)端用戶,并在訂閱成功后從接口返回或者遠(yuǎn)端用戶對象RemoteUser屬性上獲取遠(yuǎn)端音頻對象和視頻對象;
調(diào)用play()來實現(xiàn)遠(yuǎn)端音視頻軌道的播放;
操作步驟
本文中的實現(xiàn)方法僅供參考,您可以根據(jù)實際業(yè)務(wù)需求進行開發(fā)。
創(chuàng)建Client對象。
import DingRTC from 'dingrtc'; const client = DingRTC.createClient();
加入頻道。
await client.join({ appId: joinInfo.appId, token: joinInfo.appId, uid: joinInfo.uid, channel: joinInfo.channel, userName: joinInfo.userName, });
加入頻道所需信息:
屬性
類型
描述
appId
string
您在 DingRTC 項目的 AppId,僅支持大小寫字母、數(shù)字和下劃線。
channel
string
頻道 Id,字符內(nèi)容只允許[A-Za-z0-9_-],長度不超過64個字符。
token
string
頻道鑒權(quán)令牌
uid
string
標(biāo)識用戶的 Id,字符內(nèi)容只允許[A-Za-z0-9_-],長度不超過64個字符。
說明同一個用戶Id在其他端登錄,先入會的端會被后入會的端踢出頻道。
userName
string
用戶名稱,長度不超過UTF-8編碼64個字節(jié)。
發(fā)布或取消發(fā)布本地音視頻軌道。
創(chuàng)建本地音頻軌道和視頻軌道
// 攝像頭軌道 const cameraTrack = await DingRTC.createCameraVideoTrack({ frameRate: 15, dimension: 'VD_1280x720', }); // 麥克風(fēng)軌道 const micTrack = await DingRTC.createMicrophoneAudioTrack();
說明創(chuàng)建完成后可通過play方法進行本地預(yù)覽,例如:
cameraTrack.play('#local'); micTrack.play();
發(fā)布本地音頻軌道和視頻軌道
client.publish([cameraTrack, micTrack]);
取消發(fā)布本地音頻軌道和視頻軌道
client.unpublish([cameraTrack, micTrack]);
訂閱或取消訂閱遠(yuǎn)程流。
訂閱遠(yuǎn)端音視頻
請在加入房間前在Client對象上監(jiān)聽"user-published"事件,以確保不會錯過遠(yuǎn)端用戶發(fā)布音視頻軌道的通知,在此事件對應(yīng)的回調(diào)中可通過subscribe()來訂閱遠(yuǎn)端用戶的音視頻軌道;
client.on('user-published', (user, mediaType, auxiliary) => { client.subscribe(user.userId, mediaType, auxiliary).then((track) => { track.play(`#uid${user.userId}`); }); });
或者從客戶端實例上的remoteUsers屬性上,訂閱指定遠(yuǎn)端用戶發(fā)布的音視頻軌道;
for (const user of client.remoteUsers) { if (user.hasVideo) { client.subscribe(user.userId, 'video').then((track) => { track.play(`#uid${user.userId}`); }); } }
說明當(dāng)前還未支持指定到個人的音頻訂閱,請需要訂閱音頻時將userId 置為字符串'mcu',代表訂閱的是頻道內(nèi)遠(yuǎn)端用戶合流后的音頻。指定到個人的音頻訂閱將在近期支持。
取消訂閱遠(yuǎn)端音視頻
client.unsubscribe(user.userId, 'video'); // 取消訂閱用戶的視頻軌道 client.unsubscribe(user.userId, 'audio'); // 取消訂閱用戶的音頻軌道
說明當(dāng)前還未支持指定到個人的音頻訂閱,請需要取消訂閱音頻時將userId 置為字符串'mcu',代表取消訂閱的是頻道內(nèi)遠(yuǎn)端用戶合流后的音頻。指定到個人的音頻的取消訂閱將在近期支持。
訂閱不同規(guī)格視頻流
當(dāng)前訂閱視頻規(guī)格有high和low兩種,默認(rèn)為high,如果您需要修改指定用戶的訂閱視頻軌道為流暢模式,請調(diào)用以下接口:
client.setRemoteVideoStreamType(user.userId, 'low');
或者修改全局默認(rèn)訂閱視頻規(guī)格:
client.setRemoteDefaultVideoStreamType('low');
說明此接口作用于后續(xù)入會的遠(yuǎn)端用戶,對于調(diào)用此接口之前已經(jīng)入會的遠(yuǎn)端用戶,此接口不會產(chǎn)生影響。
離開頻道。
client.leave();
此接口作用于后續(xù)入會的遠(yuǎn)端用戶,對于調(diào)用此接口之前已經(jīng)入會的遠(yuǎn)端用戶,此接口不會產(chǎn)生影響。
后續(xù)步驟
您可以下載示例代碼,快速運行Demo,實現(xiàn)頻道內(nèi)和其他人進行實時音視頻通話,詳情請參見運行 Web Demo。