TL;DR with the release of desktop Chrome 66+, Firefox 66+ and Safari 11+ autoplay with sound is becoming widely unavailable or restricted in the web industry. Our player will automatically detect which autoplay mode is available (with sound, muted or no autoplay) based on device capabilities and user settings. On mobile devices (iOS, Android) autoplay with sound is never available, only muted autoplay is possible.
Autoplay (or autostart) allows media content or pre-roll advertisement to start without the need for a user interaction - most of the time autoplay happens when page loads.
Radiant Media Player provides support for autoplay of media content or pre-roll advertisement with live, DVR & on-demand streaming. Autoplay works with all supported streaming protocols (HLS, MPEG-DASH or progressive download). Muted autoplay of outstream video ads is also supported.
Years of autoplay with sound misusage in the industry have caused viewers to grow weary of autoplaying video with sound. Major actors in the industry have picked up on this trend and new autoplay policies are being rolled out into major browsers and devices. Those new policies tend to limit autoplay capabilities while pointing at muted autoplay as the new standard for autoplaying video content, be it for mobile or desktop devices. Desktop Safari 11+ and Firefox 66+ will allow for exceptions for autoplay with sound to run, on a site-by-site basis: those exceptions need to be set by the user through browser settings. On Desktop Chrome 66+, Chrome may allow for autoplay with sound to run based on Chrome Media Engagement Index (MEI): in short, frequently visited sites by the user will allow autoplay with sound, while other sites will be restricted to muted autoplay.
In Ionic, Flutter or Apache Cordova applications autoplay with sound is generally allowed but you may need to insure your application is compiled with the related appropriate settings for autoplay.
The below player settings can help fine tuning your autoplay set up.
Note about un-muting: these new autoplay policies in Chrome 66+, Firefox
66+ and Safari 11+ also affect un-muting of video content
or video ads. Specifically a mouseenter
or mouseover
event is
not enough anymore to
un-mute content if the user has not interacted with document prior to un-muting (this
would cause the player
to pause and throw a warning in the browser console). A full click
or
touchend
event is now required.
<!-- Include Radiant Media Player JavaScript file in your <body> or <head> --> <script src="https://cdn.radiantmediatechs.com/rmp/10.1.4/js/rmp.min.js"></script> <!-- Player container element --> <div id="rmp"></div> <script> // Your streaming source - HLS in this example const src = { hls: 'https://your-hls-url.m3u8' }; // Your player settings const settings = { licenseKey: 'your-license-key', src, width: 640, height: 360, // Enables autoplay autoplay: true, contentMetadata: { poster: [ 'https://your-poster-url.jpg' ] } }; const rmp = new RadiantMP('rmp'); // Player initialisation async function initRmpPlayer() { try { await rmp.init(settings); } catch (error) { console.error('Radiant Media Player failed to initialize', error); } } initRmpPlayer(); </script>
Low power mode on iOS 12+
According to our testing when an iOS 12+ device is in low power mode autoplay even muted is forbidden by the OS. Radiant Media Player will properly handle autoplay requests when low power mode is engaged in iOS 12+ by providing a play button to initiate playback (a user interaction will be needed in such case as autoplay would have failed).
autoplay: Boolean
Command the player to autoplay content when init method is called. If a pre-roll advertisement is available,
the pre-roll ad will be autoplayed. Default: false
.
requestAutoplayCapabilitiesData: Boolean
When autoplay
is set to false you may still have a need to know the autoplay capabilities of a
specific device. For example you may want to call play
method on the player programmatically
without a need for a user interaction. In that case you could want to know which autoplay mode is available
through getAutoplayResult
API method to mute the player before calling play (when muted
autoplay is only available) to reach a successful play. Default: false
.
detectAutoplayTimeout: Number
Timeout in milliseconds for autoplay to force complete checking.
Default: -1
(2500ms in desktop environment, 5000ms in
mobile environment).
srcChangeAutoplay: Boolean
When using the setSrc
API method this setting allows to control
the behaviour of player after srcchanged
event has fired (or when setSrc
resolves).
When set to true this setting will cause content to autoplay just source change. When set to false the player
will remain in a pause state after source change. Default: true
.
autoplayCount: Number
Limits the number of autoplay across browser sessions (using localStorage).
You may use the resetAutoplayCount
API method to reset
autoplayCount
.
Default: Infinity
.
autoplaysuccess
Fires when autoplay
setting is set to true and autoplay of content or pre-roll ad was a success.
autoplayfailure
Fires when autoplay
setting is set to true and autoplay of content or pre-roll ad was a failure
(likely due to an autoplay interference engine).
autoplaymodedetected
Fires when player has finished to evaluate the autoplay mode supported by the targeted device. Use
getAutoplayResult
getter to read value of that autoplay mode.
getAutoplayResult()
Promise.<string>
rmp.getAutoplayResult().then(autoplayResult => { console.log(`autoplayResult is ${autoplayResult}`); }).catch(warning => { console.warn(warning); });
Returns a Promise that resolves to autoplayResult (String - 'autoplay-with-sound' | 'muted-autoplay' | 'no-autoplay'). Can be queried before ready event. This method never rejects.
resetAutoplayCount()
Reset autoplay count set through the autoplayCount
setting.
With the release of Chrome 65, autoplay of HTML5 video content in an iframe has been disabled by default. It must be enabled through autoplay feature policy. This change in autoplay policy for iframes means that an iframe holding an HTML5 video player needs to be explicitly allowed to autoplay by the parent window. This is the same in principle as what we have done in the past for allowing an iframe to go fullscreen. If you are using an iframe within an iframe then each iframe needs to be explicitly allowed to autoplay. Note that autoplay is allowed by default on same-origin iframes so enabling autoplay feature policy is only required for cross-origin iframe. Example:
<iframe width="640" height="360" title="Video content" src="http://www.mydomain.com/embedded-player.html" style="border:none;" allowfullscreen sandbox="allow-scripts allow-presentation allow-same-origin" allow="autoplay; fullscreen; picture-in-picture; xr-spatial-tracking; encrypted-media; clipboard-write"></iframe>
We have tested this set-up when Radiant Media Player is used in an
iframe and can confirm this is generally working for
Chrome 65+. It is likely other browsers will implement this feature as well in the
near future. In case autoplay is blocked due to autoplay feature policy, Radiant Media
Player shall provide a play button so that playback can be initiated by a
user gesture, in such case the autoplayfailure
API event shall fire. You
should also note the need to use the allowfullscreen
attribute in complement to the
allow
attribute in order to support browsers that do not support
allow
attribute.
If you are using amp-iframe and autoplay you need to add
allow="autoplay"
to your amp-iframe element
©2015-2025 Radiant Media Player. All Rights Reserved. ✝