Options
All
  • Public
  • Public/Protected
  • All
Menu

Interface LiveReact<Snapshot>

example

新建文件LiveReact.ts 创建一个 LiveReact 实例对象:

import { createLiveReact } from '@realsee/live'
const LiveReact = createLiveReact({ getTicket: async () => '' })
export default LiveReact

Type parameters

  • Snapshot

Hierarchy

  • LiveReact

Index

Properties

Methods

Properties

live

live: Live<Snapshot>

Methods

LiveProvider

  • description

    LiveProvider 基于 React Context 对 进行封装，你可以以 React Hooks 的方式对 实例进行操作、数据监听等。

    在 React 环境中使用 LiveReact.LiveProvider 组件:

    import { LiveProvider } from './LiveReact'
    ReactDOM.render(<LiveProvider><App></LiveProvider>, containter)

    Parameters

    Returns Element

unsafe__useLiveInstance

  • unsafe__useLiveInstance(): Live<Snapshot>
  • deprecated

    获取 live 实例，不鼓励使用

    Returns Live<Snapshot>

unsafe__useRTCInstance

  • deprecated

    获取 RTC 实例，不鼓励使用

    Returns RTCProtocol

useConnect

  • useConnect(): (options?: { force?: boolean; url?: string; getTicket?: any }) => Promise<boolean | Error>
  • description

    连接 WebSocket 服务。如果 WebSocket 已经连接则什么都不做，若提供 {force: true} 则会强制重连。

    import { useConnect } from './LiveReact'
    function ReactComponent() {
      const connect = useConnect()
      return <button onClick={() => connect()}>点击连接</button>
    }

    Returns (options?: { force?: boolean; url?: string; getTicket?: any }) => Promise<boolean | Error>

      • (options?: { force?: boolean; url?: string; getTicket?: any }): Promise<boolean | Error>

      • Parameters

        • Optional options: { force?: boolean; url?: string; getTicket?: any }
          • Optional force?: boolean
          • Optional url?: string
          • getTicket?:function
            • getTicket(): Promise<string>

            • Returns Promise<string>

        Returns Promise<boolean | Error>

useCurrentWebSocketUrl

  • useCurrentWebSocketUrl(): undefined | string
  • description

    获取当前 WebSocket 连接的 URL，如果尚未创建 WebSocket 实例，则值为 undefined。 如果有重连等事件发生 URL 值会发生更新。

    import { useCurrentWebSocketUrl } from './LiveReact'
    function ReactComponent() {
      const url = useCurrentWebSocketUrl()
      return <div>当前URL: {url}.</div>
    }

    Returns undefined | string

useKeyframe

  • useKeyframe<K>(frameName: K): [frame: Snapshot[K], setFrame: (frame: Snapshot[K]) => boolean | Error]
  • description

    帧数据状态值。如果执行 setKeyframe() 则会传递 WebSocket 帧同步指令；若通过 WebSocket 收到新帧数据则会更新当前状态值。

    function LocalFiveState() {
      const [keyframe, setKeyframe] = LiveReact.useKeyframe('five')
      return (<div>{JSON.stringify(keyframe)}</div>)
    }

    Type parameters

    • K: string | number | symbol

    Parameters

    • frameName: K

    Returns [frame: Snapshot[K], setFrame: (frame: Snapshot[K]) => boolean | Error]

useKeyframeUpdateCallback

  • useKeyframeUpdateCallback<K>(name: K, callback: (...args: Parameters<KeyframeTypes<Snapshot>[K]>) => ReturnType<KeyframeTypes<Snapshot>[K]>, deps?: DependencyList): () => void

  • Type parameters

    • K: string | number | symbol

    Parameters

    Returns () => void

      • (): void

      • Returns void

useLiveAction

  • function

    broadcast 广播消息，详见 Live.broadcast。

    function

    exit 退出带看，详见 Live.exit。

    function

    kick 踢出带看，详见 Live.kick。

    function

    toggleMicro 打开/关闭自己的麦克风，详见 Live.toggleMicro。

    function

    forbidMicro 禁止麦克风，详见 Live.forbidMicro。

    function

    sendKeyframe 发送帧数据，详见 Live.sendKeyframe。

    function

    getFramesByKey 根据key从帧快照中获取某条帧数据，详见 Live.getFramesByKey。

    function

    setSelfInfo 设置当前用户信息，详见 Live.setSelfInfo。

    function

    updateStatus 更新用户或房间状态，详见 Live.updateStatus。

    description

    提供一些函数直接调用。

    function ReactComponent() {
      const { exit } = useLiveAction()
      return (<button onClick={() => exit()}>退出带看</button>)
    }

    Returns LiveActionReactCallback<Snapshot>

useLiveEventCallback

  • useLiveEventCallback<K>(name: K, callback: (...args: Parameters<LiveEventType<Snapshot>[K]>) => ReturnType<LiveEventType<Snapshot>[K]>, deps?: DependencyList): () => void

  • 监听带看相关的异步 Hooks 事件。详情见 LiveEventType。

    Type parameters

    Parameters

    Returns () => void

      • (): void

      • Returns void

useRTCAction

useRTCEventCallback

  • useRTCEventCallback<K>(name: K, callback: (...args: Parameters<RTCEventType[K]>) => ReturnType<RTCEventType[K]>, deps?: DependencyList): () => void

useReadyState

useSelfInfo

  • useSelfInfo(): [Partial<UserInfo>, (userInfo: Partial<UserInfo>) => Promise<boolean | Error>]

  • 获取\更改 当前用户信息。

    const [userInfo, setUserInfo] = useSelfInfo()

    Returns [Partial<UserInfo>, (userInfo: Partial<UserInfo>) => Promise<boolean | Error>]

useSnapshot

  • useSnapshot(): undefined | Partial<Snapshot>

  • 当前帧数据快照。

    Returns undefined | Partial<Snapshot>

useUserList

  • 获取房间用户列表。

    const userList = useUserList()

    Returns undefined | UserInfo[]

useWebSocketEventCallback