Open Graph 数据不显示在 Discord 上

Question

我正在浏览我的网站，我注意到我的一个网站上的 Open Graph 数据不再显示在 discord 上。我已经尝试改变了

<meta property="og:url"                content="url" />
<meta property="og:type"               content="website" />
<meta property="og:title"              content="site name" />
<meta property="og:description"        content="description" />
<meta property="og:image"              content="image url" />

首先，我认为这与我可能在不和谐的情况下更改的一些设置有关，但在检查了所有内容后，似乎情况并非如此。

从上面的截图中可以看出，（1）和（2）我的链接，都曾经让 OG 数据正常工作，（3）是可以正常显示的 Youtube。

我尝试使用 OG 数据，我认为这可能是由于文本/标题/图像长度/大小造成的问题，但事实并非如此。

为了检查 OG 数据是否正确设置并正常工作，我还尝试了“https://www.opengraph.xyz/”上的链接以及正在显示数据的 Whatsapp / Facebook 上的链接，所以问题在于discord仅。

如果有人知道discord有什么问题，我们将不胜感激。

感谢您的宝贵时间！

Answer 1

看起来您缺少

og:site_name

元标记

这就是我的解决方案最终在 Django 模板内部的样子，这就是 jinja2 语法的来源。

<meta name="og:site_name" content="Pawn Guild"></meta>
<meta property="og:title" content="{{ pawn.name }}">
<meta property="og:type" content="website" />
<meta property="og:description" content="Level {{ pawn.level }} {{ pawn.vocation }}"></meta>
<!-- <meta name="theme-color" content="#91ee91"> -->

{% if pawn.picture %}
    <meta property="og:image" content="{{ pawn.picture.url }}" >
{% endif %}

{{ pawn.picture.url }}

是我的域的相对路径...因此，例如，您的网址应该类似于

/path/to/img

，而不是

www.mydomain.com/path/to/img

。

theme-color

元标记更改了卡片中的侧边栏颜色。我发现我的没有它看起来也很好，所以我把它留在那里评论了。

结果如下：

这两个链接对我弄清楚这一点很有帮助：

• https://cookieandrock.dev/posts/candr-website-005
• https://www.reddit.com/r/discordapp/comments/82p8i6/a_basic_tutorial_on_how_to_get_the_most_out_of/

Answer 2

我不是专家，但这是我如何让它发挥作用的。

据我所知，3 个最基本的 opengraph 元是

og:title

、

og:description

和

og:image

。

对于大多数网站，

og:image

的相对路径应该有效，但也有例外，例如 Discord。

尝试将您的

og:image

从以下内容更改为：

"images/opengraph.png"

更改为

"https://yourwebsite.com/images/opengraph.png"

。

opengraph 图像可能会在 Discord 上缓存很长时间，因此如果您想刷新它以查看其中的更改，您可以更改图像文件名。此外，您可以在 URL 末尾添加一个查询参数，如果先前的路径不再可用，这将强制 Discord 刷新该 URL 的图像。示例：

"https://yourwebsite.com?"

.

Answer 3

对于仍然遇到此问题的任何人：

许多网站（包括 Discord）不会显示来自不安全 http 网站的 Open Graph 数据。必须是 HTTPS！

我将标题复制到一个空的 URL 页面并将其托管在 https://tiiny.host 上，我的标题/图像在 Discord 上完美显示。