URLs de incorporação do Vimeo analisadas incorretamente no email

O Vimeo fornece dois tipos de URLs: links diretos (https://vimeo.com/508864124/fcbbcc92fa) e links de incorporação (que podem ser usados em um iframe, mas não funcionarão se clicados diretamente)

Por exemplo:

<iframe src="https://player.vimeo.com/video/508864124?h=fcbbcc92fa" width="640" height="360" frameborder="0" allow="autoplay; fullscreen; picture-in-picture" allowfullscreen></iframe>
  1. Quando isso é enviado como um e-mail de notificação, o link direto aparece corretamente, mas o iframe é substituído por um link com a URL errada: https://vimeo.com/508864124?h=fcbbcc92fa em vez de https://player.vimeo.com/video/508864124?h=fcbbcc92fa

    Pior ainda, se uma barra final (válida) for adicionada na URL de incorporação, o ID do vídeo é removido no e-mail: <iframe src="https://player.vimeo.com/video/508864124/?h=fcbbcc92fa" ...></iframe> se torna https://vimeo.com/?h=fcbbcc92fa

  2. Existe alguma maneira de contornar a conversão de iframe para URL completamente? Assim como já fazemos com enquetes, diz algo como “Clique aqui para ver a enquete”

Complicado, temos alguma mágica especial para alterar como remapeamos o cozimento para processos de e-mail que podemos limpar, com certeza.

Por enquanto, colocarei um pr-welcome e considerarei priorização adicional se isso surgir mais algumas vezes.

1 curtida

[quote=“Nacho Caballero, post:1, topic:231042, username:Nacho_Caballero”]
Existe alguma forma de contornar a conversão de iframe para URL por completo? Assim como já fazemos com as enquetes, diz algo como “Clique aqui para ver a enquete”.
[/quote]Obrigado, Sam. Você consegue pensar em alguma solução alternativa temporária para impedir que as pessoas vejam o URL no e-mail sem ter que escondê-lo em uma tag [details]?

Sinceramente, não consigo pensar em muitas soluções alternativas aqui, a não ser talvez forçar um link que não seja “oneboxed” abaixo dele?

https://vimeo.com/185876954
<https://vimeo.com/185876954>

https://vimeo.com/185876954
https://vimeo.com/185876954

1 curtida

@Nacho_Caballero O exemplo que você forneceu de um vídeo não listado, vídeos não listados têm uma estrutura de URL diferente.

E a forma de incorporar um vídeo não listado, conforme solicitado pela Vimeo, é diferente, consulte Use oEmbed with private videos – Vimeo Help Center

Acho que uma solução pode ser criar seu próprio embed usando o documento acima.

@sam
E para o Discourse, seria melhor talvez usar a API da Vimeo para obter o URL de origem do embed em vez de construí-lo. Consulte https://stackoverflow.com/questions/51414260/vimeo-url-ive-never-seen-before-with-two-different-ids-how-do-i-get-it-to-work. E essas linhas são relevantes discourse/lib/onebox/engine/vimeo_onebox.rb at 657256a099a601a0694d11d15c42ad76988efe8c · discourse/discourse · GitHub

De qualquer forma, se minha especulação estiver correta, isso afetará a postagem típica, não apenas o e-mail: 1-Minute Audio Test for Stereo Speakers &amp; Headphones-2ZrWHtvSog4

Para obter o iframe, fiz:

GET https://vimeo.com/api/oembed.json?url=https://vimeo.com/508864124/fcbbcc92fa
Então obtive

{\"type\":\"video\",\"version\":\"1.0\",\"provider_name\":\"Vimeo\",\"provider_url\":\"https:\\/\\/vimeo.com\\/\",\"html\":\"\u003ciframe src=\\\"https:\\/\\/player.vimeo.com\\/video\\/508864124?h=fcbbcc92fa\u0026amp;app_id=122963\\\" width=\\\"426\\\" height=\\\"240\\\" frameborder=\\\"0\\\" allow=\\\"autoplay; fullscreen; picture-in-picture\\\" allowfullscreen\u003e\u003c\\/iframe\u003e\",\"width\":426,\"height\":240,\"domain_status_code\":403,\"video_id\":508864124,\"uri\":\"\\/videos\\/508864124:fcbbcc92fa\"}

Decodificado em UTF-8: para o iframe

<iframe src="https://player.vimeo.com/video/508864124?h=fcbbcc92fa&amp;app_id=122963" width="426" height="240" frameborder="0" allow="autoplay; fullscreen; picture-in-picture" allowfullscreen></iframe>

O próprio iframe

Editar/Atualizar:

Enviei um PR para corrigir, acho que o problema foi com o padrão regex. Ele não capturou o vimeo corretamente quando não é o tipo padrão. Assim, alterei o padrão regex de acordo.

1 curtida

@ghassan Acabei de notar que isso ainda é um problema.

Se um iframe tiver um vídeo não listado, o URL não é transformado corretamente no e-mail. Por exemplo:

<iframe src="https://player.vimeo.com/video/508864124?h=fcbbcc92fa" width="640" height="360" frameborder="0" allow="autoplay; fullscreen; picture-in-picture" allowfullscreen></iframe>

É transformado nisso (que é um 404): https://vimeo.com/508864124?h=fcbbcc92fa
Em vez do URL correto: https://vimeo.com/508864124/fcbbcc92fa

Talvez a regex que você adicionou em seu PR precise de um passo extra (transformar ?h= em / ao enviar um e-mail)

Para que eu possa entender melhor,

  • Existem diferentes formatos de URL do Vimeo, nosso único problema é com o lado do e-mail, certo?
  • Para replicar isso, o que é preciso fazer:
    • Colar URL ou iframe no tópico (Quais são todos os casos disso)
    • Deve funcionar como esperado na web, mas se um e-mail for enviado com o conteúdo do tópico, então fica complicado

Sim. A alteração da regex que você fez possibilitou o reconhecimento de URLs de iframe src (https://player.vimeo.com/video/508864124?h=fcbbcc92fa), então isso não é mais um problema. O problema está no e-mail que é enviado.

Se você colar uma URL simples (https://vimeo.com/508864124/fcbbcc92fa), não há problema. É apenas um problema com o iframe src (https://player.vimeo.com/video/508864124?h=fcbbcc92fa).

Atualmente funciona.

Sim. Atualmente, o iframe src (https://player.vimeo.com/video/508864124?h=fcbbcc92fa) é convertido para isto: https://vimeo.com/508864124?h=fcbbcc92fa em vez disto: https://vimeo.com/508864124/fcbbcc92fa

Ainda é difícil para mim reproduzir porque preciso ter uma conta premium para ter um vídeo não listado no Vimeo.

Além disso, acho que seu exemplo de vídeo acima permite apenas que ele seja carregado de um determinado domínio. Você pode permitir que minha instância sandbox o carregue também: https://discuss.gsgapp.io.

Novamente e para ser cristalino, você não espera que o vídeo seja reproduzido no e-mail, mas espera que, quando as pessoas clicarem na posição do vídeo, sejam direcionadas para a URL correta? Estou certo quanto a isso?

Feito :+1:

Correto :+1:

Obrigado pela ajuda!

Aha, encontrei o problema agora:

O que está acontecendo é que, ao colar o código iframe vanilla, você pode ignorar o código onebox e, se o ignorar, o código iframe resultante não terá data-original-href, que é o link usado no template de e-mail.

E quando data-original-href está faltando, o Discourse tenta adivinhar o vídeo, que é qualquer coisa após a última /, o que, claro, não cobre o caso de vídeo não listado.

Por exemplo, se você verificar as ferramentas de desenvolvedor/inspecionar elemento do seu navegador, o código iframe resultante ao usar o código iframe vanilla:

<iframe> src="https://player.vimeo.com/video/508864124?h=fcbbcc92fa" width="640" height="360" frameborder="0" allow="autoplay; fullscreen; picture-in-picture" allowfullscreen></iframe>

<iframe> src="https://player.vimeo.com/video/508864124?h=fcbbcc92fa" width="640" height="360" frameborder="0" allow="autoplay; fullscreen; picture-in-picture" allowfullscreen=""></iframe>

Enquanto ao colar apenas o URL, ou seja, deixar o Discourse convertê-lo para iframe
https://vimeo.com/508864124/fcbbcc92fa.

<iframe> class="vimeo-onebox" src="https://player.vimeo.com/video/508864124?h=fcbbcc92fa&amp;app_id=122963" data-original-href="https://vimeo.com/508864124/fcbbcc92fa" frameborder="0" allowfullscreen="" seamless="seamless" sandbox="allow-same-origin allow-scripts allow-forms allow-popups allow-popups-to-escape-sandbox allow-presentation"></iframe>

Portanto, note o data-original-href="https://vimeo.com/508864124/fcbbcc92fa" extra na segunda saída, pode-se adivinhar que se o atributo, ao usar iframe vanilla, deveria funcionar, mas provavelmente não funciona porque o Discourse não permite que você adicione qualquer atributo que desejar…

Acho que posso sugerir uma solução, e enquanto garanto que funcionaria para o caso em que o vídeo está listado/público, cheguei a este comportamento incomum do Vimeo. Normalmente, todos os vídeos públicos seguem este padrão vimeo.com/{id}, no entanto, funcionará se você adicionar uma barra, ou seja, vimeo.com/{id}/qualquercoisa

Considere o seguinte exemplo:

  • https://vimeo.com/767548129/estgsetgset
  • https://vimeo.com/767548129/hey-discurse
  • https://vimeo.com/767548129 O normal

Todos os exemplos acima levam ao mesmo vídeo, então a correção pode ser criar uma URL a partir do iframe src, vimeo.com/{o que vem depois da primeira barra}/{O que vem de h=}. Isso fará com que funcione para ambos os casos.

A correção proposta em FIX: vimeo iframe url when data-original-href is missing by ghassanmas · Pull Request #18894 · discourse/discourse · GitHub, você também pode experimentá-la em https://discuss.gsgapp.io onde selecionei meu commit.

Eu testei pessoalmente para 4 casos:

  • colando url do vimeo de vídeo público
  • colando url do vimeo de vídeo não listado
  • colando iframe vanilla de vídeo público
  • colando iframe vanilla de vídeo não listado

Em todos os casos, isso levou o e-mail a gerar o url correto.

Mas, de qualquer forma, por favor, tente testar todas as outras variações possíveis que você possa encontrar e, o mais importante, que isso não quebre outras coisas.

A maneira como testei o template de e-mail foi enviando uma mensagem direta para mim mesmo e, em seguida, verificando a caixa de entrada de e-mail. (Como tenho duas contas registradas em https://discuss.gsgapp.io)

2 curtidas

Obrigado! Testei também e funciona :+1:

testando:

Já foi mesclado