Muted Autoplay in Chrome still not working

Question

I am having trouble getting chrome to autoplay a video. I have set the video to muted and it auto plays in both Safari and Firefox but not chrome.

Answer 1

You can use oncanplay="this.muted=true" on your video tag

<video  muted loop autoplay oncanplay="this.muted=true">
    <source src="your src" type="video/mp4">
    Your browser does not support HTML5 video.
</video>

Answer 2

The example below, with minimal change from your code, plays in chrome (Version 62.0.3202.94 ) on a Mac (10.12.6):

<video autoplay muted poster="path to video" id="bgvid">
    <source src="http://clips.vorwaerts-gmbh.de/VfE_html5.mp4" type="video/mp4">
</video>  

It may be that Safari and Friefox are playing the mp4 and chrome the webm, and the issue related to the webm video itself rather than your HTML5 code.

Answer 3

Although @richard-lindner's solution didn't work for me, it put me on the right track.

In my case, although the muted attribute was present, Chrome was ignoring it and failing silently unless it was also explicitly set in javacript e.g.

var video = document.getElementById("myVideo");
video.oncanplaythrough = function() {
    video.muted = true;
    video.play();
}

Interestingly, forcing the autoplay using javascript but ommitting the video.muted = true line did display the autoplay policy error in the console, suggesting Chrome is indeed ignoring the muted attribute in some cases. This to me feels like a bug with Chrome's autoplay policy.

Note that the error occurred only when the video was not cached. If it was cached, autoplay worked as expected.

Answer 4

For those creating elements in JavaScript, here is the JavaScript function I'm using to configure elements to autoplay properly in Chrome:

function configureVideoElementForAutoplay (videoElement) {
  videoElement.setAttribute('playsinline', '');
  videoElement.setAttribute('muted', '');
  videoElement.setAttribute('autoplay', '');
  videoElement.muted = true;
}

Example:

let vid = document.createElement('video');
configureVideoElementForAutoplay(vid);

Credit to @Jonny Green for pointing out the necessity of the direct 'muted' property assignment.

Answer 5

Main answer worked with me - but just in case anyone is trying to get it to work on apple phones you must use the "playsinline" attribute for it to work. for example:

<video playsinline autoplay muted loop id="myVideo">
        <source src="xen.mp4" type="video/mp4">
    </video>