@realsee/live 0.7.5 → 0.7.7

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (7) hide show
  1. package/README.md +38 -6
  2. package/dist/index.cjs.js +1 -1
  3. package/dist/index.cjs.js.map +1 -1
  4. package/dist/index.es.js +45 -45
  5. package/dist/index.es.js.map +1 -1
  6. package/docs/index.html +38 -7
  7. package/package.json +2 -1
package/docs/index.html CHANGED
@@ -1,5 +1,5 @@
1
1
  <!DOCTYPE html><html class="default" lang="en"><head><meta charset="utf-8"/><meta http-equiv="x-ua-compatible" content="IE=edge"/><title>如视 Live SDK</title><meta name="description" content="Documentation for 如视 Live SDK"/><meta name="viewport" content="width=device-width, initial-scale=1"/><link rel="stylesheet" href="assets/style.css"/><link rel="stylesheet" href="assets/highlight.css"/><link rel="stylesheet" href="assets/custom.css"/><script defer src="assets/main.js"></script><script async src="assets/icons.js" id="tsd-icons-script"></script><script async src="assets/search.js" id="tsd-search-script"></script><script async src="assets/navigation.js" id="tsd-nav-script"></script></head><body><script>document.documentElement.dataset.theme = localStorage.getItem("tsd-theme") || "os";document.body.style.display="none";setTimeout(() => app?app.showPage():document.body.style.removeProperty("display"),500)</script><header class="tsd-page-toolbar"><div class="tsd-toolbar-contents container"><div class="table-cell" id="tsd-search" data-base="."><div class="field"><label for="tsd-search-field" class="tsd-widget tsd-toolbar-icon search no-caption"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><use href="assets/icons.svg#icon-search"></use></svg></label><input type="text" id="tsd-search-field" aria-label="Search"/></div><div class="field"><div id="tsd-toolbar-links"></div></div><ul class="results"><li class="state loading">Preparing search index...</li><li class="state failure">The search index is not available</li></ul><a href="index.html" class="title">如视 Live SDK</a></div><div class="table-cell" id="tsd-widgets"><a href="#" class="tsd-widget tsd-toolbar-icon menu no-caption" data-toggle="menu" aria-label="Menu"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><use href="assets/icons.svg#icon-menu"></use></svg></a></div></div></header><div class="container container-main"><div class="col-content"><div class="tsd-page-title"><h1>如视 Live SDK</h1></div><div class="tsd-panel tsd-typography"><a id="md:livejs" class="tsd-anchor"></a><h1 class="tsd-anchor-link">Live.js<a href="#md:livejs" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24"><use href="assets/icons.svg#icon-anchor"></use></svg></a></h1><p><a href="https://www.npmjs.com/package/@realsee/live" target="_blank" class="external"><img src="https://img.shields.io/npm/v/@realsee/live.svg?style=flat-square&amp;logo=npm&amp;label=npm%20install%20@realsee/live" alt="npm version"></a></p>
2
- <a id="md:功能说明" class="tsd-anchor"></a><h2 class="tsd-anchor-link">功能说明<a href="#md:功能说明" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24"><use href="assets/icons.svg#icon-anchor"></use></svg></a></h2><p><strong>Live</strong> 是 <a href="https://developers.realsee.com/docs/#/docs/live/README" target="_blank" class="external">如视开发者中心 VRTC 服务</a> 的核心客户端 Web SDK，搭配 Live Container
2
+ <a id="md:功能说明" class="tsd-anchor"></a><h2 class="tsd-anchor-link">功能说明<a href="#md:功能说明" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24"><use href="assets/icons.svg#icon-anchor"></use></svg></a></h2><p><strong>Live</strong> 是 <a href="https://open-platform.realsee.com/developer/docs/live/intro/" target="_blank" class="external">如视开放平台线上带看</a> 的核心客户端 Web SDK，搭配 Live Container
3
3
  SDKs（iOS/Android/微信小程序）和 Live API 可以快速实现实时同屏、实时语音、IM 等功能。</p>
4
4
  <a id="md:名词释义" class="tsd-anchor"></a><h3 class="tsd-anchor-link">名词释义<a href="#md:名词释义" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24"><use href="assets/icons.svg#icon-anchor"></use></svg></a></h3><ul>
5
5
  <li><strong>帧数据(Keyframe)</strong>: 指用户界面需同屏交互信息的状态数据的集合。</li>
