FB OpenGraph og：图像不拉图像（可能是 https？）
Facebook 无法获取我的 og:image 文件，并且我已经尝试了所有常用的解决方案。我开始认为这可能与https://...有关
我检查了 http://developers.facebook.com/tools/debug 并且警告或错误为零。
它正在“og：image”中找到我们链接到的图像，但它们显示为空白。但是，当我们单击图像时，它们确实存在，并且直接指向它们。
它确实显示了一个图像 - 托管在非 https 服务器上的图像。
我们尝试了方形图像、jpeg、png、更大尺寸和更小尺寸。我们已将图像放在 public_html 中。零正在出现。
这不是缓存错误，因为当我们向元数据添加另一个 og:image 时，FB 的 linter 确实会找到并读取它。它确实显示了预览。预览是空白的。我们得到的唯一例外是不在此网站上的图像。
我们认为 cpanel 或 .htaccess 上可能有一些防浸出功能会阻止图像显示，因此我们进行了检查。这没有。我们甚至在一个完全不同的服务器上做了一个快速的 < img src="[remote file]"> 并且图像显示得很好。
我们认为这可能是 og:type 或另一个带有另一个元标记的奇怪之处。我们一次一个地删除了所有这些并检查了它。没变。只是警告。
不同网站上的相同代码显示没有任何问题。
我们认为它可能不是拉图像，因为我们对多个产品使用相同的产品页面（根据获取值更改它，即“details.php?id=xxx”），但它仍然在拉一个图片（来自不同的网址）。
离开任何 og:image 或 image_src 关闭，FB 找不到任何图像。
我已经走到了尽头。如果我说我自己和其他人为此花了多少时间，你会感到震惊。问题是这是一个在线商店。我们绝对，肯定不能没有图像。我们必须。我们还有十个左右的其他站点...这是唯一一个存在 og:image 问题的站点。它也是 https 上唯一的一个，所以我们认为这可能是问题所在。但是我们在网络上找不到任何先例。
这些是元标记：
<meta property="og:title" content="[The product name]" />
<meta property="og:description" content="[the product description]" />
<meta property="og:image" content="https://www.[ourwebsite].com/images/shirts/overdriven-blues-music-tshirt-details-black.png" />
<meta property="og:image" content="https://www.[ourwebsite].com/images/shirts/overdriven-blues-music-tshirt-art-black.png" />
<meta property="og:image" content="http://www.[ADIFFERENTwebsite].com/wp-content/uploads/2011/06/ARS-Header-Shine2.png" />
<meta property="og:image" content="https://www.[ourwebsite].com/images/ARShopHeader.png" />
<meta property="og:image" content="http://www.[ourwebsite].com/overdriven-blues-music-tshirt-art-black.JPG" />
<meta property="og:type" content="product"/>
<meta property="og:url" content="https://www.[ourwebsite].com/apparel-details.php?i=10047" />
<meta property="og:site_name" content="[our site name]" />
<meta property="fb:admins" content="[FB-USER-ID-NUMBER]"/>
<meta name="title" content="[The product name]" />
<meta name="description" content="[The product description]" />
<link rel="image_src" href="https://www.[ourwebsite].com/images/shirts/overdriven-blues-music-tshirt-details-black.png" />
<meta name="keywords" content="[four typical keywords]">
<meta name="robots" content="noarchive">
如果您需要，这里有一个指向我们一直在努力的产品页面的链接。 [缩短链接以试图阻止这种情况进入我们网站的搜索结果]：http://rockn.ro/114
编辑 - -
使用“看看 facebook 看到了什么”刮板工具，我们能够看到以下内容：
"image": [
{
"url": "https://www.[httpSwebsite].com/images/shirts/soul-man-soul-music-tshirt-details-safari.png"
},
{
"url": "https://www.[httpSwebsite].com/images/shirts/soul-man-soul-music-tshirt-art-safari.png"
},
{
"url": "http://www.[theotherNONSECUREwebsite].com/wp-content/uploads/2011/06/ARS-Header-Shine2.png"
}
],
我们测试了它为单个页面找到的所有链接。都是完全有效的图像。
编辑 2 ----
我们尝试了一个测试，并在 NONSECURE 网站上添加了一个子域（通过 facebook，图像实际上是可见的）。子域是 http://img.[nonsecuresite].com。然后，我们将所有图像放入主子域文件夹并引用它们。它不会将这些图像拉入FB。但是，它仍然会提取在非安全主域上引用的任何图像。
发布解决方法----
感谢 Keegan，我们现在知道这是 Facebook 中的一个错误。为了解决这个问题，我们在不同的非 HTTPS 网站中放置了一个子域，并将所有图像转储在其中。我们在每个产品页面的 og:image 中引用了协调的 http://img.otherdomain.com/[like-image.jpg] 图像。然后我们必须通过 FB Linter 并运行每个链接来刷新 OG 数据。这行得通，但解决方案是创可贴的解决方法，如果 https 问题得到解决，我们又回到使用自然 https 域，FB 将缓存来自不同网站的图像，使事情复杂化。希望这些信息能够帮助其他人避免失去 32 个编码小时的他们 生命。
og:type: og_products:product 更改为网站类型，然后查看是否可以拾取图像。
某些属性可以附加额外的元数据。它们的指定方式与使用 property 和 content 的其他元数据相同，但 property 将具有额外的：
og:image 属性具有一些可选的结构化属性：
og:image:url - 与 og:image 相同。
og:image:secure_url - 如果网页需要 HTTPS，则使用备用 url。
og:image:type - 此图像的 MIME 类型。
og:image:width - 宽的像素数。
og:image:height - 高像素数。
完整的图像示例：
<meta property="og:image" content="http://example.com/ogp.jpg" />
<meta property="og:image:secure_url" content="https://secure.example.com/ogp.jpg" />
<meta property="og:image:type" content="image/jpeg" />
<meta property="og:image:width" content="400" />
<meta property="og:image:height" content="300" />
因此，您需要将 HTTPS URL 的 og:image 属性更改为 og:image:secure_url
前任：
图像的 HTTPS 元标记：
<meta property="og:image:secure_url" content="https://www.[YOUR SITE].com/images/shirts/overdriven-blues-music-tshirt-details-black.png" />
图像的 HTTP 元标记：
<meta property="og:image" content="http://www.[YOUR SITE].com/images/shirts/overdriven-blues-music-tshirt-details-black.png" />
来源：http://ogp.me/#structured <-- 您可以访问此站点以获取更多信息。
希望这对您有所帮助。
编辑：更新代码后不要忘记 ping facebook 服务器 - URL Linter
我遇到了同样的问题，并在 Facebook 开发者网站上将其报告为错误。很明显，使用 HTTP 的 og:image URI 工作得很好，而使用 HTTPS 的 URI 则不行。他们现在承认他们正在“调查此事”。
更新：截至 2020 年，该错误在 Facebook 的票务系统中不再可见。他们从未回应，我不相信这种行为已经改变。但是，在 og:image:secure 中指定 HTTPS URI 似乎工作正常。
我不知道，如果它只和我在一起，但对我来说，og:image 不起作用，它会选择我的网站徽标，即使 facebook debugger 显示了正确的图像。
但是将 og:image 更改为 og:image:url 对我有用。希望这可以帮助其他面临类似问题的人。
从谷歌到这里，但这对我没有多大帮助。事实证明，徽标所需的最小纵横比为 3:1。我的几乎是4：1。我使用 Gimp 将其裁剪为 3:1，瞧——我的徽标现在显示在 FB 上。
tl;博士——要有耐心
我最终来到这里是因为我看到了从 https 站点提供的空白图像。但问题是完全不同的：
首次共享内容时，Facebook 爬虫将从共享的 URL 中抓取并缓存元数据。爬虫必须至少看到一次图像才能渲染它。这意味着第一个分享内容的人不会看到渲染的图像
[https://developers.facebook.com/docs/sharing/best-practices/#precaching]
在测试时，facebook 花了大约 10 分钟才最终显示渲染图像。因此，当我挠头并向 facebook 扔随机 og 标签（并怀疑这里提到的 https 问题）时，我所要做的就是等待。
由于这可能真的会阻止人们第一次分享您的链接，FB 建议了两种方法来规避这种行为：a）在所有链接上运行 OG 调试器：图像将被缓存并在大约 10 分钟后准备好分享或 b ) 指定 og:image:width 和 og:image:height。 （在上面的链接中阅读更多内容）
仍然想知道虽然他们花了这么长时间...
og:image:width 和 og:image:height 数据，则 Facebook 将不得不在将图像废弃后对其进行处理以适合其尺寸。图像最终也会被裁剪，这可能是不需要的。有关详细信息，请参阅：developers.facebook.com/docs/sharing/best-practices/#images
我有类似的问题。我删除了属性 =“og:image:secure_url”，现在它将只用 og:image 擦洗。有时，少即是多
我遇到了同样的错误，以前没有任何帮助，所以我尝试遵循 Open Graph Protocol 的原始文档，并在我的 html 标记中添加了前缀属性，一切都变得很棒。
<html prefix="og: http://ogp.me/ns#">
正如我偶然发现的那样，透明的空白图像带有响应标头，指示问题的可能原因。
转到 https://developers.facebook.com/tools/debug/og/object/ 的调试器 将您的 URL 在底部，facebook 显示您的“图像”（透明 1x1 GIF）图像链接到您的原始图像 - 否点按它 按右并查看图像（你会得到类似 https://external-ams3-1.xx.fbcdn.net/safe_image.php?d=...&url=...） 打开网络选项卡在萤火虫/开发者工具上，如果需要，刷新页面你会得到带有解释的 x-error-detail 响应头
例如，在我的例子中是 Invalid image extension for URL: https://[mydomain]/[myfilename].jpg
在我的案例中，真正的问题与 prerender.io 有关。
事实证明，如果图像是通过预渲染请求的，它会被转换为 HTML。像这样的东西：
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" "http://www.w3.org/TR/REC-html40/loose.dtd">
<html>
<head><meta http-equiv="content-type" content="text/html; charset=utf-8"></head>
<body style="margin: 0px;"><img style="-webkit-user-select: none; cursor: -webkit-zoom-in; " src="https://[yourdomain].com/[yourfilename].jpg" width="1078" height="718"></body>
</html>
它要么是预渲染本身的错误，要么应该在您的代理中配置为不对 *.jpg 请求使用预渲染（即使它们是由 Facebook 机器人请求的）。
很难注意到这一点，因为预渲染仅用于某些用户代理标头。
我从我的 og:image 中取出 http:// 并用普通的旧 www. 替换它，然后它开始正常工作。
您可以使用 this tool, by Facebook 重置您的图像抓取缓存并测试它为演示图像提取的 URL。
我发现了另一种可能导致此问题的情况。我完成了问题和答案中描述的所有步骤，但问题仍然存在。
我检查了我的图片，发现我的一些帖子在 og:image 中的缩略图太大了，在几千像素和几兆字节的范围内。
这是由于最近从 WP 迁移到 Jekyll 造成的，我用 gulp 优化了我的图像，但错误地使用了 og:image 中的原始图像。
Facebook gives us the following recommendations as of today：
使用至少 1200 x 630 像素的图像，以便在高分辨率设备上获得最佳显示效果。至少，您应该使用 600 x 315 像素的图像来显示带有较大图像的链接页面帖子。图像的大小最大为 8MB。
所以有8MB的上限。
我遇到了同样的问题，然后我注意到我有一个不同的域用于 og:url
一旦我确定 og:url 和 og:image 的域相同，它就可以工作了。
希望这可以帮助。
当站点的 https 证书不完全兼容时，可能会出现类似的症状（Facebook 等人无法通过 https 正确获取 og:image 和其他资产）。
您网站的 https 证书可能看起来有效（浏览器中的绿键和所有证书），但如果缺少中间证书或链证书，它将无法正确抓取。这可能会导致浪费大量时间检查和重新检查所有各种缓存和元标记。
可能不是你的问题，但可能是其他有类似症状的问题（比如我的）。有很多方法可以检查您的证书 - 我碰巧使用的一种方法：https://www.sslshopper.com/ssl-checker.html
我可以从您的 URL 中看到 Debugger is retrieving 4 og:image tags。
第一个图像是最大的，因此加载时间最长。尝试缩小第一张图像或更改顺序以首先显示较小的图像。
此外，当您添加用户生成的故事（不使用 og:image）时也会出现此问题。例如：
POST /me/cookbook:eat?
recipe=http://www.example.com/recipes/pizza/&
image[0][url]=http://www.example.com/recipes/pizza/pizza.jpg&
image[0][user_generated]=true&
access_token=VALID_ACCESS_TOKEN
以上仅适用于http，不适用于https。如果你使用https，你会得到一个错误提示：Attached image () failed to upload
今天遇到了类似的问题，Sharing Debugger帮我解决了。 Facebook 似乎（目前）无法理解嵌入了 XMP 元数据的图像。当我用没有 XMP 元数据的版本替换我们文章中的图像并重新抓取页面（使用共享调试器）时，问题就消失了。十六进制编辑器将帮助您查看图像是否包含 XMP 元数据。
好的......我意识到这个线程很旧而且人满为患，但如果有人像我一样努力让他们的 og:image 标签在 Facebook 中正常工作，这对我有用的技巧：
不要使用此链接：
https://developers.facebook.com/tools/debug/sharing/?q=https%3A%2F%2Fwww.google.com
解决您的问题。或者如果你这样做了，立即向下滚动到底部并单击 Scrape VIA API。
资源管理器工具中显示了“调试”工具中未显示的错误。令人抓狂！！！ （在我的情况下，图像文件名中的空格在调试工具中默默地敲掉了我的图像，但它在资源管理器工具中显示了错误）。
我遇到了 og 图像不在 FB 卡上显示的另一个原因。此外，使用 FB scraper tool to debug the og meta tags，我可以确认我的 WordPress 页面中存在的所有 required tags，但我会收到以下文件下载错误，
提供 og:image，< https-link-to-jpg-image > 无法下载。这可能是由于几个不同的原因而发生的，例如您的服务器使用了不受支持的内容编码。爬虫接受 deflate 和 gzip 内容编码。
我有一种模糊的感觉，即图像格式有问题，图像的链接可以正常工作，但该消息似乎表明内容编码有问题。
经过大量搜索，我最终查看了 php extensions that are required for a WordPress server，发现 pho-exif 模块没有安装。 exif 模块将 exif metadata 写入所有上传的图像。因此，FB og 图像标签中使用的图像没有任何关联的 exif 元数据。
启用 exif 模块后，WordPress 允许为图像重置 exif 元数据（媒体库->选择和图像->编辑更多详细信息->映射 exif 元数据），图像现在按预期出现在 FB 卡上。
就我而言，爬虫似乎只是有一个错误。我试过了：
仅将链接更改为 http
删除结束空白
完全切换回http
重新安装网站
安装一堆OG插件（我用WordPress）
怀疑服务器有一个奇怪的错误配置，阻止了机器人（因为所有的 OG 检查器都无法获取标签，并且对我网站的其他请求不稳定）
这些都不起作用。这花了我一周的时间。突然间，它似乎又开始工作了。
这是我的研究，如果有人再次遇到这个问题：
是什么让 Open Graph 检查器无法检测 Open Graph 数据？
如果我没有对他们将阅读的主机的 root 访问权限，如何知道网站的哪些机器人？
👍 是什么让 Open Graph 检查器无法检测 Open Graph 数据？ - 让我们加密社区支持
👍 Crawler 无法获取图像，但添加一个全新的、唯一的查询字符串可以使其第一次工作 - Facebook for Developers
此外，除了 Facebook's Object Debugger 之外，还有更多检查器供您检查：OpenGraphCheck.com、Abhinay Rathore's Open Graph Tester、Iframely's Embed Codes、Card Validator | Twitter Developers。
我有一个 Wordpress 网站，它使用 og:image 和图像的 https URL，图像在 Facebook 预览链接中显示得很好。
我正在处理另一个使用带有 https URL 的 og:image 的网站，有时图像会出现，有时它们不会出现。我尝试了此页面上的建议，使用 og:image:url 和 og:image:secure_url 都没有任何区别，图像不会用于预览。
两个站点都有有效的 https 证书，所以这不是证书问题。
在搜索了更多之后，我发现 Facebook 有一个 MINIMUM SIZE 图片。如果 og:image 小于 200x200 像素，Facebook 将不会使用它。推荐的故事大小为 600x600 像素，其他所有内容为 1200x630 像素。
我在第二个网站上放大了图片尺寸，它们开始出现在 Facebook 上。谜团已揭开。
希望您觉得这个有帮助。
我来到这里是因为更新的 facebook 元标记图像没有显示在 facebook 共享上。
对于其他陷入这种困境的人来说，原因很简单，就是您需要让 Facebook 来scrape your site again。
一旦你这样做，它将按预期显示。
我正在使用指向 s3 存储桶的云端分发来提供静态图像...我的云端起源设置为将 http 重定向到 https...所以也许这与它有关？
不管...
将 og:image 从 https 更新为 http 为我解决了这个问题，图像现在被发布到带有我网站链接的 facebook 帖子。
更新：上述行为继续发生......任何时候我要更改 og:image url，或使我的 cloudFront 缓存无效，图像将在 FB 调试器上工作，但图像永远不会出现在 FB 上。
我为我的 og:image 端点添加了一个新行为，并将 min ttl、max ttl 和默认 ttl 设置为 0。现在一切正常……不理想，因为我希望它被缓存，但显然 FB 可以'不处理云端 304 响应？
根据我的观察，我看到当您的网站是公开的并且即使图像 url 是 https 时，它也可以正常工作。
对我来说，这很有效：
<meta property="og:url" content="http://yoursiteurl" />
<meta property="og:image" content="link_to_first_image_if_you_want" />
<meta property="og:image" content="link_to_second_image_if_you_want" />
<meta property="og:image:type" content="image/jpeg" />
<meta property="og:image:width" content="400" />
<meta property="og:image:height" content="300" />
<meta property="og:title" content="your title" />
<meta property="og:description" content="your text about homepage"/>
经过几个小时的测试和尝试......
我尽可能简单地解决了这个问题。我注意到他们在 Facebook 开发人员页面中使用“测试页面”，其中仅包含“og”标签和引用此 og 标签的正文标签中的一些文本。
那我做了什么？
我在我的应用程序中创建了第二个视图，其中包含他们使用的相同内容。
我怎么知道 Facebook 正在访问我的页面，以便我可以更改视图？他们有一个独特的用户代理：“facebookexternalhit/1.1”
更新元标记后，确保内容（图像）链接是绝对路径，然后转到 here https://developers.facebook.com/tools/debug/sharing 输入您的站点链接并点击下一页中的 scrape again
关注公众号
不定期副业成功案例分享
See exactly what our scraper sees for your URL点击它并查看它是否显示您的链接已完成来源或剥离任何东西。如果设置了错误的charset，那么刮板由于某种原因将无法刮（我前一段时间曾用这个问题回答过类似的问题）。因此，请确保所有这些事情都是正确的。og:image标签可以是 HTTPS（这是 StackExchange、YouTube、WordPress.com、Amazon 等所做的）。这有点让您想知道og:image:secure_url的真正用途是什么？