VideoJS is a lightweight, open-source video player with excellent flexibility and plugin support. It integrates seamlessly with both the Storm Streaming Cloud platform and the standalone Storm Streaming Server.
Note: This guide is based on Video.js v8+ and assumes usage of the videojs-http-streaming plugin.
Include the required scripts for Video.js and HLS support:
<!-- VideoJS Core -->
<script src="https://cdn.jsdelivr.net/npm/video.js@8/dist/video.min.js"></script>
<!-- HLS plugin -->
<script src="https://cdn.jsdelivr.net/npm/videojs-http-streaming@2.14.1/dist/videojs-http-streaming.min.js"></script>
Embed your video player using the following configuration:
<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>
<script>
// Replace the following placeholders with actual values
// ${SERVER_HOST}, ${APP_NAME}, ${STREAM_KEY}
var player = videojs("vid1");
player.play();
</script>
| source: src |
Path to the `.m3u8` file that represents the live stream. It must follow the pattern:
https://${SERVER_HOST}/${APP_NAME}/${STREAM_KEY}.m3u8 where:
|
|---|
To enable Adaptive Bitrate Streaming (ABR), you must configure the transcoding options. In Storm Streaming Cloud, this can be done during stream creation (depending on your subscription). For Storm Streaming Server, a commercial license is required, along with proper transcoder configuration in the application. See our Transcode Configuration guide for details.
VideoJS and the Storm Library/Player have different capabilities. VideoJS does not automatically respond to stream state changes such as publish/unpublish. Custom logic must be implemented by the developer to support dynamic updates.
Create a free ticket and our support team will provide you necessary assistance.