Embedded configuration - Storm JavaScript Library

In this approach, all data related to the streaming server (or servers) and stream source (or sources) must be provided inside the configuration object. It is the simplest method, but it does not offer load-balancing functionality.

                        
connectionType: "direct",
stream: {
    serverList: [
        { host: "yourdomain.com", port: 443, ssl: true}
    ],
    sourceList: [
        { protocol: "storm", streamName: "test", application: "live"},
    ],
},

serverList item parameters

Parameter name	Parameter type	Required	Default	Description
host	string	yes	-	A hostname of a Storm Server instance. Since most browsers require SSL for WebSocket connection, using an IP Address is not recommended.
port	number	no	80 for non-ssl and 443 for ssl	To avoid issues with network firewalls, please use 80 for non-ssl connections and 443 for ssl connections.
ssl	boolean	no	yes	Indicates whether SSL connection should be used or not.

Table 1. serverList item

serverList parameter (multiple servers)

You can add multiple servers to the serverList array. If one of these fails – another one will be used instead. Each time the player fails to connect to a given server playerConnectionFailed event will be triggered. If all servers fail (or the last one), onAllServersFailed will be called.

                        
connectionType:"direct",
stream: {
    serverList: [
        { host: "sub1.yourdomain.com", port: 443, ssl: true},
        { host: "sub2.yourdomain.com", port: 443, ssl: true},
        { host: "sub3.yourdomain.com", port: 443, ssl: true}
    ],
    sourceList: [
        { protocol: "storm", streamName:"test", application:"live"},
    ],
},

sourceList item parameters

Parameter name	Parameter type	Required	Default	Description
protocol	string	yes	-	Available protocols: RTMP, STORM, WEBRTC (coming soon).
application	string	yes	-	The name of an application within a server
streamName	string	yes	-	The name of a stream.
host	string	no	-	If the source is hosted on another server (RTMP server for example) you can add its host name. Server then will connect to that host to grab the stream.
streamInfo	Object	no	-	An object containing stream data like quality label, bitrate and resolution.

Table 2. sourceList item

Sample with RTMP protocol source item:

                        
connectionType:"direct",
stream: {
    serverList: [
        { host: "sub1.yourdomain.com", port: 443, ssl: true},
    ],
    sourceList: [
        { protocol: "rtmp", streamName:"test", host:"sub2.yourdomain.com", application:"live", streamInfo: {label:"720p", width: 1280, height: 720, fps:30, bitrate: 2500}}
    ],
},

streamInfo parameter

Parameter name	Parameter type	Required	Default	Description
label	string	yes	-	It can be called according to its resolution or quality, e.g., "360", "720p" or something simpler like "high", "medium.
width	number	no	-	Width (in pixels) of a video stream
height	number	no	-	Height (in pixels) of a video stream
fps	number	no	-	Number of frames per second (fps)
bitrate	number	no	-	Video bitrate in kbps (bits per second). The library will look at this value and treat sources with identical bitrate as backups.

Table 3. streamInfo

Sample:

                        
connectionType:"direct",
stream: {
    serverList: [
        { host: "sub1.yourdomain.com", port: 443, ssl: true},
    ],
    sourceList: [
        { protocol: "storm", streamName:"test", application:"live", streamInfo: {label:"720p", width: 1280, height: 720, fps:30, bitrate: 2500}}
    ],
},

sourceList parameter (multiple sources)

More than one source can be added to the player. If streamInfo (label, width, height, fps, bandwidth) data is the same on two or more sources player will use the remaining one(s) as a backup.

                        
connectionType:"direct",
stream: {
    serverList: [
        { host: "sub1.yourdomain.com", port: 443, ssl: true},
    ],
    sourceList: [
        { protocol: "storm", streamName:"test_720p", application:"live", streamInfo: {label:"720p", width: 1280, height: 720, fps:30, bitrate: 2500}},
        { protocol: "storm", streamName:"test_1080p", application:"live", streamInfo: {label:"1080p", width: 1920, height: 1080, fps:30, bitrate: 3500}},
        { protocol: "storm", streamName:"test_4k", application:"live", streamInfo: {label:"4k", width: 3840, height: 2160, fps:30, bitrate: 14000}},
    ],
},

                        
connectionType:"direct",
stream: {
    serverList: [
        { host: "sub1.yourdomain.com", port: 443, ssl: true},
    ],
    sourceList: [
        { protocol: "storm", streamName:"test_720p", application:"live", streamInfo: {label:"720p", width: 1280, height: 720, fps:30, bitrate: 2500}},
        { protocol: "storm", streamName:"test_copy", application:"live", streamInfo: {label:"720p", width: 1280, height: 720, fps:30, bitrate: 2500}},
    ],
},

Adaptive Bitrate Streaming

Storm JavaScript Library has an inbuilt mechanism for ultra-low latency adaptive bitrate streaming. This feature requires two or more sources are required with the proper bitrate parameter added to streamInfo object (remaining parameters like fps, width, height are optional). Whenever the library's algorithm detects an unstable viewer connection, it will automatically switch the stream to a lower quality. It will also try to increase the quality when the connection is stable again.

If two or more sources have exactly the same bitrate value - the library will treat them as backup sources.

On this page

Embedded configuration

serverList parameter

serverList (multiple servers) parameter

sourceList parameter

streamInfo parameter

sourceList (multiple sources) parameter

Adaptive Bitrate Streaming