Skip to main content
Documentation

Live

WebSocket-based co-viewing, room state, keyframe synchronization, and optional realtime voice for spatial applications.

@realsee/live@0.7.6 is the Realsee browser SDK for Live co-viewing. It wraps the Realsee WebSocket session channel so multiple users can share room state, synchronize UI keyframes, exchange custom broadcasts, and coordinate optional voice RTC.

The core package exports createLive, createLiveReact, Live, RTC helpers, and the Live type definitions:

import { createLive, LiveState } from '@realsee/live'

interface MyKeyframes {
  FiveState: unknown
  selectedTag: { id: string } | null
}

const live = createLive<MyKeyframes>({
  url: 'wss://ws-access.realsee.com/.../room',
  getTicket: async () => {
    const response = await fetch('/api/live/ticket')
    return response.json().then((payload) => payload.ticket)
  },
})

live.on('stateChange', (state) => {
  if (state === LiveState.OPEN) {
    live.sendKeyframe('selectedTag', null)
  }
})

await live.connect()

Version note

This docs tree is adapted from the domestic Live docs source and verified against the published overseas package:

PackageVerified versionNotes
@realsee/live@0.7.60.7.6npm tarball README and dist/*.d.ts files
react@18^18peer dependency; createLiveReact is React 18 typed
trtc-js-sdk>=4.15.3peer dependency for built-in browser RTC
amazon-chime-sdk-js>=3.0.0peer dependency for Chime RTC mode
@realsee/jsbridge-x>=0.2.6peer dependency for App or WebView bridge RTC
yjs13.6.20runtime dependency used for keyframe state synchronization

The domestic docs mention older WebSocket event names and a CLOSING state. The overseas 0.7.6 type declarations expose stateChange, keyframes, LiveState.NOTINITIALIZED, LiveState.CONNECTING, LiveState.OPEN, and LiveState.CLOSED; this English version follows the package types.

Runtime model

Live has four moving parts:

  1. Your own backend creates a Live room, WebSocket entrance URL, ticket, and optional voice sign through reviewed OpenAPI capability.
  2. The browser creates a Live instance with createLive<MyKeyframes> or createLiveReact<MyKeyframes>.
  3. The Live SDK connects to the WebSocket session with live.connect().
  4. Your app sends keyframes, room updates, broadcasts, and optional RTC actions after the session reaches LiveState.OPEN.

Live does not render a tour by itself. Pair it with Five SDK when you need synchronized spatial viewing.

Next steps