动态 Twitter 卡片图片

Question

我在 application I'm building. I am using the Twitter card <meta> tags (documentation) to define the image that shows up on Twitter. The application is dynamic and allows you to share individual 'reports'. When you share an individual report, I have a query parameter ?report=1608 (see example) 上有一个 Twitter 分享按钮。

问题：我只能为整个站点定义一张 Twitter 卡片。我很乐意为每个共享的单独报告动态更改卡片信息（标题、文本、图像）。

这能做到吗？有什么想法吗？

我正在考虑使用 JavaScript 动态更新元标记，但我认为这不会成为解决方案。

Answer 1

不，这是不可能的。推特的卡片爬虫（Twitterbot）不支持在页面中执行Javascript，要求meta标签是静态的。无法动态执行此操作。

Answer 2

我觉得你可以做SSR。祝你好运

Answer 3

可以的，你可以动态加载标题、文字和图片。我试过了，它起作用了……但是在 browser/website 上填充需要一点时间，但它在 Twitter 应用程序上起作用 perfectly/instantly……需要一个解决方法……让我知道您是否找到任何解决方案。我是这样使用它的：


<?php
    if (isset($_GET['code'])) {
    ?>

        <meta name="twitter:card" content="summary_large_image">
        <meta property="og:image" content="https://example.domain/i/<?= $_GET['code'] ?>.png" />
        <meta name="twitter:image" content="https://example.domain/i/<?= $_GET['code'] ?>.png">
        <meta name="twitter:image:alt" content="image_alt">

    <?php
    }
?>

动态 Twitter 卡片图片

Dynamic Twitter Card Images

javascript

html

twitter

meta

twitter-card