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 nameParameter typeRequiredDefaultDescription
hoststringyes-A hostname of a Storm Server instance. Since most browsers require SSL for WebSocket connection, using an IP Address is not recommended.
portnumberno80 for non-ssl and 443 for sslTo avoid issues with network firewalls, please use 80 for non-ssl connections and 443 for ssl connections.
sslbooleannoyesIndicates 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", application:"live", port: 443, ssl: true},
        { host: "sub2.yourdomain.com", application:"live", port: 443, ssl: true},
        { host: "sub3.yourdomain.com", application:"live", port: 443, ssl: true}
    ],
    sourceList: [
        { protocol: "storm", streamName:"test", application:"live"},
    ],
},
                    

sourceList item parameters

Parameter nameParameter typeRequiredDefaultDescription
protocolstringyes-Available protocols: RTMP, STORM, WEBRTC (coming soon).
applicationstringyes-The name of an application within a server
streamNamestringyes-The name of a stream.
hoststringno-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.
streamInfoObjectno-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 nameParameter typeRequiredDefaultDescription
labelstringyes-It can be called according to its resolution or quality, e.g., "360", "720p" or something simpler like "high", "medium.
widthnumberno-Width (in pixels) of a video stream
heightnumberno-Height (in pixels) of a video stream
fpsnumberno-Number of frames per second (fps)
bitratenumberno-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.