Twitter embeds have broken

Hello, a few days ago on our Discourse fourm twitter embeds have borken, leading to issues of having to click every tweet and not being able to see a summary first.

They currently look like this
image

What is the issue if anyone knows and what is the fix?

5 Likes

My guess is that this has to do with this issue.

The company is shutting down its original site legacy theme version on the 1st of June 2020

2 Likes

My site is experiencing this as well. As well as another one that I’m one.

1 Like

Trying one out:

Can you find an example of a tweet that fails to embed on try.discourse.org?

4 Likes

This is what would not render on my site:

I’m on the latest release:

Link to post where it is not rendering:

2 Likes

This one, the one you linked, has the same issue on the site I use.

Here’s another example of one that is embeding fine here but not our board it seems.

Checking the admin pannel, we are not on the latest version, was there any changes between these two versions would should lead to a fix?

2 Likes

All the Open Graph tags are missing from Twitter currently, except one:

<meta property="og:site_name" content="Twitter" />

I’m afraid there is nothing that can be done except maybe using some mysterious API or something, specifically for Twitter Oneboxes.

6 Likes

Looks like Twitter indeed removed the OpenGraph tags. If you enable rich embeds on your site we have a way to bypass that.

10 Likes

Confirmed via http://www.opengraphtester.com/test/:

3 Likes

Thanks, will ask the admin to test this for us when he gets some time today.

1 Like

Thank you, it seems to have worked. Only issues is video aren’t embedding, but you can still the tweet author and description so that’s fine.

1 Like

Thank you, that worked for me as well.

2 Likes

Even with the existing workaround, IMO it makes sense to add some custom onebox rules so it doesn’t look so broken out of the box.

3 Likes

I’ve tried implementing the above, but still just get the brackets being displayed.

2 Likes

Same for me. The workaround doesn’t work for my forum.

2 Likes

Ah, it’s now working except for a few historic links. I’m assuming something has been cached by the forum, I’ll see if I can find a way to recache them.

2 Likes

Same here… Patience is something i need to learn… :smiley:

2 Likes

I posted about this change in the Twitter forums, let’s see if anything useful comes up

I believe this change was to save rendering time on their servers, as the tags are now only filled by React during client render. This makes their HTML static, allowing they to adopt The App Shell Model  |  Web Fundamentals  |  Google Developers, which makes webapps render a lot faster.

5 Likes

Hey we have a workaround!

# standard call
➜  ~ curl https://twitter.com/TwitterSupport/status/1267105441278033920 -s | grep og:
<meta property="og:site_name" content="Twitter" />

# special user agent
➜  ~ curl https://twitter.com/TwitterSupport/status/1267105441278033920 -s -H "User-Agent: DiscourseBot/1.0" | grep og:
    <meta  property="og:type" content="article">
    <meta  property="og:url" content="https://twitter.com/TwitterSupport/status/1267105441278033920">
    <meta  property="og:title" content="Twitter Support on Twitter">
    <meta  property="og:image" content="https://pbs.twimg.com/profile_images/1266884366279471105/OTps6MBS_400x400.jpg">
    <meta  property="og:description" content="“To follow what’s happening in real time, tap the ✨ located at the top right of your Home timeline to change from seeing top Tweets to latest Tweets first.”">
    <meta  property="og:site_name" content="Twitter">

Is this something we can use @techAPJ?

6 Likes

Definitely, that helps a lot! :heart_eyes:

I’ll update Twitter onebox engine first thing tomorrow. :memo:

8 Likes