Incrustar videos de Bunny Stream no funciona

[alexmas]

Hola

Estoy intentando incrustar videos de bunny.net Stream en mi foro, pero no funciona.

El enlace directo solo muestra una vista previa de la imagen:

404 Video Not Found

y el código de incrustación con iframe no muestra nada:

código:

<div style="position: relative; padding-top: 56.25%;"><iframe src="https://iframe.mediadelivery.net/embed/3639/01bea422-9687-4058-9fcc-2b21dee6df2a?autoplay=false&preload=false" loading="lazy" style="border: none; position: absolute; top: 0; height: 100%; width: 100%;" allow="accelerometer; gyroscope; autoplay; encrypted-media; picture-in-picture;" allowfullscreen="true"></iframe></div>

[Falco]

¿Añadió https://iframe.mediadelivery.net/embed/ a la configuración del sitio iframes permitidos antes de publicar?

[Canapin (Coin-coin le Canapin)]

Creo que esto simplemente no es compatible todavía con Discourse como un Onebox.

Sin embargo, el iframe funciona (aunque pequeño);:

Recuerda añadir https://iframe.mediadelivery.net/embed/ en tu configuración de allowed iframes

---

Maldición, literalmente 1 segundo tarde

[alexmas]

¡Gracias Falco y Coin-coin!

Marcaré esta publicación como Resuelta, pero una última pregunta.

Bunny sugiere este código para "no responsivo":

<iframe src="https://iframe.mediadelivery.net/embed/3639/01bea422-9687-4058-9fcc-2b21dee6df2a?autoplay=false&preload=false" loading="lazy" width="1280" height="720" style="border: none;" allow="accelerometer; gyroscope; autoplay; encrypted-media; picture-in-picture;" allowfullscreen="true"></iframe>

Pero el tamaño no es el correcto:

Y este código para "responsivo":

<div style="position: relative; padding-top: 56.25%;"><iframe src="https://iframe.mediadelivery.net/embed/3639/01bea422-9687-4058-9fcc-2b21dee6df2a?autoplay=false&preload=false" loading="lazy" style="border: none; position: absolute; top: 0; height: 100%; width: 100%;" allow="accelerometer; gyroscope; autoplay; encrypted-media; picture-in-picture;" allowfullscreen="true"></iframe></div>

Y el tamaño es demasiado pequeño

¿Alguna sugerencia?

[Canapin (Coin-coin le Canapin)]

No estoy seguro de que un iframe aquí pueda redimensionar el video correctamente.

Los atributos de estilo se eliminan de la etiqueta <iframe>, por lo que establecer tamaños aquí no tendrá ningún efecto, a menos que agregues CSS en tu propio tema. Pero no hará milagros.

Si estableces el ancho del iframe al 100% del contenedor de la publicación, se renderizará así:

Y no puedes establecer una altura automática que dependa de la relación de aspecto del video.

Creo que no hay una solución sencilla aparte de usar el video pequeño (no pongas la parte <div> ya que se eliminará cuando publiques de todos modos), y las personas que quieran ver el video en un formato más grande harán clic en el ícono de pantalla completa en la esquina inferior derecha del video.

También puedes publicar en Feature para preguntar si se podría crear un soporte de onebox para videos de Bunny stream, pero a menos que haya una gran demanda (lo cual dudo), probablemente pertenecerá a la etiqueta pr-welcome, lo que significa que el equipo no agregará la función ellos mismos, pero cualquiera con un poco de conocimiento de codificación es bienvenido a codificar esta función para que pueda agregarse a Discourse eventualmente.

[alexmas]

Gracias Coin-coin

Finalmente voy a usar esa configuración en el código del iframe de Bunny:

• no seleccionar para código responsivo
  

• En el código predeterminado siguiente, reemplaza el tamaño por width=“99%” height=“300”

<iframe src="https://iframe.mediadelivery.net/embed/3639/01bea422-9687-4058-9fcc-2b21dee6df2a?autoplay=false&preload=false" loading="lazy" width="1280" height="720" style="border: none;" allow="accelerometer; gyroscope; autoplay; encrypted-media; picture-in-picture;" allowfullscreen="true"></iframe>

La altura será un poco pequeña en el escritorio y un poco alta en el smartphone, pero el ancho estará bien.

Onebox sería genial, pero por lo que veo, solo tenemos YouTube, Vimeo y TikTok por ahora en Discourse.