Les URL d'intégration de Vimeo sont analyséesIncorrectement dans l'e-mail

Nacho_Caballero · Juin 24, 2022, 5:56

Vimeo fournit deux types d’URL : des liens directs (https://vimeo.com/508864124/fcbbcc92fa) et des liens d’intégration (qui peuvent être utilisés dans une iframe, mais ne fonctionneront pas si on clique dessus directement)

Par exemple :

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

Lorsque cela est envoyé dans un e-mail de notification, le lien direct apparaît correctement, mais l’iframe est remplacé par un lien avec une URL incorrecte : https://vimeo.com/508864124?h=fcbbcc92fa au lieu de https://player.vimeo.com/video/508864124?h=fcbbcc92fa

Pire encore, si une barre oblique finale (valide) est ajoutée à l’URL d’intégration, l’ID de la vidéo est supprimé dans l’e-mail : <iframe src="https://player.vimeo.com/video/508864124/?h=fcbbcc92fa" ...></iframe> devient https://vimeo.com/?h=fcbbcc92fa
Existe-t-il un moyen de contourner complètement la conversion iframe-en-URL ? Comme nous le faisons déjà pour les sondages, où il est indiqué quelque chose comme « Cliquez ici pour voir le sondage »

sam · Juin 27, 2022, 8:04

Délicat, nous avons une magie spéciale pour modifier la façon dont nous remappons les éléments cuits pour les processus de messagerie que nous pouvons nettoyer, c’est sûr.

Je vais mettre un pr-welcome pour l’instant et envisager une priorisation supplémentaire si cela se présente plusieurs fois.

Nacho_Caballero · Juin 27, 2022, 10:07

Merci, Sam. Pouvez-vous penser à des solutions de contournement temporaires pour empêcher les gens de voir l’URL dans les e-mails sans avoir à la masquer dans une balise [details] ?

sam · Juin 28, 2022, 6:20

Honnêtement, je ne vois pas beaucoup de solutions de contournement ici, à part peut-être forcer un lien non-onebox en dessous ?

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

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

ghassan · Juin 29, 2022, 11:38

@Nacho_Caballero L’exemple que vous avez fourni d’une vidéo non répertoriée, les vidéos non répertoriées ont une structure d’URL différente.

Et la manière d’intégrer une vidéo non répertoriée selon la demande de Vimeo est différente, voir Use oEmbed with private videos – Vimeo Help Center

Je pense qu’une solution de contournement pourrait être de créer votre propre intégration en utilisant la documentation ci-dessus.

@sam
Et pour Discourse, ne serait-il pas préférable d’utiliser l’API Vimeo pour obtenir l’URL source d’intégration au lieu de la construire ? voir https://stackoverflow.com/questions/51414260/vimeo-url-ive-never-seen-before-with-two-different-ids-how-do-i-get-it-to-work . Et ces lignes sont pertinentes discourse/lib/onebox/engine/vimeo_onebox.rb at 657256a099a601a0694d11d15c42ad76988efe8c · discourse/discourse · GitHub

Quoi qu’il en soit, si ma spéculation est correcte, cela affecterait la publication typique et pas seulement les e-mails : 1-Minute Audio Test for Stereo Speakers & Headphones-2ZrWHtvSog4

ghassan · Juin 29, 2022, 11:47

Pour obtenir l’iframe, j’ai fait :

GET https://vimeo.com/api/oembed.json?url=https://vimeo.com/508864124/fcbbcc92fa
J’ai donc obtenu

{\"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\"}

Décoder en UTF-8 : pour l’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>

L’iframe elle-même

Modifier/Mettre à jour :

J’ai soumis une PR pour corriger, je pense que le problème venait du modèle regex. Il ne capturait pas correctement vimeo quand ce n’était pas le type standard. J’ai donc modifié le modèle regex en conséquence.

Nacho_Caballero · Octobre 31, 2022, 7:23

@ghassan Je viens de remarquer que c’est toujours un problème.

Si un iframe contient une vidéo non répertoriée, l’URL n’est pas correctement transformée dans l’e-mail. Par exemple :

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

Est transformé en ceci (ce qui est une erreur 404) : https://vimeo.com/508864124?h=fcbbcc92fa
Au lieu de l’URL correcte : https://vimeo.com/508864124/fcbbcc92fa

Peut-être que l’expression régulière que vous avez ajoutée dans votre PR a besoin d’une étape supplémentaire (transformer ?h= en / lors de l’envoi d’un e-mail)

ghassan · Novembre 1, 2022, 8:49

Pour que je comprenne bien,

Il existe différents formats d’URL de viemo, notre seul problème concerne l’aspect e-mail, c’est bien ça ?
Pour reproduire cela, que faut-il faire :
- Coller l’URL ou l’iframe sur un sujet (Quels sont tous les cas de figure ?)
- Cela devrait fonctionner comme prévu sur le web, mais si un e-mail est envoyé avec le contenu du sujet, alors cela devient délicat.

Nacho_Caballero · Novembre 1, 2022, 9:52

Oui. Le changement d’expression régulière que vous avez effectué a permis de reconnaître les URL de type iframe src (https://player.vimeo.com/video/508864124?h=fcbbcc92fa), ce qui n’est donc plus un problème. Le problème se situe au niveau de l’e-mail qui est envoyé.

Si vous collez une URL simple (https://vimeo.com/508864124/fcbbcc92fa), il n’y a pas de problème. C’est uniquement un problème avec l’iframe src (https://player.vimeo.com/video/508864124?h=fcbbcc92fa).

C’est le cas actuellement.

Oui. Actuellement, l’iframe src (https://player.vimeo.com/video/508864124?h=fcbbcc92fa) est converti en ceci : https://vimeo.com/508864124?h=fcbbcc92fa au lieu de ceci : https://vimeo.com/508864124/fcbbcc92fa

ghassan · Novembre 6, 2022, 9:32

Il m’est encore difficile de reproduire car je dois avoir un compte premium pour avoir une vidéo non répertoriée sur Vimeo.

De plus, je pense que votre exemple de vidéo ci-dessus ne permet le chargement que depuis certains domaines. Pouvez-vous également autoriser mon instance sandbox à la charger : https://discuss.gsgapp.io.

Encore une fois, et pour être parfaitement clair, vous ne vous attendez pas à ce que la vidéo soit lue dans l’e-mail, mais vous vous attendez à ce que les gens soient dirigés vers la bonne URL lorsqu’ils cliquent sur la position de la vidéo ? Ai-je raison ?

Nacho_Caballero · Novembre 6, 2022, 11:14

Fait

Correct

Merci pour votre aide !

ghassan · Novembre 6, 2022, 11:57

Aha, j’ai trouvé le problème maintenant :

Ce qui se passe, c’est que lorsque vous collez le code iframe vanille, vous pourriez contourner le code onebox, et si vous le contournez, le code iframe résultant n’aura pas data-original-href, qui est le lien utilisé dans le modèle d’e-mail.

Et lorsque data-original-href est manquant, discourse essaie de deviner le lien de la vidéo, qui est tout ce qui suit le dernier /, ce qui ne couvre évidemment pas le cas d’une vidéo non répertoriée.

github.com/discourse/discourse

lib/pretty_text.rb

dea44ec92


      
          def self.convert_vimeo_iframes(doc)
            doc.css("iframe[src*='player.vimeo.com']").each do |iframe|
              if iframe["data-original-href"].present?
                vimeo_url = UrlHelper.normalized_encode(iframe["data-original-href"])
              else
                vimeo_id = iframe['src'].split('/').last
                vimeo_url = "https://vimeo.com/#{vimeo_id}"
              end
              iframe.replace Nokogiri::HTML5.fragment("<p><a href='#{vimeo_url}'>#{vimeo_url}</a></p>")
            end
          end

Par exemple, si vous vérifiez les outils de développement/inspectez l’élément de votre navigateur, le code iframe résultant lors de l’utilisation du code iframe vanille :

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

Alors que lors du collage de juste l’URL, c’est-à-dire laisser discourse le convertir en 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>

Notez donc le data-original-href="https://vimeo.com/508864124/fcbbcc92fa" supplémentaire dans le second résultat, on pourrait deviner que si cet attribut est utilisé avec l’iframe vanille, cela devrait fonctionner, mais ce n’est probablement pas le cas car discourse ne vous permet pas d’ajouter n’importe quel attribut que vous voulez…

ghassan · Novembre 6, 2022, 12:11

Je pense pouvoir suggérer une solution, et tout en m’assurant qu’elle fonctionnerait pour le cas où la vidéo est listée/publique, j’ai trouvé ce comportement inhabituel de Vimeo. Donc, typiquement, toutes les vidéos publiques suivent ce modèle vimeo.com/{id}, cependant, cela fonctionnera si vous ajoutez une barre oblique, c’est-à-dire vimeo.com/{id}/anything.

Considérez l’exemple suivant :

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

Tous les exemples ci-dessus mènent à la même vidéo, donc la correction peut être de créer une URL à partir de la source de l’iframe, vimeo.com/{ce qui vient après la première barre oblique}/{Ce qui vient de h=}. Cela devrait fonctionner dans les deux cas.

ghassan · Novembre 6, 2022, 12:47

La correction proposée FIX: vimeo iframe url when data-original-href is missing by ghassanmas · Pull Request #18894 · discourse/discourse · GitHub , vous pouvez également l’essayer sur https://discuss.gsgapp.io où j’ai cherry-pické mon commit.

J’ai personnellement testé 4 cas :

coller l’URL vimeo d’une vidéo publique
coller l’URL vimeo d’une vidéo non répertoriée
coller un iframe vanilla d’une vidéo publique
coller un iframe vanilla d’une vidéo non répertoriée

Dans tous les cas, cela a conduit à la génération de l’URL correcte par l’e-mail.

Mais quoi qu’il en soit, veuillez essayer de tester toutes les autres variations possibles que vous pourriez rencontrer et, plus important encore, que cela ne casse rien d’autre.

La façon dont j’ai testé le modèle d’e-mail est que je m’envoyais un message direct, puis je vérifiais ma boîte de réception d’e-mails. (Étant donné que j’ai deux comptes enregistrés sur https://discuss.gsgapp.io)

Nacho_Caballero · Novembre 7, 2022, 10:25

Merci ! Je l’ai testé aussi et ça fonctionne

Nacho_Caballero · Avril 19, 2023, 12:16

test :

j.jaffeux · Juin 28, 2024, 7:46

C’est fusionné

Sujet		Réponses	Vues
Posted a vimeo link in Discourse and email notice gave wrong one Support	2	446	Juillet 15, 2022
Strange destructive behavior with Vimeo links Bug	2	511	Octobre 6, 2021
Need help, how I can embed Vimeo video? Support	5	3546	Septembre 27, 2017
Vimeo embedded player is no longer? Bug	4	662	Mai 20, 2019
Video embeds from facebook.com and other sites fail Bug	25	5536	Mai 6, 2020

Les URL d'intégration de Vimeo sont analyséesIncorrectement dans l'e-mail

Sujets connexes