Google plus 代码段 - 不显示图片缩略图答案

【问题标题】：Google plus snippet - Image thumbnail is not shownGoogle plus 代码段 - 不显示图片缩略图
【发布时间】：2014-05-05 11:55:04
【问题描述】：

使用以下 HTML 测试在 Google+ 上发布 sn-p -

<!DOCTYPE html>
<head>
    <meta property="og:image" content="http://i.imgur.com/le2WbeU.jpg" />   
    <meta itemprop="image" content="http://i.imgur.com/le2WbeU.jpg">
</head>
<body>    
</body>
</html>

我看到的是：

查看网络流量，我看到一个失败的请求：

更新：看起来这是一个缓存问题。一旦我在 URL 上附加了一个查询字符串，我就可以拉起图像。我第一次一定有一个错误的图像 URL，它缓存了那个错误的 URL 请求。

【问题讨论】：

imgur 可能会阻止 Google 对图片的直接请求。他们最近确实开始将直接图像请求重定向到 HTML 页面，如果它们没有从 Twitter/Facebook/等中引用。尝试使用一些不同的图像主机。
看起来是缓存问题。一旦我在 URL 上附加了一个查询字符串，我就可以拉起图像。我第一次一定有一个错误的图像 URL，它缓存了那个错误的 URL 请求。

标签： google-plus meta-tags google-plus-one schema.org facebook-opengraph

【解决方案1】：

看起来这是一个缓存问题。一旦我在 URL 上附加了一个查询字符串，我就可以拉起图像。我第一次一定有一个错误的图像 URL，它缓存了那个错误的 URL 请求。

【讨论】：

【解决方案2】：

我不知道它是否会导致错误，但如果值是 URI，您可能希望使用 link 而不是 meta。

HTML5 规范定义 meta element:

[...] 表示无法使用 [...] link [...] 元素表达的各种元数据。
微数据also explicitly requires it：

[...] 必须使用 URL 属性元素指定属性

还请注意，您尚未在微数据中创建项目，因此未定义 image 属性（除非在您的示例中缺少的 html 开始标记上创建了项目；或者您通过itemref 从body 引用它。

【讨论】：

Google 文档指定使用 meta 标签。 developers.google.com/+/web/snippet你能澄清一下“你的微数据中的项目”指的是哪个项目吗？
@dev.e.loper：它可能适用于谷歌等，但它是无效的微数据。 - - 回覆。 item，这是基本的微数据概念。使用itemscope 属性创建一个微数据“项目”。它代表一个东西。这个项目/事物可以有一个类型（itemtype）。所有后代属性 (itemprop) 都属于此项目。在您的小示例中，您没有创建项目。你的 image 属性不属于任何地方，它也没有定义（你可能想使用 Schema.org 词汇，但你需要指定它。）