VideoJS integration with Storm Streaming Cloud

VideoJS is a minimalist, open-source video player for websites with huge potential. It also integrates well with the Storm Streaming Cloud service or an instance of the Storm Streaming Server.

Embed code

                        
<video-js id="vid1" width="600" height="300" class="vjs-default-skin" controls>
    <source src="https://${SERVER_HOST}/${APP_NAME}/${STREAM_KEY}.m3u8" type="application/x-mpegURL" />
</video-js>
<!-- "core" version of Video.js -->
<script src="video.core.min.js"></script>
<script src="videojs-http-streaming.min.js"></script>
<script>
    var player = videojs("vid1");
    player.play();
</script>
                    

Main parameters explanation

source: src

Path to m3u8 file related to the stream. URL will always match the following pattern: https://${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: https://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 VideoJS & Storm Library/Player

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

Useful links

1. VideoJS Github Page - https://github.com/videojs/http-streaming