Facebook Open Graph 错误 - 推断属性答案

【问题标题】：Facebook Open Graph Error - Inferred PropertyFacebook Open Graph 错误 - 推断属性
【发布时间】：2011-12-13 17:48:21
【问题描述】：

我正在尝试在我的产品页面上实现 Facebook 的 OpenGRaph 协议。

在每一页的头部上方都有这个：

<html xmlns="http://www.w3.org/1999/xhtml" xmlns:og="http://ogp.me/ns#" xmlns:fb="http://www.facebook.com/2008/fbml">

然后在头部我有：

<meta property="og:title" content="This Page Title"/>
<meta property="og:type" content="product"/>
<meta property="og:url" content="http://www.mywebaddress.com"/>
<meta property="og:image" content="http://www.myimage.jpg"/>
<meta property="og:site_name" content="My Site Name"/>
<meta property="fb:admins" content="10101010101"/>
<meta property="og:email" content="hello@mywebaddress.com"/>
<meta property="og:description" content="Description of my product."/>

然后我有一个带有此代码的“喜欢”按钮：

        <script>(function(d, s, id) {
        var js, fjs = d.getElementsByTagName(s)[0];
        if (d.getElementById(id)) {return;}
        js = d.createElement(s); js.id = id;
        js.src = "//connect.facebook.net/en_US/all.js#xfbml=1";
        fjs.parentNode.insertBefore(js, fjs);
        }(document, 'script', 'facebook-jssdk'));</script>
        <div class="fb-like" data-href="http://thispagesurl" data-send="true" data-width="350" data-show-faces="false"></div>

在我看来，一切似乎都在复制 Facebook Developers page 上的内容，但当我“点赞”时，Facebook 似乎只关注页面标题和一般信息。

我尝试使用他们的对象调试器“调试”页面，但收到以下警告：

Inferred Property   The og:url property should be explicitly provided, even if a value can be inferred from other tags.
Inferred Property   The og:title property should be explicitly provided, even if a value can be inferred from other tags.
Inferred Property   The og:image property should be explicitly provided, even if a value can be inferred from other tags.
Inferred Property   The og:locale property should be explicitly provided, even if a value can be inferred from other tags.

据我所知，我已完全按照 Facebook 的指示进行操作，但我并不高兴。谁能指出我做错了什么？

提前致谢，丹

【问题讨论】：

你能检查一下吗？ facebook.stackoverflow.com/questions/11146635/…

标签： facebook facebook-opengraph

【解决方案1】：

这些标签在“http://www.mywebaddress.com”上吗？

请记住，linter 将跟随 og:url 标签，因为该标签应该指向内容的规范 URL - 所以如果你有一个页面，例如'http://mywebaddress.com/article1' 带有一个指向 'http://mywebaddress.com' 的 og:url 标签，Facebook 会去那里并读取那里的标签。

如果做不到这一点，我见过的看似正确的标签没有被 linter 检测到的最常见原因是用户代理检测向 Facebook 的爬虫返回的内容与您手动检查时看到的内容不同

【讨论】：

天哪，有时我会踢自己！这似乎完成了 Igy 的把戏，非常感谢你 :)
我猜 Facebook 的某个人动作太快而破坏了东西，因为我根本无法让它工作，Facebook 只是选择了另一个图像。他们有一个在线调试器，您可以在其中输入 URL，即使是 Facebook 的 URL 也会显示错误。
只向 Facebook 显示 OG 标签太愚蠢了。为什么要排除使用此元信息的 Twitter 或其他服务？！
@Dan 那么您遇到的问题是什么？我遇到了同样的问题，但我无法从您的回复中看出 Igy 的回复中哪一部分是踢球者。
你拯救了我的一天！感谢您指出这个被忽视的错误

【解决方案2】：

最后一组引号后需要一个空格

<meta property="og:url" content="http://www.mywebaddress.com"/>

应该..喜欢这个

<meta property="og:url" content="http://www.mywebaddress.com" />

【讨论】：

