通话事件说明

在使用 CallLib SDK 进行通话开发时，您需要在以下三种情况下注册通话事件监听器：

• 发起单人通话：通过 caller.call 方法传入 listener 参数
• 发起多人通话：通过 caller.callInGroup 方法传入 listener 参数
• 接收来电：从 onSession 回调参数中获取 session 实例后注册监听器

一、主动发起通话时注册监听器

1. 发起单人通话

通过 caller.call 方法发起单人通话时，您可以通过 listener 参数注册通话事件监听器。事件会自动绑定至新创建的 session 实例上。

API 文档：RCCallClient.call

示例代码

typescript

/**
 * 单呼，发起呼叫。成功后会产生一个新的 session
 * @param targetId 被呼叫一方的用户 ID（必填）
 * @param mediaType 1->音频呼叫 or 2->音视频呼叫（必填）
 * @param listener session 对象上注册的事件。主动发起 call 成功后会产生一个新的 session，这个 session 上要注册的事件（必填）
 * @param constraints 获取音频或音视频资源时的参数（可选）
 * @param params.channelId 组织 ID（可选）
 */
const { code, session } = await caller.call({
  targetId: this.targetId,
  mediaType,
  listener: {
    /**
     * 当远端用户已开始响铃，表示对方已收到呼叫请求（必填）
     * @param sender 已响铃的用户
     * @param session 当前的 session 对象
     */
    onRinging: (sender: ISenderInfo, session: RCCallSession) => {
      const { userId } = sender;
    },

    /**
     * 当远端用户同意接听（必填）
     * @param sender 远端用户
     * @param session 当前的 session 对象
     */
    onAccept: (sender: ISenderInfo, session: RCCallSession) => {
      const { userId } = sender;
    },

    /**
     * 当有远端用户挂断（必填）
     * @param sender 远端用户
     * @param reason 挂断的原因
     * @param session 当前的 session 对象
     */
    onHungup: (sender: ISenderInfo, reason: RCCallEndReason, session: RCCallSession) => {
      const { userId } = sender;
    },

    /**
     * 本端资源或远端资源已获取，track 为本地音频或音视频。track 不可设置成 Vue 组件的响应式数据（必填）
     * @param track 本端资源或远端资源
     * @param session 当前的 session 对象
     */
    onTrackReady: (track: RCTrack, session?: RCCallSession) => {
      // track.isLocalTrack() 是否为本地资源
      // track.isAudioTrack() 是否为音频
      // track.isVideoTrack() 是否为视频
      // track.getUserId() 产生该 track 的用户 ID

      // 播放音频。如果为远端音频，建议直接播放。如为本端音频，建议不播放，以减少回音
      if (track.isAudioTrack() && !track.isLocalTrack()) {
        track.play();
      }

      // 视频在对应的容器里播放
      if (track.isVideoTrack()) {
        const video = document.getElementById(
          "video" + user.userId
        ) as HTMLVideoElement;
        track.play(video);
      }
    },

    /**
     * 群组通话中有其他人被邀请加入
     * @param sender 发送者（必填）
     * @param invitedUsers 被邀请的用户列表
     * @param session 当前的 session 对象
     */
    onMemberModify: (sender: ISenderInfo, invitedUsers: IInvitedUsers[], session: RCCallSession) => {
    },

    /**
     * 通话类型改变时触发，例如：从视频变成音频通话（必填）
     * @param sender 发送者
     * @param mediaType 1 为音频通话，2 为视频通话
     * @param session 当前的 session 对象
     */
    onMediaModify: (sender: ISenderInfo, mediaType: RCCallMediaType, session: RCCallSession) => {
    },

    /**
     * 对方静音后触发（必填）
     * @param muteUser 已静音的用户
     * @param session 当前的 session 对象
     */
    onAudioMuteChange: (muteUser: IMuteUser, session: RCCallSession) => {
    },

    /**
     * 对方禁用视频后触发（必填）
     * @param muteUser 已禁用视频的用户
     * @param session 当前的 session 对象
     */
    onVideoMuteChange: (muteUser: IMuteUser, session: RCCallSession) => {
    },
  },
});

if (code === RCCallErrorCode.SUCCESS) {
  // 发起成功，执行后续操作
}

2. 发起多人通话

通过 caller.callInGroup 方法发起群组通话时，您也可以通过 listener 参数注册通话事件。事件同样绑定至通话 session 实例。

API 参考：RCCallClient.callInGroup

示例代码

typescript

const { code, session } = await caller.callInGroup({
  targetId: this.targetId,
  userIds,
  mediaType, // 1 音频，2 音视频
  listener: {
    // 同上，事件结构一致
    onRinging: ...,
    onAccept: ...,
    onHungup: ...,
    onTrackReady: ...,
    onMemberModify: ...,
    onMediaModify: ...,
    onAudioMuteChange: ...,
    onVideoMuteChange: ...,
  },
});

if (code === RCCallErrorCode.SUCCESS) {
  // 发起成功
}

二、接收来电时注册监听器

接收到来电后，您需要从 onSession 回调中获取 session 实例，并通过 registerSessionListener 方法注册事件监听器。

API 参考：registerSessionListener

参数说明

