Reddit Link 缩略图未显示动态 og:image

Question

我有一个 NextJS 应用程序，用户可以在其中将 link 分享到 Reddit，Reddit 中的 link 预览应该根据共享的 link 显示不同的缩略图。它完美地分享到 Slack 或 FB，但它总是在 Reddit 上显示完全相同的图像，无论 link 共享。

正如您在下面看到的，它应该根据 trade.id 共享不同的图像。然而，在 Reddit 上它总是只显示 trade.id == 2 的图像（这是我分享的第一个测试）。我试过使用不同的帐户，但仍然是同样的问题。

const TradePage: React.FC<Props> = ({ trade }) => {
return (
    <div>
        <Head>
            <meta
                property='og:url'
                content={`https://${URL}/trades/${trade.id}`}
            />
            <meta
                property='og:image'
                content={`https://${URL}/images/Thumbnail${trade.id}.png`}
            />
            <meta property='og:image:width' content='1200' />
            <meta property='og:image:height' content='901' />
            <meta
                property='og:title'
                content={`Verified ${trade.ticker} Trade`}
            />
            <meta
                property='og:image:alt'
                content={`Verified ${trade.ticker} Trade`}
            />
            <meta property='og:image:type' content='image/png' />
        </Head>
        <TradeComponent trade={trade} />
    </div>
);

Answer 1

Reddit 会在第一次请求时缓存 OG 图片，Twitter 等其他一些服务也是如此。

Twitter 提供了一个 OG 测试工具来破坏缓存 - Reddit 不提供这样的工具。

不幸的是，只要他们想要缓存您的 OG 图像或直到他们发布工具，您的 OG 图像就会缓存在 Reddit 上。不过这几年都这样了，看起来他们的优先级不高

解决方法是更改页面的 URL。例如，添加尾部斜杠、查询参数或重命名路由。

Reddit Link 缩略图未显示动态 og:image

Reddit Link Thumbnail not Showing Dynamic og:image

reddit

facebook-opengraph

reactjs

share-open-graph

next.js