@@ -31,9 +31,12 @@ SDKs（iOS/Android/微信小程序）和 Live API 可以快速实现实时同屏
31
31
  <p>在创建 <code>live</code> 实例时配置了两个参数：</p>
32
32
  <ul>
33
33
  <li><code>url</code>：连接 WebSocket 服务的 URL（可选），如果在创建 <code>live</code> 实例阶段并不知道 URL，您可以在合适的时机通过 <code>live.connect({ url })</code> 方法进行 WebSocket 连接。</li>
34
- <li><code>getTicket()</code>：是一个异步回调函数（可选），其返回值是连接 WebSocket 服务的 <strong>&quot;门票&quot;</strong>，关于如何获取 <code>ticket</code> 请查阅 <a href="https://developers.realsee.com/docs/#/docs/live/server/README" target="_blank" class="external">VR 带看 API</a>。也可以在 <code>connect</code> 时提供。</li>
34
+ <li><code>getTicket()</code>：是一个异步回调函数（可选），其返回值是连接 WebSocket 服务的 <strong>&quot;门票&quot;</strong>，关于如何获取 <code>ticket</code> 请查阅 <a href="https://open-platform.realsee.com/developer/docs/live/intro/" target="_blank" class="external">如视开放平台带看文档</a>。也可以在 <code>connect</code> 时提供。</li>
35
35
  </ul>
36
36
  <blockquote>
37
+ <p><strong>提示</strong>：如果在创建实例时同时提供了 <code>url</code> 和 <code>getTicket</code>，Live 会自动尝试连接，无需手动调用 <code>connect()</code> 方法。</p>
38
+ </blockquote>
39
+ <blockquote>
37
40
  <p>关于 <code>createLive()</code> 函数的更多参数配置请参考 <a href="https://unpkg.com/@realsee/live/docs/interfaces/live.LiveOptions.html" target="_blank" class="external">LiveOptions</a> 文档。</p>
38
41
  </blockquote>
39
42
  <p>获取实例 <code>live</code> 之后，可以做很多有趣的事情。但在讲述详细用途之前，先简单介绍下 <strong>Live</strong> 中的 <strong>消息系统</strong>。</p>
@@ -135,8 +138,36 @@ SDKs（iOS/Android/微信小程序）和 Live API 可以快速实现实时同屏
135
138
  <p><code>error(liveMsg: LiveMsg): void</code> - 服务端推送出现异常</p>
136
139
  </li>
137
140
  </ul>
138
- <p><code>live</code> 实例提供了很多诸如<code>live.connect()</code>、<code>live.broadcast()</code>、<code>live.sendKeyframe()</code>等方法，这些方法都是异步反馈且可能会影响房间内的其他用户。
141
+ <p><code>live</code> 实例提供了很多诸如<code>live.connect()</code>、<code>live.broadcast()</code>、<code>live.sendKeyframe()</code>、<code>live.exit()</code>、<code>live.close()</code>、<code>live.dispose()</code>等方法，这些方法都是异步反馈且可能会影响房间内的其他用户。
139
142
  您可以通过监听以上事件来获知这些影响。</p>
