HiLink 文件

概述

本文將引導您如何將VCaaS教室集成到系統中。

鏈接跳轉方式

獲取教室鏈接

通過API生成教室鏈接。

跳轉鏈接

根據生成的鏈接跳轉到目標鏈接，以下列舉幾種跳轉示例：

  1. window.open
window.open(classroom_link);
  1. a標籤href屬性
<a href="classroom_link" target="_blank"></a>
  1. 動態a標籤
const openNewWindow = (strUrl: string) => {
  let a = document.createElement("a");
  document.body.appendChild(a);
  a.style = "display: none";
  a.target = "_blank";
  a.href = strUrl;
  a.click();
  document.body.removeChild(a);
}

openNewWindow(classroom_link);

Iframe嵌入方式

獲取教室鏈接

通過API生成教室鏈接。

嵌入教室

使用iframe嵌入教室示例如下：
注意⚠️：必須配置allow sandbox權限避免使用教室功能時出錯。

<iframe
  src="classroom_link"
  allow="microphone;camera;midi;encrypted-media;display-capture;autoplay;fullscreen;geolocation;picture-in-picture;clipboard-read;clipboard-write"
  sandbox="allow-scripts allow-top-navigation allow-same-origin allow-popups allow-popups-to-escape-sandbox allow-forms allow-modals allow-top-navigation-to-custom-protocols allow-downloads"
  referrerPolicy="no-referrer-when-downgrade"
/>

postMessage通信消息

消息體：

{
  "cmd": "MEETING_LOADED",
  "content": "boolean | Record<string, any>"
}

指令列表：

指令消息內容描述
MEETING_LOADEDtrue/false會議加載完成標識
ATTENDEE_OTHER_DEVICE_JOINED{}A、B兩個用戶先後入會，B將A擠出
ATTENDEE_QUITTED{}參會者主動退出
ATTENDEE_KICKED{}參會者被host踢出
MEETING_ENDED{}host 結束課堂
MEETING_AUTO_ENDED{}課堂時間到期，自動結束課堂
SELF_END_ALL_MEETING{}HOST 自己結束會議退出
REQUEST_401_QUITTED{}介面請求 401 退出
MEDIA_METRICS音視訊數據推送內容音視訊數據推送(自訂音視訊數據推送頻率)
OPEN_HELP_CENTER{}打開幫助中心
音視訊數據推送內容
{
  "meetingUid": "12345",
  "meetingExternalId": "meeting-500000",
  "timestamp": "xxxxx",
  "attendeeName": "user",
  "audioPacketsSentFractionLossPercent": 0,
  "audioPacketsReceivedFractionLossPercent": 0,
  "audioSpeakerDelayMs": 0,
  "audioUpstreamRoundTripTimeMs": 0,
  "audioUpstreamJitterMs": 0,
  "audioDownstreamJitterMs": 0,
  "currentRoundTripTimeMs": 0,
  "availableOutgoingBandwidth": 0,
  "availableIncomingBandwidth": 0,
  "videoUpstreamBitrate": 0,
  "videoUpstreamPacketLossPercent": 0,
  "videoUpstreamFramesEncodedPerSecond": 0,
  "videoUpstreamFrameHeight": 0,
  "videoUpstreamFrameWidth": 0,
  "videoUpstreamJitterMs": 0,
  "videoUpstreamRoundTripTimeMs": 0,
  "videoDownstreamMetrics": [
    {
      "attendeeName": "user1",
      "videoDownstreamBitrate": 0,
      "videoDownstreamPacketLossPercent": 0,
      "videoDownstreamPacketsReceived": 0,
      "videoDownstreamFramesDecodedPerSecond": 0,
      "videoDownstreamFrameHeight": 0,
      "videoDownstreamFrameWidth": 0,
      "videoDownstreamJitterMs": 0,
      "videoDownstreamDelayMs": 0
    },
    {
      "attendeeName": "user2",
      "videoDownstreamBitrate": 0,
      "videoDownstreamPacketLossPercent": 0,
      "videoDownstreamPacketsReceived": 0,
      "videoDownstreamFramesDecodedPerSecond": 0,
      "videoDownstreamFrameHeight": 0,
      "videoDownstreamFrameWidth": 0,
      "videoDownstreamJitterMs": 0,
      "videoDownstreamDelayMs": 0
    }
  ]
}

附加說明：請注意，如果使用者的視訊被關閉，則該使用者相關的視訊上傳數據將顯示為0。

自訂音視訊數據推送頻率

在 VCaaS 連結上拼接 frequency 參數，默认值為 60000，最小值 5000，單位毫秒。

  <iframe
    src="classroom_link?frequency=7000"
    allow="microphone;camera;midi;encrypted-media;display-capture;autoplay;fullscreen;geolocation;picture-in-picture;clipboard-read;clipboard-write"
    sandbox="allow-scripts allow-top-navigation allow-same-origin allow-popups allow-popups-to-escape-sandbox allow-forms allow-modals allow-top-navigation-to-custom-protocols allow-downloads"
    referrerPolicy="no-referrer-when-downgrade"
  />
Last Updated: