ray-streaming

ray-streaming

RayStreaming SDK for Web

Guides

Quick start

see live-cat or live-dragon

API reference

Connection

Manage the Signaling and PeerConnection connection with node machine

new Connection(url, iceServers[, iceTransportPolicy][, minBitrate][, maxBitrate][, startBitrate][, enableAFK]))

• url<string> signaling endpoint
• iceServers <RTCIceServer[]> RTCIceServer
• iceTransportPolicy <RTCIceTransportPolicy> iceTransportPolicy Default: 'all'
• minBitrate <number> append x-google-min-bitrate in creact offer Default: 2000
• maxBitrate <number> x-google-max-bitrate Default: 5000
• startBitrate <number> x-google-start-bitrate Default: 4000
• enableAFK <boolean> disconnect when detecting afk Default: true

connection.emitUIInteraction(msg)

• msg <string>

Send UI interaction message to remote application

connection.emitUIInteraction(JSON.stringify({ eventName: 'A' })).then((result) => {
  if (result) {
    console.log('execute success') // NOTE: only promise send to appliction
  }
})

connection.changeBitrate(bandwidth)

• bandwidth <number> kbps

connection.destory()

Close all connect, off event listener

Player

Provide the container to play the remote stream,

new Player(hostElement[, onPlay][, voicedAtPlay])

• hostElement <HTMLElement> any block element with fixed size
• onPlay <() => void> invoke when video play
• voicedAtPlay <boolean> remove muted attribute when play if set true Default: true

player.resizePlayer()

Resize player style to fill host element if host element size is smaller than player or resize player style to actual size

player.showTextOverlay(text)

• text <string>

Show prompt with specify text and mask video stream

player.destory()

Remove created elements

RunningState

State of the remote node or front-end widget, manager by laucher or execution context

// NOTE: Usually do not need to be modified
const runningInfo = new RunningState()

Helper

Helper.createDefaultEventStream(target, runningInfo)

• target <HTMLVideoElement> the video element
• runningInfo <RunningState> RunningState instance

Create default stream for basic interaction, transform to ArrayBuffer from the event-adapter definition

Helper.attachListener(target, runningInfo, connection)

• target <HTMLVideoElement>
• runningInfo <RunningState>
• connection <Connection>

the default behavior for consuming the event stream

Caveat

• Need to initialize Player after WeixinJSBridgeReady event fired if use in WeChat web-view

if (navigator.userAgent.includes('miniProgram') || navigator.userAgent.includes('MicroMessenger')) {
  document.addEventListener('WeixinJSBridgeReady', () => {
    // initialize here
  })
}