Radiant Media Player supports DASH or HLS streaming with Shaka Player to HTML5 video. Our Shaka Player to HTML5 video implementation relies on media source extensions (MSE). Where media source extensions support is not available (e.g. iOS, older Android) we fallback to native HLS to HTML5 video. It is to be noted that due to the lack of support for media source extensions on iOS we cannot render DASH content on iOS. When neither media source extensions nor native HLS support are available the player can fallback to HLS to Flash. Hopefully this last case scenario has become rare (mainly older versions of Internet Explorer) since Flash is now an outdated solution for displaying media content in the industry (read our deprecating Flash support article for more information).
If you want to stream DASH content to Radiant Media Player, Shaka Player engine will be used. For HLS you can either use hls.js or Shaka Player engine (difference in HLS supported features is explained below).
Generally available features like video ads, JavaScript API or playback rate changes are also supported with DASH to Radiant Media Player.
By default the player expects a DASH manifest to expose both MP4 (H.264 with AAC) & WebM (VP9 with Vorbis) content. Wherever possible DASH WebM will be preferred over DASH MP4. If you are using DASH with MP4 only or WebM only content please refer to the dashMimeType setting below for best device coverage.
Currently unsupported features:
Support for HLS in Shaka Player is still very new as of July 2017 and only a limited set of the HLS specification is currently supported:
Note that more HLS options are available with our
hls.js based implementation but Shaka Player engine notably enables support for HLS with DRM content and MSE-based HLS streaming to macOS Safari 9+. Enabling HLS with Shaka Player
in Radiant Media Player is done by setting
hlsEngine: 'shakaplayer' in your player configuration. So when to use HLS with Shaka Player in Radiant Media Player one may ask?
Generally available features like video ads, JavaScript API or playback rate changes are also supported with HLS to Radiant Media Player.
See our compatibility table for a list of environments where DASH & HLS streaming are supported with Radiant Media Player.
As a rule of thumb Radiant Media Player should work with any-standard compliant DASH or HLS streaming service provider. In order to provide better cross-device support for DASH or HLS streaming to Radiant Media Player we recommend the following:
In this example we use an ABR multi-codec, multi-audio, multi-captions on-demand DASH stream:
<!-- Include Radiant Media Player JavaScript file in your <body> or <head> --> <script src="https://cdn.radiantmediatechs.com/rmp/4.4.19/js/rmp.min.js" integrity="sha384-MHxuw6s8n+Uh8xT1LYC0zcidvLkX9DN0otZPYoamhjIU8svCQARWXpRYEXV6o6LI" crossorigin="anonymous"></script> <!-- Set up your wrapper div with its unique id --> <div id="rmpPlayer"></div> <!-- Set up player configuration options --> <script> var bitrates = { dash: 'https://storage.googleapis.com/shaka-demo-assets/angel-one/dash.mpd', // For older devices and iOS we may provide an MP4 progressive download fallback mp4: [ 'https://www.rmp-streaming.com/media/bbb-360p.mp4' ] }; var settings = { licenseKey: 'your-license-key', bitrates: bitrates, delayToFade: 3000, width: 640, height: 360, poster: 'https://www.radiantmediaplayer.com/images/poster-rmp-showcase.jpg', // The below settings are not always necessary - they are displayed as an example // the displayed values are the default player values dashMimeType: { mp4: true, webm: true }, webmCodecs: { video: 'vp9', audio: 'vorbis' } }; // Reference to the wrapper div (unique id) var elementID = 'rmpPlayer'; // Create an object based on RadiantMP constructor var rmp = new RadiantMP(elementID); // Initialization ... test your page and done! rmp.init(settings); </script>
In this example we use an ABR multi-audio, multi-captions on-demand fMP4 HLS stream:
<!-- Include Radiant Media Player JavaScript file in your <body> or <head> --> <script src="https://cdn.radiantmediatechs.com/rmp/4.4.19/js/rmp.min.js" integrity="sha384-MHxuw6s8n+Uh8xT1LYC0zcidvLkX9DN0otZPYoamhjIU8svCQARWXpRYEXV6o6LI" crossorigin="anonymous"></script> <!-- Set up your wrapper div with its unique id --> <div id="rmpPlayer"></div> <!-- Set up player configuration options --> <script> var bitrates = { hls: 'https://storage.googleapis.com/shaka-demo-assets/angel-one-hls/master.m3u8' }; var settings = { licenseKey: 'your-license-key', bitrates: bitrates, delayToFade: 3000, width: 640, height: 360, // Here we tell the player to use Shaka Player for HLS streaming hlsEngine: 'shakaplayer', poster: 'https://www.radiantmediaplayer.com/images/poster-rmp-showcase.jpg', }; // Reference to the wrapper div (unique id) var elementID = 'rmpPlayer'; // Create an object based on RadiantMP constructor var rmp = new RadiantMP(elementID); // Initialization ... test your page and done! rmp.init(settings); </script>
dashFirst: Boolean
When used in conjonction with HLS this setting will tell the player to pick DASH (where supported) as a first choice over HLS (picking HLS as a first choice is the player default). DASH (where supported) is always picked first over MP4/WebM progressive download. Default: false.
dashMimeType: Object
By default the player expects a DASH manifest to expose both MP4 (H.264 with AAC) & WebM (VP9 with Vorbis) content. If this is your use-case you do need to set the dashMimeType setting - the default value will work great. Wherever possible DASH WebM will be preferred over DASH MP4. If your DASH manifest does not include both MP4 & WebM content, or if your DASH manifest has a WebM codecs set other than VP9/Vorbis, you must give this information to the player up-front so that it can fallback to other streaming protocols like HLS or progressive download. If you do not provide HLS or progressive download alternatives (this is not recommended) to the player then setting dashMimeType is not necessary. Default:
dashMimeType: {
mp4: true,
webm: true
}
When dashMimeType.webm is set to true and your DASH manifest has WebM codecs data other than VP9/Vorbis the player also expects a webmCodecs setting to be set. The webmCodecs is an Object set has:
webmCodecs: {
video: 'vp9',
audio: 'vorbis'
}
webmCodecs.video must be either 'vp8' or 'vp9'. webmCodecs.audio must either be 'vorbis' or 'opus'.
hlsEngine: String
Since Radiant Media Player 4.4.0 it is possible to use Shaka Player HLS streaming engine instead of hls.js. While hls.js offers more options using HLS through Shaka player notably provides support for HLS with DRM content. Default: 'hlsjs'. Other possible value is 'shakaplayer'.
shakaAbrDefaultBandwidthEstimate: Number
The default bandwidth estimate to use if there is not enough data available for the ABR logic (in bit/sec). Default: 500000.
shakaStreamingBufferBehind: Number
The maximum number of seconds of content that the player will keep in buffer behind the playhead when it appends a new media segment. The player will evict content to meet this limit. Default: 30.
shakaStreamingBufferingGoal: Number
The number of seconds of content that the player will attempt to buffer ahead of the playhead. This value must be greater than or equal to the shakaStreamingRebufferingGoal setting. Default: 20.
shakaStreamingRebufferingGoal: Number
The minimum number of seconds of content that the player must buffer before it can begin playback or can continue playback after it has entered into a buffering state. Default: 2.
shakaStreamingIgnoreTextStreamFailures: Boolean
If true, the player will ignore text stream failures and proceed to play other streams. Default: true.
shakaPreferredAudioLanguage: String
The preferred language to use for audio tracks. If not given it will use the 'main' track. This must be specified as a language code (example: 'en', 'de' or 'pt-BR') and must match a DASH or HLS manifest stream. See https://tools.ietf.org/html/rfc5646 and http://www.iso.org/iso/home/standards/language_codes.htm. Default: ''.
shakaBandwidthDowngradeTarget: Number
The largest fraction of the estimated bandwidth we should use. We should downgrade to avoid this. Default: 0.95.
shakaBandwidthUpgradeTarget: Number
The fraction of the estimated bandwidth which we should try to use when upgrading. Default: 0.75.
shakaSmallGapLimit: Number
The threshold (in seconds) for a gap to be considered small and jumped automatically. Default: 0.5. See here for more information.
shakaJumpLargeGaps: Boolean
If true, automatically jump large gaps. Default: true. See here for more information.
shakaRetryParameters: Object
This represents an Object to pass to the player to specify specific retry parameters when attempting to load DASH or HLS content. The same retry parameters will apply for fetching DRM, manifest or segment data. More information can be found here. The following example shows the default player parameter that should work for most case-scenario.
shakaRetryParameters: {
timeout: 0, // timeout in ms, after which we abort a request; 0 means never
maxAttempts: 2, // the maximum number of requests before we fail
baseDelay: 1000, // the base delay in ms between retries
backoffFactor: 2, // the multiplicative backoff factor between retries
fuzzFactor: 0.5, // the fuzz factor to apply to each retry delay
}
shakaRestrictions: Object
An object describing application restrictions on what tracks can play. All restrictions must be fulfilled for a track to be playable. If a track does not meet the restrictions, it will not appear in the track list and it will not be played. More
information can be found
here. The setting is set as follows (replace number with the targeted value).
shakaRestrictions: {
minWidth: number, // The minimum width of a video track, in pixels.
maxWidth: number, // The maximum width of a video track, in pixels.
minHeight: number, // The minimum height of a video track, in pixels.
maxHeight: number, // The maximum height of a video track, in pixels.
minPixels: number, // The minimum number of total pixels in a video track (i.e. width * height).
maxPixels: number, // The maximum number of total pixels in a video track (i.e. width * height).
minAudioBandwidth: number, // The minimum bandwidth of an audio track, in bit/sec.
maxAudioBandwidth: number, // The maximum bandwidth of an audio track, in bit/sec.
minVideoBandwidth: number, // The minimum bandwidth of a video track, in bit/sec.
maxVideoBandwidth: number // The maximum bandwidth of a video track, in bit/sec.
}
shakaRequestConfiguration: Object
This object allows the player to fine tune the way it request manifest, segment or DRM data. For manifest and segment this setting can be used to make requests with credentials. This will allow cookies in cross-site requests. See here for more information. Example:
shakaRequestConfiguration: {
manifest: {
credentials: true
},
segment: {
credentials: true
}
}
This setting is often used in conjunction with DRM-encrypted content. See our DASH & HLS DRM documentation page for more advanced use-case.
shakaCustomConfig: Object
Allow passing a custom config object to Shaka Player. As such any Shaka Player internal setting can be tuned. Note that this may override any setting previously documented on this page. Default: {}. Example:
shakaCustomConfig: {
abr: {
bandwidthDowngradeTarget: 0.95
bandwidthUpgradeTarget: 0.85
defaultBandwidthEstimate: 500000
enabled: true
switchInterval: 8
}
};
Refer to this link for more information about Shaka Player configuration.