Can't get Open Graph previews working in iMessage with Netlify prerendering

Support
1

Continuing the discussion from [Support Guide] Understanding and debugging prerendering:

Hi, thanks so much for providing this user-agent list!

I could use some help. I’ve reviewed all of the guides and documentation on prerendering, but I’m still struggling to get this link unfurl working in Apple iMessage:

https://freevite.app/event/my-example-party

Here’s what I know:

  • My Netlify site is https://freevite.netlify.com/.
  • I have prerendering enabled.
  • Running curl -A twitterbot https://freevite.app/event/my-example-party returns HTML with valid og:image and og:description meta tags, as far as I can tell.
  • The link unfurls properly in Discord and this Open Graph debugger.
  • Even when I “force” prerendering with the suffix, the link https://freevite.app/event/my-example-party?_escaped_fragment_=1 doesn’t unfurl in iMessage either.
  • Apple’s user-agent, via requestbin, seems to be Mozilla/5.0 (Macintosh; Intel Mac OS X 10_11_1) AppleWebKit/601.2.4 (KHTML, like Gecko) Version/9.0.1 Safari/601.2.4 facebookexternalhit/1.1 Facebot Twitterbot/1.0, which should be covered by facebot|twitterbot.

Just to confirm, I think that my site is set up with correct Open Graph data. If we use the _escaped_fragment_ suffix below, we can see that Discourse unfurls properly:

https://freevite.app/event/my-example-party?_escaped_fragment_=1

I am running out of ideas for what I could be doing wrong here. Do you have any advice for what I should check next to get prerendering working in iMessage? Is there anything sticking out to you that I have missed?

2

Hi @mplewis :wave:t6: ,

Did you check that the link is not blocked by iMessage and verified that the app is up to date?

3

Hi, the link appears to not be blocked as I can successfully send and receive it. Here’s the broken event preview followed by the working homepage preview. I have confirmed my iMessage app is up to date.

image
image1034×824 103 KB

4

hi @mplewis

I believe this is what is happening:

Your home page contains hardcoded description and image tags: view-source:https://freevite.app/ (chrome URL) so unfurling works without relying on prerendering.

On all other pages, og tags probably depend on JavaScript to be rendered (which prerendering does). However our prerendering feature only supports a limited list of crawlers which, most likely, does not include iMessages one.

You already confirmed this since all curls with twitterbot result in a correct unfurl:

curl -A twitterbot https://freevite.app/event/my-example-party

To fix this you need to include the og tags statically and not rely on JavaScript to produce them (which may not be possible due to the dynamic nature of your site).

Did that make sense?