Web 集成方法

1. 前言

在你阅读此文档时,我们假定您已具备基础的 JavaScript开发经验,并能够理解相关基础概念.

立即使用

1. npm的方式

npm install tk-room-ui-sdk

import TKRoom from "tk-room-ui-sdk";

2.CDN的方式

<script src="https://h5-static.talk-cloud.net/static/public/UISDK/v1.0.11/bundle.umd.js"></script>

api

本部分中从初始化->进入教室->课中处理逻辑->回调数据的顺序从上往下进行对所有接口进行说明. 所有方法都是基于TKRoomUISDK开始。room可存在多实例。

实例化room对象new TKRoom(options) 

const option = {
  warpDom: document.getElementById('domId') // 容器dom节点
}
const tkRoom = new TKRoom(option)

加入房间TKRoom.prototype.joinRoom(option)

通过配置参数加入房间, 其中角色说明详细请参考 《角色说明文档》 该方法仅代表加载教室资源成功，房间连接成功需要监听RoomConnection事件。其中成功状态码为 0， 失败错误码见 《joinRoom 错误码》

  const joinRoomOptions = {
    serial?: string, // 教室号 (serial和thirdRoomId二者必传一个)
    thirdRoomId?: string; //第三方教室号(serial和thirdRoomId二者必传一个)
    domain?: string; // 企业域名（当使用thridRoomId时，此字段必传）
    userId?: string, // 用户id 非必传
    nickname: string, // 用户昵称 必传
    userRole: number, // 用户角色 必传
    password?: string, // 教室密码 非必传
    norecord?: boolean, // 回放中是否不录自己的音视频 非必传 默认false 
    classBeginLeave?: boolean, // 下课后是销毁还是到结束页面 非必传 默认 false
  }

  tkRoom.joinRoom(joinRoomOptions).then(res => {
    // 成功
    console.log(res) // {status: 0}
  }).catch(err => {
    // 根据状态码非0
    console.log(err) // {status: 1, msg: '错误描述信息'}
  })

通过配置webapi创建的进入教室链接，链接生成方式请参考 [进入房间接口说明]

  const entryRoomUrl = ''
  tkRoom.joinRoom(joinRoomOptions).then(res => {
    // 成功
    console.log(res) // {status: 0}
  }).catch(err => {
    // 根据状态码非0
    console.log(err) // {status: 1, msg: '错误描述信息'}
  })

加入回放教室 TKRoom.prototype.joinPlaybackRoom

  tkRoom.joinPlaybackRoom({
      serial?: string; // 教室号(serial和thirdRoomId二者必传一个)
      thirdRoomId?: string; // 第三方教室号(serial和thirdRoomId二者必传一个)
      domain?: string; // 企业域名（当使用thridRoomId时，此字段必传)
      recordTitle: string; // 录制件title 必传
      lang?: "zh-cn" | "zh-tw" | "en-us"; // 国际化 非必传
  }).then(res => {

  }) 

离开房间TKRoom.prototype.leaveRoom()

  tkRoom.leaveRoom().then(() => {
    console.log('离开房间成功')
  }).catch(err=> {
    console.log('离开房间失败', err) // {status: 1, msg: ''}
  }) 

单独设备检测模块 TKRoom.prototype.joinDeviceCheck()

事件监听 TKRoom.prototype.on(eventName, fn) 具体事件，请参考《教室事件说明文档.md》

  const eventName = "RoomParticipantEvicted" // 所有事件说明参考事件说明
  const fn = (...args) => {
    console.error(args)
  }
  tkRoom.on(eventName, fn)

取消事件监听 TKRoom.prototype.off(eventName, function)

  const fn = (...args) => {
    console.error(args)
  }
  tkRoom.on(eventName, fn)
  // 取消监听
  tkRoom.off(eventName, fn)