This guide demonstrates how to use "autoplay" videos.

Playback starts automatically as soon as enough media is available.

Note: Some browsers offer users the ability to override autoplay in order to prevent disruptive audio or video from playing without permission or in the background.

Autoplay of a video

Without any parameter, the autoplay() function tries to play the video. In case the video audio is blocked (what is the default by most browsers), the player tries to play the video muted.

<!-- Movingimage iframe embedding -->
<iframe
  style="border: none; width: 100%; aspect-ratio: 16/9;"
  src="//e.video-cdn.net/watch?video-id=123&player-id=123&channel-id=123"
  allowfullscreen
  allow="autoplay; clipboard-write; encrypted-media; picture-in-picture; web-share;"
  frameborder="0">
</iframe>

<script type="module">
  import { Player } from 'https://e.video-cdn.net/mi-player-sdk/mi-player-sdk.js';

  // Connect the SDK to the player
  const player = new Player('mi-embedded-video');

  // Call autoplay function
  player
    .autoplay()
    .then(() => {
      console.log(`Video is playing: ${player.getVideoId()}`);
    })
    .catch((error) => {
      console.error(`Error autoplay video: ${player.getVideoId()}`, error);
    });
</script>
Copy

Autoplay of a video muted

Usually, autoplay videos can be an unpleasant experience for the user. To just play a video muted, set the 'muted' parameter and the video tries to play the video muted.

<!-- Movingimage iframe embedding -->
<iframe
  style="border: none; width: 100%; aspect-ratio: 16/9;"
  src="//e.video-cdn.net/watch?video-id=123&player-id=123&channel-id=123"
  allowfullscreen
  allow="autoplay; clipboard-write; encrypted-media; picture-in-picture; web-share;"
  frameborder="0">
</iframe>

<script type="module">
  import { Player } from 'https://e.video-cdn.net/mi-player-sdk/mi-player-sdk.js';

  // Connect the SDK to the player
  const player = new Player('mi-embedded-video');

  // Call autoplay function with parameter 'muted'
  player
    .autoplay('muted')
    .then(() => {
      console.log(`Video is playing: ${player.getVideoId()}`);
    })
    .catch((error) => {
      console.error(`Error autoplay video: ${player.getVideoId()}`, error);
    });
</script>
Copy