Web

操作步骤

1. 创建Client对象。

   import DingRTC from 'dingrtc';
   
   const client = DingRTC.createClient();

2. 加入频道。

   await client.join({
    	appId: joinInfo.appId,
    	token: joinInfo.token,
    	uid: joinInfo.uid,
    	channel: joinInfo.channel,
    	userName: joinInfo.userName,
   });

   加入频道所需信息:

   属性	类型	描述
   appId	string	您在 DingRTC 项目的 AppId，仅支持大小写字母、数字和下划线。
   channel	string	频道 Id，字符内容只允许[A-Za-z0-9_-]，长度不超过64个字符。
   token	string	频道鉴权令牌
   uid	string	标识用户的 Id，字符内容只允许[A-Za-z0-9_-]，长度不超过64个字符。 说明 同一个用户Id在其他端登录，先入会的端会被后入会的端踢出频道。
   userName	string	用户名称，长度不超过UTF-8编码64个字节。

3. 发布或取消发布本地音视频轨道。

   • 创建本地音频轨道和视频轨道

     // 摄像头轨道
     const cameraTrack = await DingRTC.createCameraVideoTrack({
       frameRate: 15,
       dimension: 'VD_1280x720',
     });
     // 麦克风轨道
     const micTrack = await DingRTC.createMicrophoneAudioTrack();

     说明

     创建完成后可通过play方法进行本地预览,例如：

     cameraTrack.play('#local');
     micTrack.play();

   • 发布本地音频轨道和视频轨道

     client.publish([cameraTrack, micTrack]);

   • 取消发布本地音频轨道和视频轨道

     client.unpublish([cameraTrack, micTrack]);

4. 订阅或取消订阅远程流。

   • 订阅远端音视频

     请在加入房间前在Client对象上监听"user-published"事件，以确保不会错过远端用户发布音视频轨道的通知，在此事件对应的回调中可通过subscribe()来订阅远端用户的音视频轨道；

     client.on('user-published', (user, mediaType, auxiliary) => {
       client.subscribe(user.userId, mediaType, auxiliary).then((track) => {
         track.play(`#uid${user.userId}`);
       });
     });

     或者从客户端实例上的remoteUsers属性上，订阅指定远端用户发布的音视频轨道；

     for (const user of client.remoteUsers) {
       if (user.hasVideo) {
         client.subscribe(user.userId, 'video').then((track) => {
           track.play(`#uid${user.userId}`);
         });
       }
       if (user.hasAudio && mcuNotSubscribed) {
         mcuNotSubscribed = true;
         client.subscribe('mcu', 'audio').then((track) => {
           track.play();
         });
       }
     }

     说明

     当前还未支持指定到个人的音频订阅，请需要订阅音频时将userId 置为字符串'mcu'，代表订阅的是频道内远端用户合流后的音频,音频合流全局只需订阅一次，当远端有新用户发布音频流时会自动合入已订阅的mc音频流内。

   • 取消订阅远端音视频

     client.unsubscribe(user.userId, 'video'); // 取消订阅用户的视频轨道
     client.unsubscribe('mcu', 'audio'); // 取消订阅远端音频合流的音频轨道

     说明

     当前还未支持指定到个人的音频订阅，请需要取消订阅音频时将userId 置为字符串'mcu'，代表取消订阅的是频道内远端用户合流后的音频，音频合流全局亦只需取消订阅一次。

   • 订阅不同规格视频流

     当前订阅视频规格有high和low两种，默认为high，如果您需要修改指定用户的订阅视频轨道为流畅模式，请调用以下接口：

     client.setRemoteVideoStreamType(user.userId, 'low');

     或者修改全局默认订阅视频规格：

     client.setRemoteDefaultVideoStreamType('low');

     说明

     1. 此接口作用于后续入会的远端用户，对于调用此接口之前已经入会的远端用户，此接口不会产生影响;

     2. WebSDK 3.3.0 版本及以后版本针对上面两个接口新增订阅视频规格FHD、HD、SD、LD 四种，详情查看RemoteStreamType，同时保留旧版本的high、low 两种，分别对应与FHD与LD。默认值为high或FHD，代表当前远端用户已发布的最高分辨率，例如：若远端发布1080P, FHD或high代表要订阅的视频规格为1080P，若远端发布480P,则FHD或high代表要订阅的视频规格为480P;

5. 离开频道。

   client.leave();