【发布时间】：2023-01-09 00:21:38
【问题描述】：
我正在尝试在我的网站上设置 <meta/> 标签，以便 Facebook 和 Twitter 等社交媒体网站在发布到我的网站的链接时显示预览卡，但我无法让 Twitter 在预览卡。
网址为https://spiriteddrive.club和<meta/>标签，设置如下：
<meta name="twitter:card" content="summary_large_image"/>
<meta name="twitter:site" content="@spirited_drive"/>
<meta name="twitter:creator" content="@spirited_drive"/>
<meta property="twitter:domain" content="spiriteddrive.club">
<meta property="twitter:url" content="https://spiriteddrive.club">
<meta name="twitter:title" content="Spirited Drive">
<meta name="twitter:description" content="A crowdsourced online database of the world's best driving roads.">
<meta name="twitter:image" content="https://cdn.spiriteddrive.club/images/banner-twitter.jpg">
<meta name="twitter:image:alt" content="Banner logo image for Spirited Drive">
<meta property="og:title" content="Spirited Drive"/>
<meta property="og:description" content="A crowdsourced online database of the world's best driving roads."/>
<meta property="og:url" content="https://spiriteddrive.club"/>
<meta property="og:image" content="https://cdn.spiriteddrive.club/images/banner-twitter.jpg"/>
<meta property="og:image:alt" content="Banner logo image for Spirited Drive"/>
<meta property="og:site_name" content="Spirited Drive"/>
<meta property="og:type" content="website"/>
<meta property="article:published_time" content=""/>
<meta property="article:modified_time" content=""/>
<meta property="article:author" content=""/>
<meta property="profile:username" content=""/>
这些标签是在服务器端生成的，而不是在客户端 JavaScript 中生成的，因此 Twitter 的抓取工具应该没有任何问题可以看到它们。
我在 Twitter 的卡片预览验证器中试过 https://cards-dev.twitter.com/validator 但是图像总是丢失，即使输出是：
INFO: Page fetched successfully
INFO: 30 metatags were found
INFO: twitter:card = summary_large_image tag found
INFO: Card loaded successfully
直接发布到 Twitter 时图像也丢失了，但是它在 Facebook 卡片测试器中显示正常：https://developers.facebook.com/tools/debug/?q=https%3A%2F%2Fspiriteddrive.club
我的图像最初是 2:1，但后来有人在 SO 上建议使用 1200x630，所以我试过了，但仍然没有。
【问题讨论】：
标签： html twitter facebook-opengraph meta-tags