143
+ <a id="md:主要方法说明" class="tsd-anchor"></a><h3 class="tsd-anchor-link">主要方法说明<a href="#md:主要方法说明" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24"><use href="assets/icons.svg#icon-anchor"></use></svg></a></h3><ul>
144
+ <li><code>connect(options?)</code> - 连接带看房间，建立 WebSocket 连接</li>
145
+ <li><code>exit()</code> - 退出带看房间（不发送房间关闭消息）</li>
146
+ <li><code>close()</code> - 关闭带看房间（会发送房间关闭消息，通知服务器）</li>
147
+ <li><code>dispose()</code> - 销毁带看实例，清理所有资源（事件监听、Yjs 文档等）</li>
148
+ <li><code>sendKeyframe(key, frame)</code> - 发送帧数据</li>
149
+ <li><code>getFramesByKey(key)</code> - 根据键获取对应的帧数据</li>
150
+ <li><code>broadcast(data, toUserIds, timeout?)</code> - 向指定用户广播消息</li>
151
+ <li><code>setSelfInfo(userInfo)</code> - 更新本地用户信息</li>
152
+ <li><code>toggleMicro(status)</code> - 切换麦克风状态</li>
153
+ <li><code>kick(toUserIds)</code> - 踢出指定用户</li>
154
+ <li><code>forbidMicro(status, toUserIds?)</code> - 禁止/允许指定用户的麦克风</li>
155
+ <li><code>forbidSync(sync, toUserIds?)</code> - 禁止/允许指定用户的帧数据同步</li>
156
+ <li><code>updateStatus(evtType, atnType, status, toUserIds?)</code> - 更新带看状态（用户或房间状态）</li>
157
+ </ul>
158
+ <a id="md:主要属性说明" class="tsd-anchor"></a><h3 class="tsd-anchor-link">主要属性说明<a href="#md:主要属性说明" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24"><use href="assets/icons.svg#icon-anchor"></use></svg></a></h3><ul>
159
+ <li><code>state</code> - 当前带看连接状态（LiveState）</li>
160
+ <li><code>readyState</code> - WebSocket 就绪状态</li>
161
+ <li><code>url</code> - WebSocket 连接 URL</li>
162
+ <li><code>options</code> - 配置选项（只读）</li>
163
+ <li><code>snapshot</code> - 当前所有帧数据的快照</li>
164
+ <li><code>selfInfo</code> - 本地用户信息</li>
165
+ <li><code>userList</code> - 房间内所有用户列表</li>
166
+ <li><code>roomInfo</code> - 房间信息</li>
167
+ <li><code>$RTC</code> - RTC 实例（用于语音通信）</li>
168
+ <li><code>jsBridge</code> - JSBridge 实例（用于 App/WebView 环境）</li>
169
+ <li><code>keyframes</code> - 帧数据监听器（Subscribe 实例）</li>
170
+ </ul>
140
171
  <a id="md:rtc-事件" class="tsd-anchor"></a><h3 class="tsd-anchor-link">RTC 事件<a href="#md:rtc-事件" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24"><use href="assets/icons.svg#icon-anchor"></use></svg></a></h3><p>RTC 相关事件通过 <code>live.$RTC.on('/*事件名*/', /*事件回调*/)</code> 方式来监听。</p>
141
172
  <ul>
142
173
  <li>
@@ -186,7 +217,7 @@ SDKs（iOS/Android/微信小程序）和 Live API 可以快速实现实时同屏
186
217
  <tr>
187
218
  <td>code</td>
188
219
  <td>string</td>
189
- <td>返回码，详情参照<a href="https://developers.realsee.com/docs/#/docs/live/server/README" target="_blank" class="external">服务端 API Code 码表</a></td>
220
+ <td>返回码，详情参照<a href="https://open-platform.realsee.com/developer/docs/live/intro/" target="_blank" class="external">如视开放平台带看文档</a></td>
190
221
  </tr>
191
222
  <tr>
192
223
  <td>command</td>
@@ -233,7 +264,7 @@ SDKs（iOS/Android/微信小程序）和 Live API 可以快速实现实时同屏
233
264
  <p>RTC 语音不同容器或 RTC 解决方案不同，其错误信息内容可能不完全一致。</p>
234
265
  </blockquote>
235
266
  <a id="md:rtc-协议" class="tsd-anchor"></a><h2 class="tsd-anchor-link">RTC 协议<a href="#md:rtc-协议" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24"><use href="assets/icons.svg#icon-anchor"></use></svg></a></h2><p>语音能力需依赖 WebView/Browser 容器，即需要容器端实现 RTC 能力。</p>
236
- <p>为了方便开发者接入，<strong>如视开发者中心 VRTC 服务</strong> 为主流平台提供 <a href="https://developers.realsee.com/docs/#/docs/live/client/container/README" target="_blank" class="external">容器 SDK</a>
267
+ <p>为了方便开发者接入，<strong>如视开放平台</strong> 为主流平台提供 <a href="https://open-platform.realsee.com/developer/docs/live/intro/" target="_blank" class="external">容器 SDK</a>
237
268
  和 <a href="https://www.npmjs.com/package/@realsee/jsbridge-x" target="_blank" class="external">jsbridge-x</a> 。</p>
238
269
  <p><strong>Live</strong> 通过 <strong>jsbridge-x</strong> 与 集成了<strong>容器 SDK</strong> 的客户端应用或微信小程序应用程序桥接，实现原生能力的调用。这个 <code>jsbridge-x</code>
239
270
  实例需作为配置参数提供给<code>createLive()</code>。</p>
@@ -306,6 +337,6 @@ SDKs（iOS/Android/微信小程序）和 Live API 可以快速实现实时同屏
306
337
  <a id="md:相关文档链接" class="tsd-anchor"></a><h2 class="tsd-anchor-link">相关文档链接<a href="#md:相关文档链接" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24"><use href="assets/icons.svg#icon-anchor"></use></svg></a></h2><ul>
