collective / wildcard.media

13 stars 12 forks source link

Social Tags: og:image incorrectly populated with audio file url #64

Open flipmcf opened 5 years ago

flipmcf commented 5 years ago

Add the LeadImage behavior to a content type, and add an image. Social Tags behave as expected.

Additionally, add the Audio behavior, and the image social tags start getting the audio filename instead of the Image filename.

Without Behavior enabled:

<meta name="description" content="Vietnamese story with audio">
<meta content="summary" name="twitter:card">
<meta content="v story 1 - Audio" name="twitter:title">
<meta content="Plone site" property="og:site_name">
<meta content="v story 1 - Audio" property="og:title">
<meta content="website" property="og:type">
<meta content="Vietnamese story with audio" name="twitter:description">
<meta content="http://localhost:8080/RFA/english/vietnam/v-story-1" name="twitter:url">
<meta content="Vietnamese story with audio" property="og:description">
<meta content="http://localhost:8080/RFA/english/vietnam/v-story-1" property="og:url">
<meta content="http://localhost:8080/RFA/english/vietnam/v-story-1/@@download/image/7028266a-95da-4b20-9a8a-d05c83df54f9.jpg" name="twitter:image">
<meta content="http://localhost:8080/RFA/english/vietnam/v-story-1/@@download/image/7028266a-95da-4b20-9a8a-d05c83df54f9.jpg" property="og:image">
<meta content="image/jpeg" property="og:image:type">
<meta name="viewport" content="width=device-width, initial-scale=1.0">

With behavior enabled:

<meta name="description" content="Vietnamese story with audio">
<meta content="summary" name="twitter:card">
<meta content="v story 1 - Audio" name="twitter:title">
<meta content="Plone site" property="og:site_name">
<meta content="v story 1 - Audio" property="og:title">
<meta content="website" property="og:type">
<meta content="Vietnamese story with audio" name="twitter:description">
<meta content="http://localhost:8080/RFA/english/vietnam/v-story-1" name="twitter:url">
<meta content="Vietnamese story with audio" property="og:description">
<meta content="http://localhost:8080/RFA/english/vietnam/v-story-1" property="og:url">
<meta content="http://localhost:8080/RFA/english/vietnam/v-story-1/@@download/audio_file/SampleAudio_0.7mb.mp3" name="twitter:image">
<meta content="http://localhost:8080/RFA/english/vietnam/v-story-1/@@download/audio_file/SampleAudio_0.7mb.mp3" property="og:image">
<meta content="image/jpeg" property="og:image:type">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
flipmcf commented 5 years ago

With complete disregard for others, I'd just rip out syndication.AudioFeedItem - I think it was incorrectly implemented.

@pigeonflight Can I get a replication of the bug?

flipmcf commented 5 years ago

https://developers.facebook.com/docs/opengraph/music/ for twitter, it's an iframe url - https://developer.twitter.com/en/docs/tweets/optimize-with-cards/overview/player-card.html

flipmcf commented 5 years ago

I think this problem is with socialtags viewlet assuming all fields / behaviors with the 'file_url' property are images, or implementing the file_url property on our type. Most likely the former.

Socialtags should check if a type provides / object implements IImage before using it in social tags as an image.

Why audio is preferred when putting both a lead image and audio fields into a type is an interesting question. I have not tried reordering the fields, but my audio field is after the lead image field.

This is why I believe commenting this out for now was a good idea, Unless it breaks youtube uploads for some reason - this was the name of the huge commit that introduced syndication.