# 实现视频双录

本文档为您展示通过 SDK 实现视频双录(无排队机)的相关步骤,帮助您在多人视频通话场景下实现创建会议、邀请新成员加入、结束/离开会议的相关能力。

# 加入会议

/**
    * 加入一个会议,结果回调由{@link ConferenceEventType.CONFERENCE_JOIN}上报
  *
  * @param confNumber - 可传字母或数字作为自定义会议号
  * @param video - 传递 true 即可. **目前强制为视频会议, 语音会议暂不可用**
  * @param joinParam - 加入会议额外参数
  */
join(confNumber: string, video: boolean, joinParam: ConferenceJoinParam): Promise<any>;

ConferenceJoinParam 参数说明

属性名 类型 描述
displayName string 昵称
conferencePassword string (数字/字母) 会议密码
enableRecord boolean 是否开启服务端录制注:开启服务端录制后需要在收到 ConferenceEventType.RECORD_DELIVERY_JOIN 事件后才能开始录制
role ConferenceRole

如会议已存在,且会议密码错误,将会通过 ConferenceEventType.ERROR (opens new window) 事件回调。可通过错误类型判断是否为会议密码错误。

this.client.addEventListener(ConferenceEventType.ERROR, (ev) => {
  switch (ev.error) {
    case ConferenceErrorType.CONFERENCE_PASSWORD_ERROR:
      wx.showModal({
        content: '会议密码错误'
      });
      break;
  }
});

示例代码:

var {SimpleRoleCompose} = JuphoonRTCConferenceSDK;
// SimpleRoleCompose.NORMAL 普通角色(默认)
// SimpleRoleCompose.AGENT 坐席
// SimpleRoleCompose.GUEST 访客

client.start('12345678', true, {nickName: 'siaikin', role: SimpleRoleCompose.NORMAL});

通过 ConferenceJoinParam 可在加入会议前设置会议最大人数, 昵称, 参会密码, 是否开启录制, 在会议中的角色等。

调用该方法后会收到 ConferenceEventType.CONFERENCE_JOIN (opens new window) 事件, 可以在该事件中调用 requestVideo (opens new window)startVideo (opens new window) 设置请求的视频画面大小以及渲染画面。

startVideo (opens new window) 方法会返回一个Prmise, 当返回值变为 resolve 状态时, then 方法会接受到一个 WeChatRemoteStream (opens new window) 对象,可以调用该对象的 start (opens new window) 方法在界面上渲染视频画面。

start方法接受一个小程序自定义组件 的 id 和 小程序页面的 this 为参数,之后将会把视频画面渲染到该组件中。

WeChatRemoteStream 对象也有同样的 start 方法。

const that = this;
client.addEventListener(ConferenceEventType.CONFERENCE_JOIN, (ev) => {
  // 设置远端画面的分辨率为最小值
  client.requestVideo(null, ConferencePictureSize.MIN)
    .catch(reason => console.error(reason));
  //    渲染远端画面到id为 `remote-video` 的dom元素中
  client.startVideo()
    .then(stream => {
    stream.start('remote-video', that);
  });
});
//  视频尺寸枚举
export enum ConferencePictureSize
{
  /**
   * 不请求
   */
  NONE = '0x0',
  /**
   * 最小尺寸
   */
  MIN = '0x100',
  /**
   * 小尺寸
   */
  SMALL = '0x200',
  /**
   * 大尺寸
   */
  LARGE = '0x300',
  /**
   * 最大尺寸
   */
  MAX = '0x400'
}

# 创建本地视频画面

调用 client.startCameraVideo (opens new window) 会返回一个 WeChatLocalStream (opens new window) 对象, 需要先通过 WeChatLocalStream.start (opens new window) 绑定页面中的 <local-stream> 组件。start 方法会在绑定后自动打开摄像头并发送音视频数据。

TIP

SDK需要获取到wxml里的 <local-stream> 组件对象,需要小程序页面的 this 对象,SDK中可通过 client.setPageTarget(this) (opens new window) 接口或 WeChatLocalStream.start('id', this) (opens new window) 设置页面的 this

/**
    * 获得视频预览对象,通过此对象能获得本地摄像头画面用于UI显示
    */
startCameraVideo(): Promise<WeChatLocalStream>;

示例代码:

 <local-stream id="local-stream" style="width: 50%;height: 100%;"></local-stream>
const that = this;
this.client.startCameraVideo()
  .then(stream => {
  stream.start('local-stream', that);
})

# 新成员加入

当新成员加入频道后,其他成员会收到成员加入的回调。

client.addEventListener(ConferenceEventType.CONFERENCE_PARTICIPANT_UPDATE, (ev) => {
  const
        //  变化之前的状态
    old = ev.message.old,
        //  变化之后的状态
    new = ev.message.new;
});

# 创建远端视频画面

调用 client.startVideo (opens new window) 会返回一个 WeChatRemoteStream (opens new window) 对象, 需要先通过 WeChatRemoteStream.start (opens new window) 绑定 <remote-stream> 组件。start 方法会在绑定后自动渲染远端画面。

TIP

<lcoal-stream>组件相同, SDK需要获取到wxml里的<remote-stream> 组件对象,需要小程序页面的 this 对象,SDK中可通过 client.setPageTarget(this) (opens new window) 接口或 WeChatRemoteStream.start('id', this) (opens new window) 设置页面的 this

/**
    * 获得视频对象,通过此对象能获得远端画面用于UI显示
  */
startVideo(): Promise<WeChatRemoteStream>;

示例代码:

<remote-stream id="remote-stream" style="width: 50%;height: 100%;"></remote-stream>
const that = this;
this.client.startVideo()
  .then(stream => {
    stream.start('remote-stream', that);
    })

# 离开会议

离开会议 (opens new window)需要调用下面的接口:

/**
    * 离开会议
  */
leave(): Promise<any>;

/**
  * 离开会议回调
  */
client.addEventListener(ConferenceEventType.CONFERENCE_LEAVE, (ev) => {
  if (ev.message.result) {
    //  离开成功
  } else {
    // 离开失败
  }
});

# 成员离开

当成员离开频道 (opens new window)后,其他成员会收到成员离开的回调。

client.addEventListener(ConferenceEventType.CONFERENCE_PARTICIPANT_LEFT, (ev) => {
  const
        //  离开的成员信息
    participant = ev.message.participant;
});

成员对象说明

接口 返回值类型 接口说明
isAgent boolean 该成员是否为坐席
isGuest boolean 该成员是否为访客
isRecordDelivery boolean 该成员是否为录制cd

# 结束会议

如果想结束会议,可以调用 stop (opens new window) 接口,此时所有成员都将被退出。

/**
  * 结束会议,主持人才能调用该接口结束会议,结果回调由{@link ConferenceEventType.CONFERENCE_LEAVE}上报
  */
stop(): Promise<any>;

关闭频道的回调通过 ConferenceEventType.CONFERENCE_DESTROY (opens new window) 事件进行上报。

client.addEventListener(ConferenceEventType.CONFERENCE_DESTROY, () => {
});