2

estoy intentando hacer un autoplay de un video de youtube pero no me funciona.

<iframe width="100%" height="100%" src="https://www.youtube.com/embed/8UWkpgd8YJQ?autoplay=1&muted=1" frameborder="0" allow="autoplay" encrypted-media" allowfullscreen></iframe>

Gracias!

2

3 respuestas 3

1

¿Cómo funciona el nuevo atributo 'autoplay' en Chrome?

Chrome ya avisó con antelación de sus planes. La autoreproducción o “autoplay” de medios estaba haciendo que se reprodujeran vídeos de publicidad abusiva inesperadamente ante el usuario, además de un consumo excesivo de red y batería en los dispositivos.

Para solucionar esto, el navegador de Google se propuso en septiembre del 2017 poner fin a este tipo de problemas. Y así ha sido, aunque se ha retrasado dos versiones (se planeó lanzar en la release 64).

La nueva política en el navegador ha llegado en la release 66: ya no se reproducirá automáticamente ningún medio que produzca sonido. Este nuevo comportamiento ha generado fallos inesperados en miles de páginas y proyectos web, así como en juegos, causando quejas ante estas políticas por parte de los desarrolladores.

La autoreproducción se seguirá mantiendo si se cumplen alguno de los siguientes casos:

  • Si el vídeo no produce sonido
  • Si el usuario ha interactuado por el dominio antes de visualizar el vídeo
  • Si el usuario ha agregado el sitio a su pantalla de inicio (solo en móviles)
  • Si tu sitio web está en la “whitelist” o lista blanca de más de 1000 sitios web que ha generado Google, como por ejemplo Youtube.
  • Si el usuario ha cruzado el umbral del índice de interacción con los medios (MEI)

El MEI mide la propensión de un usuario ante el consumo de medios en un sitio web. Este cálculo que se realiza en Chrome se hará efectivo si se cumplen las siguientes condiciones:

  • Si el consumo del medio es mayor a 7 segundos
  • Si el audio está activado y no silenciado
  • Si la pestaña del medio está activa y no en segundo plano
  • Si el tamaño del vídeo supera los 200x140 px.

En caso de que se cumplan, Chrome puntuará el MEI en tu sitio web. Cuando es lo suficientemente alto, la reproducción automática en tu web se hará efectiva.

Como usuario de Chrome puedes visualizar tu propio MEI en la página interna

chrome://media-engagement.

Cómo afecta la nueva política de autoplay a desarrolladores y usuarios de portales Drupal En general, para todos los usuarios de portales Drupal es un cambio a mejor, ya que se evita el uso excesivo de batería y red en los dispositivos al reproducirse de forma autónoma vídeos no deseados.

Sin embargo, en la otra cara de la moneda se encuentra el mundo del desarrollo, donde miles de Drupal que no siguan teniendo soporte actualmente, quedarán sin la visualización de vídeos o juegos que nunca se reproducirán, cayendo en el abismo de páginas web destruidas por la temible política de la release 666... al menos en Google Chrome.

Sin embargo, si estás trabajando actualmente en el desarrollo de un portal en Drupal, tienes a su disposición algunas soluciones, que veremos a continuación. Cómo usar la autoreproducción de medios correctamente en Drupal

Para usar la reproducción automática de medios en Drupal para que sea compatible con todos los navegadores, podemos tomar diferentes caminos.

Desactivar la política a la hora de desarrollar Para desarrollar en Drupal es normal que queramos deshabilitar de manera local esta política. Para desactivarla, lo haremos desde el enlace interno chrome://flags/#autoplay-policy

desactivar autoplay de chrome para desarrolladores

Mutear el medio Como ya mencionamos anteriormente, un medio que no produzca sonido puede reproducirse automáticamente. Si hacemos uso del atributo “muted” podemos silenciar un vídeo en html5 y lograr que funcione el autoplay.

<video autoplay muted="muted">

<source src="/themes/custom/project/video/myvideo.mp4" type="video/mp4">

</video>

Dejar decidir al usuario Una forma que ya están usando páginas web como Facebook, Instagram, Twitter y Youtube, consiste en reproducir el vídeo sin sonido y dejar decidir al usuario cuándo desactivar el silencio.

<video id="video" muted autoplay>

<button id="unmuteButton"></button>

<script>

unmuteButton.addEventListener('click', function() {

video.muted = false;

});

</script>

Todas estas políticas están abiertas a cambios por parte de Google Chrome, pero por el momento las cosas seguirán así un largo periodo de tiempo.

Es importante destacar, que nunca hay que dar por hecho que un vídeo se reproducirá en nuestro Drupal, ya que eso siempre (y cada vez más) va a ser decisión del usuario final.

0

Puedes ejecutar el autoplay agregando a la url los parametros ?autoplay=1&mute=1&loop=1. Para que la reproducción automática funcione es obligación que el vídeo se reproduzca sin audio.

En este caso el código seria el siguiente:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>
<body>
    <iframe width="100%" height="100%" src="https://www.youtube.com/embed/8UWkpgd8YJQ?autoplay=1&mute=1&loop=1" frameborder="0" allow="autoplay" encrypted-media allowfullscreen></iframe>
</body>
</html>
0

Puedes usar esto para loop y auto play con iframe

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>
<body>
    <iframe width="100%" height="100%" src="https://www.youtube.com/embed/OtqBf9IRFW4?autoplay=1&loop=1&mute=1&controls=0&playlist=OtqBf9IRFW4" frameborder="0" allow="autoplay"  encrypted-media allowfullscreen></iframe>
</body>
</html>
2
  • Hola Mijael, tu respuesta no cumple con los estandares de SOes, te recomiendo que la elimines, a fin de evitar votos negativos, Commented el 7 feb. 2023 a las 22:39
  • Mira como responder para evitar votos negativos y/o que tu repuesta sea eliminada. Mira Cómo preguntar para que tu pregunta sea mejor recibida y obtengas una mejor respuesta, y de paso evitar votos negativos y/o que tu pregunta sea eliminada. Aprovecha y haz el recorrido de Bienvenida para entender mejor cómo funcionamos y de paso obtener tu primer medalla! Commented el 7 feb. 2023 a las 22:39

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.