307
338
  <li><a href="https://www.npmjs.com/package/@realsee/five" target="_blank" class="external">@realsee/five</a></li>
308
339
  <li><a href="https://www.npmjs.com/package/@realsee/jsbridge-x" target="_blank" class="external">@realsee/jsbridge-x</a></li>
309
- <li><a href="https://developers.realsee.com/docs/#/docs/live/README" target="_blank" class="external">如视开发者中心 VRTC 服务</a></li>
340
+ <li><a href="https://open-platform.realsee.com/developer/docs/live/intro/" target="_blank" class="external">如视开放平台线上带看</a></li>
310
341
  </ul>
311
- </div></div><div class="col-sidebar"><div class="page-menu"><div class="tsd-navigation settings"><details class="tsd-accordion"><summary class="tsd-accordion-summary"><h3><svg width="20" height="20" viewBox="0 0 24 24" fill="none"><use href="assets/icons.svg#icon-chevronDown"></use></svg>Settings</h3></summary><div class="tsd-accordion-details"><div class="tsd-filter-visibility"><span class="settings-label">Member Visibility</span><ul id="tsd-filter-options"><li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-inherited" name="inherited" checked/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Inherited</span></label></li></ul></div><div class="tsd-theme-toggle"><label class="settings-label" for="tsd-theme">Theme</label><select id="tsd-theme"><option value="os">OS</option><option value="light">Light</option><option value="dark">Dark</option></select></div></div></details></div><details open class="tsd-accordion tsd-page-navigation"><summary class="tsd-accordion-summary"><h3><svg width="20" height="20" viewBox="0 0 24 24" fill="none"><use href="assets/icons.svg#icon-chevronDown"></use></svg>On This Page</h3></summary><div class="tsd-accordion-details"><a href="#md:livejs"><span>Live.js</span></a><ul><li><a href="#md:功能说明"><span>功能说明</span></a></li><li><ul><li><a href="#md:名词释义"><span>名词释义</span></a></li></ul></li><li><a href="#md:快速上手"><span>快速上手</span></a></li><li><ul><li><a href="#md:安装-sdk"><span>安装 SDK</span></a></li><li><a href="#md:如何使用"><span>如何使用</span></a></li></ul></li><li><a href="#md:消息系统"><span>消息系统</span></a></li><li><ul><li><a href="#md:帧数据同步"><span>帧数据同步</span></a></li><li><a href="#md:房间信息"><span>房间信息</span></a></li><li><a href="#md:广播消息"><span>广播消息</span></a></li></ul></li><li><a href="#md:事件监听"><span>事件监听</span></a></li><li><ul><li><a href="#md:带看连接状态"><span>带看连接状态</span></a></li><li><a href="#md:带看事件"><span>带看事件</span></a></li><li><a href="#md:rtc-事件"><span>RTC 事件</span></a></li><li><a href="#md:异常处理"><span>异常处理</span></a></li></ul></li><li><a href="#md:rtc-协议"><span>RTC 协议</span></a></li><li><a href="#md:浏览器端支持"><span>浏览器端支持</span></a></li><li><ul><li><a href="#md:trtc"><span>TRTC</span></a></li><li><a href="#md:chime"><span>Chime</span></a></li><li><a href="#md:使用内置的-jsbridge-和-rtc-实现"><span>使用内置的 <wbr/>Js<wbr/>Bridge 和 RTC 实现</span></a></li></ul></li><li><a href="#md:typescript--react-支持"><span>Type<wbr/>Script &amp; <wbr/>React 支持</span></a></li><li><ul><li><a href="#md:可用的-react-hooks"><span>可用的 <wbr/>React <wbr/>Hooks</span></a></li></ul></li><li><a href="#md:live-api-文档"><span>Live API 文档</span></a></li><li><a href="#md:相关文档链接"><span>相关文档链接</span></a></li></ul></div></details></div><div class="site-menu"><nav class="tsd-navigation"><a href="modules.html" class="current"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="assets/icons.svg#icon-1"></use></svg><span>如视 Live SDK</span></a><ul class="tsd-small-nested-navigation" id="tsd-nav-container" data-base="."><li>Loading...</li></ul></nav></div></div></div><footer></footer><div class="overlay"></div></body></html>
342
+ </div></div><div class="col-sidebar"><div class="page-menu"><div class="tsd-navigation settings"><details class="tsd-accordion"><summary class="tsd-accordion-summary"><h3><svg width="20" height="20" viewBox="0 0 24 24" fill="none"><use href="assets/icons.svg#icon-chevronDown"></use></svg>Settings</h3></summary><div class="tsd-accordion-details"><div class="tsd-filter-visibility"><span class="settings-label">Member Visibility</span><ul id="tsd-filter-options"><li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-inherited" name="inherited" checked/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Inherited</span></label></li></ul></div><div class="tsd-theme-toggle"><label class="settings-label" for="tsd-theme">Theme</label><select id="tsd-theme"><option value="os">OS</option><option value="light">Light</option><option value="dark">Dark</option></select></div></div></details></div><details open class="tsd-accordion tsd-page-navigation"><summary class="tsd-accordion-summary"><h3><svg width="20" height="20" viewBox="0 0 24 24" fill="none"><use href="assets/icons.svg#icon-chevronDown"></use></svg>On This Page</h3></summary><div class="tsd-accordion-details"><a href="#md:livejs"><span>Live.js</span></a><ul><li><a href="#md:功能说明"><span>功能说明</span></a></li><li><ul><li><a href="#md:名词释义"><span>名词释义</span></a></li></ul></li><li><a href="#md:快速上手"><span>快速上手</span></a></li><li><ul><li><a href="#md:安装-sdk"><span>安装 SDK</span></a></li><li><a href="#md:如何使用"><span>如何使用</span></a></li></ul></li><li><a href="#md:消息系统"><span>消息系统</span></a></li><li><ul><li><a href="#md:帧数据同步"><span>帧数据同步</span></a></li><li><a href="#md:房间信息"><span>房间信息</span></a></li><li><a href="#md:广播消息"><span>广播消息</span></a></li></ul></li><li><a href="#md:事件监听"><span>事件监听</span></a></li><li><ul><li><a href="#md:带看连接状态"><span>带看连接状态</span></a></li><li><a href="#md:带看事件"><span>带看事件</span></a></li><li><a href="#md:主要方法说明"><span>主要方法说明</span></a></li><li><a href="#md:主要属性说明"><span>主要属性说明</span></a></li><li><a href="#md:rtc-事件"><span>RTC 事件</span></a></li><li><a href="#md:异常处理"><span>异常处理</span></a></li></ul></li><li><a href="#md:rtc-协议"><span>RTC 协议</span></a></li><li><a href="#md:浏览器端支持"><span>浏览器端支持</span></a></li><li><ul><li><a href="#md:trtc"><span>TRTC</span></a></li><li><a href="#md:chime"><span>Chime</span></a></li><li><a href="#md:使用内置的-jsbridge-和-rtc-实现"><span>使用内置的 <wbr/>Js<wbr/>Bridge 和 RTC 实现</span></a></li></ul></li><li><a href="#md:typescript--react-支持"><span>Type<wbr/>Script &amp; <wbr/>React 支持</span></a></li><li><ul><li><a href="#md:可用的-react-hooks"><span>可用的 <wbr/>React <wbr/>Hooks</span></a></li></ul></li><li><a href="#md:live-api-文档"><span>Live API 文档</span></a></li><li><a href="#md:相关文档链接"><span>相关文档链接</span></a></li></ul></div></details></div><div class="site-menu"><nav class="tsd-navigation"><a href="modules.html" class="current"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="assets/icons.svg#icon-1"></use></svg><span>如视 Live SDK</span></a><ul class="tsd-small-nested-navigation" id="tsd-nav-container" data-base="."><li>Loading...</li></ul></nav></div></div></div><footer></footer><div class="overlay"></div></body></html>
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@realsee/live",
3
- "version": "0.7.5",
3
+ "version": "0.7.7",
4
4
  "description": "如视 Live SDK：基于如视 WebSocket 长链双工通信能力的前端封装，借助此 SDK 您可以快捷地实现具备同屏连线、实时语音的 VR 带看业务能力。",
5
5
  "author": "BEIKE REALSEE TECHNOLOGY (HK) LIMITED",
6
6
  "license": "SEE LICENSE IN TERMS.txt",
@@ -11,6 +11,7 @@
11
11
  "scripts": {
12
12
  "dev": "tsc && vite build --mode development --watch",
13
13
  "build": "tsc && vite build",
14
+ "test": "npm run build && node --experimental-loader ./test/external-loader.mjs --test test/*.test.mjs",
14
15
  "docs": "npx typedoc",
15
16
  "prepublishOnly": "npm run build && npm run docs",
16
17
  "prepack": "npm run build && npm run docs"