Comment gérer « Uncaught (in promise) DOMException : play() a échoué car l'utilisateur n'a pas d'abord interagi avec le document sur le bureau à l'aide de Chrome 66 ?

Question

J'ai reçu un message d'erreur..

Non capturé (promis) DOMException : play() a échoué car l'utilisateur n'a pas d'abord interagi avec le document.

..Lorsque vous essayez de lire une vidéo sur un ordinateur à l'aide de Chrome version 66.

J'ai trouvé une annonce dont la lecture a démarré automatiquement sur le site, mais avec le code HTML suivant :

<vidéo
    title="Publicité"
    webkit-playsinline="true"
    joue en ligne = "true"
    style="couleur de fond : rgb(0, 0, 0); position : absolue; largeur : 640 px; hauteur : 360 px ;"
    src="http://ds.serving-sys.com/BurstingRes/Site-2500/Type-16/1ff26f6a-aa27-4b30-a264-df2173c79623.mp4"
    autoplay=""></video>

Contourner le bloqueur de lecture automatique de Chrome v66 est très simple, ajoutez simplement webkit-playsinline="true", playsinline="true"autoplay=" " attribut des éléments code> et  ? Est-ce que cela aura des conséquences négatives ?

Answer 1

Pour créer une lecture automatique d'un élément HTML 5 après la mise à jour de Chrome 66, il vous suffit d'ajouter l'attribut muted à l'élément vidéo.

Donc, votre vidéo HTML actuelle

<video
    title="Advertisement"
    webkit-playsinline="true"
    playsinline="true"
    style="background-color: rgb(0, 0, 0); position: absolute; width: 640px; height: 360px;"
    src="http://commondatastorage.googleapis.com/gtv-videos-bucket/sample/BigBuckBunny.mp4"
    autoplay=""></video>

Juste besoinmuted="muted"

<video
    title="Advertisement"
    style="background-color: rgb(0, 0, 0); position: absolute; width: 640px; height: 360px;"
    src="http://commondatastorage.googleapis.com/gtv-videos-bucket/sample/BigBuckBunny.mp4"
    autoplay="true"
    muted="muted"></video>

Je pense que la mise à jour de Chrome 66 tente d'empêcher les onglets de faire du bruit aléatoire sur les onglets des utilisateurs. C'est pourquoi l'attribut muet permet à la lecture automatique de fonctionner à nouveau.