Incorporar vídeos do Bunny Stream não funciona

Olá

Estou tentando incorporar vídeos do bunny.net Stream no meu fórum, mas não funciona.

O link direto mostra apenas uma prévia da imagem:

e o código de incorporação com iframe não mostra nada:

:setadown:

:setaAcima:

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>

Você adicionou https://iframe.mediadelivery.net/embed/ à configuração do site iframes permitidos antes de postar?

Acho que isso simplesmente ainda não é suportado pelo Discourse como um Onebox.

No entanto, o iframe funciona (embora pequeno);:

Lembre-se de adicionar https://iframe.mediadelivery.net/embed/ à sua configuração allowed iframes :slight_smile:


Droga, literalmente 1 segundo atrasado :smile:

Obrigado Falco e Coin-coin!

Vou marcar esta postagem como Resolvida, mas uma última pergunta.

Bunny sugere este código para "não 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>

Mas o tamanho não é o bom:

E 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>

E o tamanho é muito pequeno

Alguma sugestão?

Não tenho certeza se um iframe aqui pode redimensionar o vídeo adequadamente.

Os atributos de estilo são removidos da tag <iframe>, portanto, definir tamanhos aqui não terá efeito, a menos que você adicione o CSS ao seu próprio tema. Mas isso não fará milagres.

Se você definir a largura do iframe como 100% do contêiner da postagem, ele será renderizado assim:

E você não pode definir uma altura automática que dependa da proporção do vídeo.

Acho que não há uma solução direta além de usar o vídeo pequeno (não inclua a parte <div style="position: relative; padding-top: 56.25%;">, pois ela será removida quando você postar de qualquer maneira), e as pessoas que quiserem ver o vídeo em um formato maior clicarão no ícone de tela cheia no canto inferior direito do vídeo.

Você também pode postar em Contribute > Feature para perguntar se poderia ser criado um suporte de onebox para vídeos do Bunny Stream, mas, a menos que haja uma alta demanda (o que duvido), isso provavelmente pertencerá à tag pr-welcome, o que significa que a equipe não adicionará o recurso sozinha, mas qualquer pessoa com algum conhecimento de programação é bem-vinda para codificar esse recurso para que ele possa ser adicionado ao Discourse eventualmente.

Obrigado Coin-coin

Finalmente vou usar essa configuração no código do iframe do Bunny:

  • não selecionar para código responsivo
    image

  • No código padrão a seguir, substitua o tamanho 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>

A altura será um pouco pequena no desktop e um pouco alta no smartphone, mas a largura ficará ok.

Onebox seria ótimo, mas pelo que vejo, temos apenas youtube, vimeo e TikTok por enquanto no discourse.