参数	类型	必填	说明
onRinging	function	是	当远端用户已开始响铃时触发。该函数有 2 个参数：sender 是发送者，session 是通话实例。此时您可以在业务层做响铃的 UI 展示
onAccept	function	是	当远端用户已同意接听时触发。该函数有 2 个参数：sender 是发送者，session 是通话实例。此时您可以把 UI 的"响铃"变成"通话中"
onHungup	function	是	当有远端用户挂断时触发。该函数有 3 个参数：sender 是发送者，reason 是挂断原因，session 是通话实例。此时您可以在 UI 层提示"xxx 已挂断"
onTrackReady	function	是	当本端资源或远端资源已获取时触发。该函数有 2 个参数：track 是本端资源或远端资源，session 是通话实例。此时您可以用拿到的 track 播放音频、视频
onMemberModify	function	是	群组通话中有其他人被邀请加入时触发。该函数有 3 个参数：sender 是发送者，invitedUsers 是被邀请的用户列表，session 是通话实例。此时您可以在 UI 层提示"xxx 加入通话"
onMediaModify	function	是	通话类型改变时触发。该函数有 3 个参数：sender 是发送者，mediaType 通话类型，session 是通话实例。此时您可以在 UI 层提示"已降级成音频通话"
onAudioMuteChange	function	是	对方静音后触发。该函数有 2 个参数：muteUser 是已静音的用户，session 是通话实例。此时您可以在 UI 层提示"xxx 已静音"
onVideoMuteChange	function	是	对方禁用视频后触发。该函数有 2 个参数：muteUser 是已禁用视频的用户，session 是通话实例。此时您可以在 UI 层提示"xxx 已禁用视频"

代码示例

typescript

/**
 * 在 session 实例上注册事件监听
 */
session.registerSessionListener({
  /**
   * 当远端用户已开始响铃
   * @param sender 已响铃的用户
   * @param session 当前的 session 对象
   */
  onRinging: (sender: ISenderInfo, session: RCCallSession) => {
    const { userId } = sender;
  },

  /**
   * 当远端用户已同意接听
   * @param sender 远端用户
   * @param session 当前的 session 对象
   */
  onAccept: (sender: ISenderInfo, session: RCCallSession) => {
    const { userId } = sender;
  },

  /**
   * 当有远端用户挂断
   * @param sender 远端用户
   * @param reason 挂断的原因
   * @param session 当前的 session 对象
   */
  onHungup: (sender: ISenderInfo, reason: RCCallEndReason, session: RCCallSession) => {
    const { userId } = sender;
  },

  /**
   * 本端资源或远端资源已获取，track 为本地音频或音视频。track 不可设置成 Vue 组件的响应式数据
   * @param track 本端资源或远端资源
   * @param session 当前的 session 对象
   */
  onTrackReady: (track: RCTrack, session?: RCCallSession) => {
    // track.isLocalTrack() 是否为本地资源
    // track.isAudioTrack() 是否为音频
    // track.isVideoTrack() 是否为视频
    // track.getUserId() 产生该 track 的用户 ID

    // 播放音频。如果为远端音频，建议直接播放。如为本端音频，建议不播放，以减少回音
    if (track.isAudioTrack() && !track.isLocalTrack()) {
      track.play();
    }

    // 视频在对应的容器里播放
    if (track.isVideoTrack()) {
      const video = document.getElementById(
        "video" + user.userId
      ) as HTMLVideoElement;
      track.play(video);
    }
  },

  /**
   * 群组通话中有其他人被邀请加入
   * @param sender 发送者
   * @param invitedUsers 被邀请的用户列表
   * @param session 当前的 session 对象
   */
  onMemberModify: (sender: ISenderInfo, invitedUsers: IInvitedUsers[], session: RCCallSession) => {
  },

  /**
   * 通话类型改变时触发，例如：从视频变成音频通话
   * @param sender 发送者
   * @param mediaType 1 为音频通话，2 为视频通话
   * @param session 当前的 session 对象
   */
  onMediaModify: (sender: ISenderInfo, mediaType: RCCallMediaType, session: RCCallSession) => {
  },

  /**
   * 对方静音后触发
   * @param muteUser 已静音的用户
   * @param session 当前的 session 对象
   */
  onAudioMuteChange: (muteUser: IMuteUser, session: RCCallSession) => {
  },

  /**
   * 对方禁用视频后触发
   * @param muteUser 已禁用视频的用户
   * @param session 当前的 session 对象
   */
  onVideoMuteChange: (muteUser: IMuteUser, session: RCCallSession) => {
  },
});

三、监听通话结束事件

通话结束时，onSessionClose 回调会被触发。您需要在初始化 CallLib 客户端时注册此回调。

API 参考：install

参数说明

参数	类型	必填	说明
onSessionClose	function	是	通话结束时，回调会被触发。该函数有 2 个参数：session 是通话实例，summary 是通话结束后的汇总信息

summary 参数说明

参数	类型	必填	说明
conversationType	ConversationType	是	通话类型
targetId	string	是	目标 ID
channelId	string	是	多组织 ID
mediaType	RCCallMediaType	是	通话媒体类型
beginTimestamp	number	是	通话开始时间戳
endTimestamp	number	是	通话结束时间戳
duration	number	是	通话时长
endReason	RCCallEndReason	是	通话结束原因

示例代码

typescript

/**
 * CallLib 客户端初始化
 */
const caller: RCCallClient = RongIMLib.installPlugin(callInstaller, {
  /**
   * 监听通话结束
   * 以下三条只要满足一条，就会触发 onSessionClose：
   * 1. 本端用户自己主动挂断
   * 2. 服务端把本端用户踢出 RTC 房间
   * 3. 房间里小于 2 个人
   *
   * @param {RCCallSession} session 被结束的 session 对象
   * @param summaryInfo 结束一个 session 后的汇总信息
   */
  onSessionClose: (session: RCCallSession, summaryInfo?: IEndSummary) => {
    // 处理通话结束逻辑
  },

  // 其他配置...
});