iOS and Brightcove Player
Auto playing a video
Given that the concern of possible unwanted segments being downloaded is not an issue, you can autoplay a video. For this to occur you must do the the following:
- Add the
autoplay
attribute. For the iframe embed code, set this attribute totrue
. - Add the
playsinline
attribute. For the iframe embed code, set this attribute totrue
. - Add the
muted
attribute. For the iframe embed code, set this attribute totrue
. Alternatively, you can use a video with no sound track.
In-page embed code implementation:
<video-js data-video-id="5045678908001"
data-account="1752604059001"
data-player="default"
data-embed="default"
data-application-id
autoplay playsinline muted
controls></video-js>
<script src="https://players.brightcove.net/1752604059001/default_default/index.min.js"></script>
iframe embed code implementation:
<iframe src="https://players.brightcove.net/1752604059001/default_default/index.html?
videoId=5811862231001&autoplay=true&muted=true&playsinline=true"
allowfullscreen
allow="encrypted-media"></iframe>
For a full discussion of autoplay, see the Autoplay Considerations document.
Playing a video non-fullscreen
To play a video non-fullscreen, you must perform the following step:
- Set the
playsinline
attribute totrue
.
With iOS 10 and later, the playsinline
attribute allows Brightcove Player to start playback without forcing full screen. Viewers can play an embedded video, and it will not automatically go to full screen. This is the default behavior for iOS.
When a viewer starts video playback and then goes to full screen, video playback is not interrupted.
Playing a video fullscreen
When a user switches from inline playback to fullscreen mode, the iOS native player is used instead of the Brightcove Player, with the following one exception:
- iPad with Safari 12 running on iOS 12, which will automatically run Brightcove Player.
Using the native player allows the player to take advantage of the entire device screen. Obviously, with the Brightcove Player controls removed, some functionality could potentially be lost. If you wish NOT to allow fullscreen, but only for iOS devices, you could use the following code:
<script>
videojs.getPlayer('myPlayerID').ready(function() {
var myPlayer = this,
fullScreenElement = document.getElementsByClassName("vjs-fullscreen-control")[0];
if (videojs.browser.IS_IOS ) {
fullScreenElement.parentNode.removeChild(fullScreenElement);
}
});
</script>
Stop unwanted segment download
It is possible that iOS may download unwanted segments causing excessive bandwidth usage. In the situation where autoplay
is enabled, segments will be downloaded even if preload
is set to none
. The only way to prevent this is to not use the autoplay
attribute.