View

Manages connection with a secure WebSocket path to signal the Millicast server and establishes a WebRTC connection to view a live stream.

Before you can view an active broadcast, you will need:

  • A connection path that you can get from Director module or from your own implementation.

Constructor

new View(streamName, tokenGenerator, mediaElementopt, autoReconnectopt)

Parameters:
NameTypeAttributesDefaultDescription
streamNameString

Deprecated: Millicast existing stream name.

tokenGeneratortokenGeneratorCallback

Callback function executed when a new token is needed.

mediaElementHTMLMediaElement<optional>
null

Deprecated: Target HTML media element to mount stream.

autoReconnectBoolean<optional>
true

Enable auto reconnect to stream.

Source

Extends

Members

isDRMOn

Check if there are any DRM protected Track

Source

Methods

(async) addRemoteTrack(media, streams) → {Promise.<RTCRtpTransceiver>}

Add remote receiving track.

Parameters:
NameTypeDescription
mediaString

Media kind ('audio' | 'video').

streamsArray.<MediaStream>

Streams the track will belong to.

Source
Returns:

Promise that will be resolved when the RTCRtpTransceiver is assigned an mid value.

Type: 
Promise.<RTCRtpTransceiver>

configureDRM(options)

Configure DRM protected stream. When there are EncryptionParameters in the payload of 'active' broadcast event, this method should be called

Parameters:
NameTypeDescription
optionsDRMOptions

the options for DRM playback

Source

(async) connect(optionsopt) → {Promise.<void>}

Connects to an active stream as subscriber.

In the example, addStreamToYourVideoTag and getYourSubscriberConnectionPath is your own implementation.

Parameters:
NameTypeAttributesDescription
optionsObject<optional>

General subscriber options.

Properties
NameTypeAttributesDefaultDescription
dtxBoolean<optional>
false

True to modify SDP for supporting dtx in opus. Otherwise False.

absCaptureTimeBoolean<optional>
false

True to modify SDP for supporting absolute capture time header extension. Otherwise False.

metadataBoolean<optional>
false

Enable metadata extraction if stream is compatible.

drmBoolean<optional>
false

Enable the DRM protected stream playback.

disableVideoBoolean<optional>
false

Disable the opportunity to receive video stream.

disableAudioBoolean<optional>
false

Disable the opportunity to receive audio stream.

multiplexedAudioTracksNumber<optional>

Number of audio tracks to recieve VAD multiplexed audio for secondary sources.

pinnedSourceIdString<optional>

Id of the main source that will be received by the default MediaStream.

excludedSourceIdsArray.<String><optional>

Do not receive media from the these source ids.

eventsArray.<String><optional>

Override which events will be delivered by the server (any of "active" | "inactive" | "vad" | "layers" | "viewercount" | "updated").*

peerConfigRTCConfiguration<optional>

Options to configure the new RTCPeerConnection.

layerLayerInfo<optional>

Select the simulcast encoding layer and svc layers for the main video track, leave empty for automatic layer selection based on bandwidth estimation.

forcePlayoutDelayObject<optional>
false

Ask the server to use the playout delay header extension.

Properties
NameTypeAttributesDescription
minNumber<optional>

Set minimum playout delay value.

maxNumber<optional>

Set maximum playout delay value.

enableDRMBoolean<optional>

Enable DRM, default is false.

Source
Fires:
Returns:

Promise object which resolves when the connection was successfully established.

Type: 
Promise.<void>
Examples
await millicastView.connect(options)
import View from '@millicast/sdk'

//Define callback for generate new token
const tokenGenerator = () => getYourSubscriberInformation(accountId, streamName)

//Create a new instance
const streamName = "Millicast Stream Name where i want to connect"
const millicastView = new View(streamName, tokenGenerator)

//Set track event handler to receive streams from Publisher.
millicastView.on('track', (event) => {
  addStreamToYourVideoTag(event.streams[0])
})

millicastView.on('error', (error) => {
  console.error('Error from Millicast SDK', error)
})

//Start connection to broadcast
try {
 await millicastView.connect()
} catch (e) {
 console.log('Connection failed, handle error', e)
}

exchangeDRMConfiguration(targetMediaId, sourceMediaId)

Exchange the DRM configuration between two transceivers Both of the transceivers should be used for DRM protected streams

Parameters:
NameTypeDescription
targetMediaIdString
sourceMediaIdString
Source

getRTCPeerConnection() → {RTCPeerConnection}

Get current RTC peer connection.

Inherited From
Source
Returns:

Object which represents the RTCPeerConnection.

Type: 
RTCPeerConnection

isActive() → {Boolean}

Get if the current connection is active.

Inherited From
Source
Returns:
  • True if connected, false if not.
Type: 
Boolean

(async) project(sourceId, mapping)

Start projecting source in selected media ids.

Parameters:
NameTypeDescription
sourceIdString

Selected source id.

mappingArray.<Object>

Mapping of the source track ids to the receiver mids

Properties
NameTypeAttributesDescription
trackIdString<optional>

Track id from the source (received on the "active" event), if not set the media kind will be used instead.

mediaString<optional>

Track kind of the source ('audio' | 'video'), if not set the trackId will be used instead.

mediaIdString<optional>

mid value of the rtp receiver in which the media is going to be projected. If no mediaId is defined, the first track from the main media stream with the same media type as the input source track will be used.

layerLayerInfo<optional>

Select the simulcast encoding layer and svc layers, only applicable to video tracks.

promoteBoolean<optional>

To remove all existing limitations from the source, such as restricted bitrate or resolution, set this to true.

Source

(async) reconnect(dataopt)

Reconnects to last broadcast.

Parameters:
NameTypeAttributesDescription
dataObject<optional>

This object contains the error property. It may be expanded to contain more information in the future.

Properties
NameTypeDescription
errorString

The value sent in the first reconnect event within the error key of the payload

Inherited From
Source
Fires:

removeDRMConfiguration(mediaId)

Remove DRM configuration for a mediaId

Parameters:
NameTypeDescription
mediaIdString
Source

(async) select(layer)

Select the simulcast encoding layer and svc layers for the main video track

Parameters:
NameTypeDescription
layerLayerInfo

leave empty for automatic layer selection based on bandwidth estimation.

Source

setReconnect()

Sets reconnection if autoReconnect is enabled.

Inherited From
Source

stop()

Stops connection.

Overrides
Source

(async) unproject(mediaIds)

Stop projecting attached source in selected media ids.

Parameters:
NameTypeDescription
mediaIdsArray.<String>

mid value of the receivers that are going to be detached.

Source

Events

reconnect

Emits with every reconnection attempt made when an active stream stopped unexpectedly.

Type:
  • Object
Properties
NameTypeDescription
timeoutNumber

Next retry interval in milliseconds.

errorError

Error object with cause of failure. Possible errors are:

  • Signaling error: wsConnectionError if there was an error in the Websocket connection.
  • Connection state change: RTCPeerConnectionState disconnected if there was an error in the RTCPeerConnection.
  • Attempting to reconnect if the reconnect was trigered externally.
  • Or any internal error thrown by either Publish.connect or View.connect methods

Inherited From
Source