FlowPlayer integration with Storm Streaming Cloud

FlowPlayer is the second most popular web video player with a very extensive plugin system. This player can be easily integrated with the Storm Streaming Cloud service or an instance of the Storm Streaming Server.

Embed code

For Flowplayer, it is necessary to download the HLS plugin. The files are available in the creator's CDN, but they can also be locally embedded on a given website.

                        
<script src="//cdn.flowplayer.com/releases/native/3/stable/flowplayer.min.js"></script>
<script src="//cdn.flowplayer.com/releases/native/3/stable/plugins/hls.min.js"></script>
                    

Sample config

                        
<div id="container"></div>
<script>
    var player = flowplayer('#container',
        { src: '//${SERVER_HOST}/${APP_NAME}/${STREAM_KEY}.m3u8,
            hls : { native: true },
            token: 'your player token'
        })
</script>
                    

Main parameters explanation

src

Path to m3u8 file related to the stream. URL will always match the following pattern: //${SERVER_HOST}/${APP_NAME}/${STREAM_KEY}.m3u8 where: ${SERVER_HOST} Hostname for the Storm Cloud. The latter can be found on the Video Summary page. ${APP_NAME} Application name. For the Storm Cloud it’s always “live”. ${STREAM_KEY} Stream key for the video. For Storm Cloud, it can be found on the Video Summary page. example (Cloud Stream data): Cloud URL rtmp://edge.stormstreaming.com/live Stream Key 6530cdd463abad1bc9ab78bbfb728aaa52b8e779 turns into: //edge.stormstreaming.com/live/6530cdd463abad1bc9ab78bbfb728aaa52b8e779.m3u8

Table 1. Main parameters table

Adaptive Bitrate Streaming (ABR)

In order to utilize the Adaptive Bitrate Streaming (ABR) functionality, it is essential to enable and customize the transcoding setting. In the instance of Storm Streaming Cloud, users have the ability to choose this option during stream creation (provided their subscription permits it). For Storm Streaming Server, a commercial license is required, along with the setup of Transcoding within the respective application. For more in-depth instructions, please refer to our comprehensive guide on Transcoding & Adaptive Bitrate Streaming (ABR) Features.

Differences between FlowPlayer & Storm Library/Player

FlowPlayer and our dedicated Storm Library/Player work in different ways. FlowPlayer will not react to stream state changes (published, unpublished). It also will not update its data on the fly.

Useful links

1. Flowplayer HLS Documentation - https://docs.flowplayer.com/plugins/hls