feat: automating og:image for getFrameHtmlResponse and FrameMetadata.
#109
Conversation
src/core/getFrameHtmlResponse.ts
Outdated
| // Set the image metadata if it exists. | ||
| const imageHtml = image ? ` <meta property="fc:frame:image" content="${image}" />\n` : ''; | ||
| const imageHtml = ` <meta property="fc:frame:image" content="${image}" />\n`; | ||
| const ogImageHtml = ` <meta property="og:image" content="${image}" />\n`; |
There was a problem hiding this comment.
From my testing, og:title is also required to have warpcast render the frame from a GET response.
Can just set to empty string to satisfy this.
There was a problem hiding this comment.
Or, looks like they have some updated docs, and it seems maybe not necessary: https://docs.farcaster.xyz/reference/frames/spec#required-properties
There was a problem hiding this comment.
Not sure i follow your point
There was a problem hiding this comment.
You added the og:image metadata here, but not og:title.
From my testing, without og:image AND og:title, warpcast won't render a frame from a GET request.
This works:
<!DOCTYPE html>
<html>
<head>
<meta property="og:image" content="https://paperclip.a.pinggy.link/images/nouns-auction-house.png" />
<meta property="og:title" content="title" />
<meta property="fc:frame" content="vNext" />
<meta property="fc:frame:image" content="https://paperclip.a.pinggy.link/images/nouns-auction-house.png" />
<meta property="fc:frame:post_url" content="https://paperclip.a.pinggy.link/auction/nouns?" />
<meta property="fc:frame:button:1" content="View auction!" />
<meta property="fc:frame:button:1:action" content="post" />
</head>
</html>
This doesn't work (only difference is that it is missing the og:title tag)
<!DOCTYPE html>
<html>
<head>
<meta property="og:image" content="https://paperclip.a.pinggy.link/images/nouns-auction-house.png" />
<meta property="fc:frame" content="vNext" />
<meta property="fc:frame:image" content="https://paperclip.a.pinggy.link/images/nouns-auction-house.png" />
<meta property="fc:frame:post_url" content="https://paperclip.a.pinggy.link/auction/nouns?" />
<meta property="fc:frame:button:1" content="View auction!" />
<meta property="fc:frame:button:1:action" content="post" />
</head>
</html>There was a problem hiding this comment.
But the spec doesn't care about the title?!?
Is it the spec wrong?
There was a problem hiding this comment.
Let me loop back this to V
There was a problem hiding this comment.
But yeah, if it doesn't work, than yeah let me add og:title, and thank you for triple checking this.
There was a problem hiding this comment.
Awesome, thanks!
Oh, and content="" (empty string) doesn't work lol (very finicky), so just put "title" or something if you are going to hardcode
There was a problem hiding this comment.
Sorry for the nits lol
This is the last thing stopping us from moving over to use onchainkit 🙏!
There was a problem hiding this comment.
🤔 I guess is fair to let people decide, and than yeah maybe the default is something like Frame title
|
@spennyp random question. |
It’s when using getFrameHtmlResponse in a GET request instead of using page.tsx for the first response like here: |
|
@spennyp oh I see your point now! Ok give me a few minutes and I will finish and merge this PR. |
What changed? Why?
This relates to:
Notes to reviewers
How has it been tested?