fyi...自闭合标签完全不受空格的影响...最佳实践是包含空格，但它对解析器没有影响
@JoshuaBarker 实际上在我添加空间之前它对我不起作用。
我的在添加空间后也开始工作，尽管我同意它不应该有所作为。也许是 FB 那边的错误？
谢谢。这里同样的问题。通过像你说的那样添加一个空格来修复它。
(！) 认真的FB！？谢谢@用户

【解决方案3】：

UPD 2020：“开放图形对象调试器”已停止使用。使用共享调试器刷新 Facebook 缓存。

对于大量的 Facebook 工具和文档存在一些混淆。很多人可能使用 Sharing Debugger 工具来检查他们的 OpenGraph 标记： https://developers.facebook.com/tools/debug/sharing/

但它只会从 Facebook 缓存中检索有关您网站的信息。这意味着在您更改站点上的 ogp 标记后，共享调试器仍将使用旧的缓存数据。此外，如果 Facebook 服务器上没有缓存数据，那么共享调试器会显示错误：This URL hasn't been shared on Facebook before.

所以，解决方案是使用另一个工具——Open Graph Object Debugger： https://developers.facebook.com/tools/debug/og/object/

它允许您获取新的抓取信息并刷新 Facebook 缓存：

老实说，我不知道如何在 developers.facebook.com 的 Tools & Support 部分找到这个工具——我找不到任何链接和提及。我的书签里只有这个工具。那是 Facebook :)

使用“属性”-attrs

我还注意到一些开发人员使用name 属性而不是property。许多解析器可能会正确处理此类标签，但根据The Open Graph protocol，我们应该使用property，而不是name：

<meta property="og:url" content="http://www.mywebaddress.com"/>

使用完整的网址

最后一个建议是指定完整的 URL。例如，当您在 og:image 中使用相对 URL 时，Facebook 会抱怨。所以使用完整的：

<meta property="og:image" content="http://www.mywebaddress.com/myimage.jpg"/>

【讨论】：

不错的工具。由于缓存，我在使用其他 FB 工具时遇到问题。
使用property 为我做到了。作为 HTML 规范级别的 property 属性 doesn't seem to be defined 有点令人困惑。 ¯\_(ツ)_/¯

【解决方案4】：

如果它可以帮助我遇到同样错误的任何人。事实证明，我的页面已经有一段时间没有被 Facebook 废弃了，这是一个老错误。修复它的页面上有一个再次刮擦按钮。

【讨论】：

【解决方案5】：

它可能会帮助一些正在努力让 Facebook 很好地阅读 Open Graph 的人......

查看使用 Firefox、Chrome 或其他桌面浏览器（许多手机不会查看源代码）的浏览器生成的源代码，并确保 doctype 行或 head 标签之前没有空行。 .如果有Facebook会彻底发脾气，把它的玩具扔出婴儿车！（最好的描述！）删除空白行 - 快乐的 Facebook... 花了我大约 1.5 - 2 个小时才发现这个！

【讨论】：

【解决方案6】：

在我的情况下，源代码中的意外错误通知阻止了 facebook 爬虫解析（正确设置的）og-meta 标签。

我使用的是 HTTP_ACCEPT_LANGUAGE 标头，它适用于常规浏览器请求，但不适用于爬虫，因为它显然不会使用/设置它。

因此，使用 facebook 的调试器功能 See exactly what our scraper sees for your URL 对我来说至关重要，因为错误通知只能在那里看到（但不能通过常规的“查看源代码”-浏览器功能）。

【讨论】：

【解决方案7】：

如果您指向错误的图像，或者您的图像文件路径不正确，您将看到以下三个错误：

Bad Response Code: URL returned a bad HTTP response code.

Inferred Property: The 'og:image' property should be explicitly provided, even if a value can be inferred from other tags.

Missing Properties: The following required properties are missing: og:url, og:type, og:title, og:image, og:description, fb:app_id

在我的例子中，所有的错误都是我有错误的路径到 og:image - 一旦我纠正所有这些问题立即消失。

【讨论】：