FB OpenGraph og：图像不拉图像（可能是https？）
首先 – 我不相信这是一个重复的问题。 我已经在SO上search了相同或相似的问题，而且由于问题的性质，我相信这个问题是独一无二的。
Facebook不能抓住我的og:image文件，我已经尝试了所有常用的解决scheme。 我开始认为这可能与https://...
- 我检查了http://developers.facebook.com/tools/debug并没有任何警告或错误。
- 它是在“
og:image”中find我们链接的og:image，但是它们显示为空白。 然而，当我们点击图像时，它们确实存在，并且对它们是直接的。 - 它会显示一个图像 – 一个托pipe在非https服务器上的图像。
- 我们尝试了方形图像，JPEG，PNG，更大的尺寸和更小的尺寸。 我们把这些图片放在public_html里。 零显示。
- 这不是一个caching错误，因为当我们添加另一个
og:image元，FB的linter确实find并阅读。 它显示预览。 预览是空白的。 我们唯一的例外是不在这个网站上的图像。 - 我们认为可能是
cpanel或者.htaccess上有一些防止图像出现的反向过滤，所以我们检查了一下。 这没有。 我们甚至在一台完全不同的服务器上做了一个快速的< img src="[remote file]" >，图像显示正常。 - 我们认为也许这是
og:type或另一个元标记的另一个怪胎。 我们把它们全部删除，一次一个，然后检查。 不用找了。 只是警告。 - 不同网站上的相同代码显示没有任何问题。
- 我们认为可能是因为我们使用多个产品的相同产品页面（基于获取值，即“details.php？id = xxx”）来改变它，但它仍然在拉一个图像图像（来自不同的url）。
- 离开任何
og:image或image_src，FB没有find任何图像。
我在绳索的尽头。 如果我说过自己和别人花了多less时间，你会感到震惊。 问题是这是一个在线商店。 我们绝对肯定不能有图像。 我们必须。 我们有十个左右的其他网站…这是唯一一个与og:image问题。 这也是https上唯一的一个，所以我们认为这可能是问题所在。 但是我们在网上找不到任何先例。
这些是meta标签：
<meta property="og:title" content="[The product name]" /> <meta property="og:description" content="[the product description]" /> <meta property="og:image" content="https://www.[ourwebsite].comhttp://img.dovov.comshirts/overdriven-blues-music-tshirt-details-black.png" /> <meta property="og:image" content="https://www.[ourwebsite].comhttp://img.dovov.comshirts/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].comhttp://img.dovov.comARShopHeader.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].comhttp://img.dovov.comshirts/overdriven-blues-music-tshirt-details-black.png" /> <meta name="keywords" content="[four typical keywords]"> <meta name="robots" content="noarchive">
如果您需要，请点击以下链接到我们正在开发的产品页面之一。 [链接缩短，试图遏制这进入我们的网站的search结果]： http : //rockn.ro/114
编辑—-
使用“看看什么Facebook看到”刮刀工具，我们能够看到以下内容：
"image": [ { "url": "https://www.[httpSwebsite].comhttp://img.dovov.comshirts/soul-man-soul-music-tshirt-details-safari.png" }, { "url": "https://www.[httpSwebsite].comhttp://img.dovov.comshirts/soul-man-soul-music-tshirt-art-safari.png" }, { "url": "http://www.[theotherNONSECUREwebsite].com/wp-content/uploads/2011/06/ARS-Header-Shine2.png" } ],
我们testing了为单个页面find的所有链接。 所有的都是非常有效的图像
编辑2
我们尝试了一个testing，并在NONSECURE网站上添加了一个子域 （通过Facebook实际上可以看到图像）。 子域名是http：// img。[nonsecuresite] .com。 然后我们把所有的图像放到主子域文件夹中并引用它们。 它不会将这些图像拖入FB中。 但是，它仍然会拉取在不安全的主域上引用的任何图像。
张贴替代方法—-
感谢Keegan，我们现在知道这是Facebook的一个bug。 为了解决这个问题，我们在一个不同的非HTTPS网站中放置了一个子域名，并将所有的图像都放入其中。 我们在每个产品页面上引用了协调http://img.otherdomain.com/[like-image.jpg]图片。 然后，我们必须通过FB Linter并运行EVERY链接来刷新OG数据。 这工作，但解决scheme是一个创可贴的解决方法，如果https问题是固定的，我们回到使用自然的https域，FB将caching来自不同网站的图像，使事情复杂化。 希望这些信息可以帮助别人免于丢失32个编码小时的生命。
我遇到了同样的问题，并将其作为Facebook开发者网站上的一个错误报告。 og：使用HTTP的图像URI工作得很好，而使用HTTPS的URI没有。 他们现在已经承认他们正在“看着这个”。
该错误可以在这里看到： https ： //developers.facebook.com/bugs/260628274003812
一些属性可以附加额外的元数据。 这些指定方式与其他具有property和content元数据相同，但该property将具有额外的：
og:image属性有一些可选的结构化属性：
-
og:image:url– 与og：image相同。 -
og:image:secure_url– 如果网页需要使用HTTPS，则使用备用url。 -
og:image:type– 此图像的MIMEtypes。 -
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" />
因此，您需要将HTTPSurl的og:image属性更改为og:image:secure_url
例如：
HTTPS META标签用于图像：
<meta property="og:image:secure_url" content="https://www.[YOUR SITE].comhttp://img.dovov.comshirts/overdriven-blues-music-tshirt-details-black.png" />
HTTP META标签的图像：
<meta property="og:image" content="http://www.[YOUR SITE].comhttp://img.dovov.comshirts/overdriven-blues-music-tshirt-details-black.png" />
来源： http : //ogp.me/#structured < – 您可以访问此网站以获取更多信息。
希望这可以帮助你。
编辑：不要忘记更新您的代码后，Facebook的Facebook服务器 – URL Linter
我不知道，如果只有我，但对于我og:image不起作用，它挑选我的网站标志，即使脸谱debugging器显示正确的图像。
但是改变og:image到og:image:url为我工作。 希望这可以帮助其他人面临类似的问题。
从谷歌到这里，但这对我没什么帮助。 事实certificate，标志所需的最小长宽比为3：1。 矿几乎是4：1。 我用Gimp把它裁剪到3：1，呃 – 我的标志现在显示在FB上。
我有同样的错误，没有以前没有帮助，所以我试图按照原始文档的开放graphics协议 ，我添加到我的HTML标签的前缀属性，一切都变得真棒。
<html prefix="og: http://ogp.me/ns#">
t – 博士 – 耐心等待
我在这里结束了，因为我看到从https网站提供的空白图像。 但问题是完全不同的：
当内容被首次共享时，Facebook抓取工具将从共享的URL中抓取和caching元数据。 抓取工具在呈现之前必须至less看一次图片。 这意味着共享一段内容的第一个人将看不到渲染的图像
[ https://developers.facebook.com/docs/sharing/best-practices/#precaching%5D
在testing的同时，Facebook花了大约10分钟才终于显示渲染的图像。 所以，当我在抓我的脑袋，在Facebook上随意扔og标签（并且怀疑这里提到的https问题）时，我所要做的就是等待。
由于这可能真的阻止人们第一次分享你的链接，所以FB提出了两种方法来规避这种行为：a）在你所有的链接上运行OG Debugger：图像将被caching并准备在〜10分钟之后共享或者b ）指定og：image：width和og：image：height。 （阅读更多在上面的链接）
仍然想知道是什么让他们这么久…
我遇到了同样的问题，然后我注意到，我有一个不同的域名为og:url
一旦我确定这个域是相同的og:url和og:image它的工作。
希望这可以帮助。
不要忘记通过以下方式刷新服务器：
Facebookdebugging器
然后点击“收集新的信息”
我可以看到debugging器正在从您的URL中检索4个og:image标签 。
第一张图片是最大的，因此加载时间最长。 尝试缩小第一张图片或更改顺序以先显示较小的图片。
我有类似的问题。 我删除了属性=“og：image：secure_url”，现在只用og：image擦洗。 有时候，less就是多
另外，当你添加一个用户生成的故事（你不使用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，则会显示错误消息：附加的图片（）无法上传
我发现了另一个可能导致这个问题的情况。 我经历了问题和答案中描述的所有步骤，仍然存在问题。
我检查了我的图像，发现我的一些post在几千像素和几兆字节的范围内有og:image中的太大缩略图图像。
发生这种情况是由于最近从WP到Jekyll的迁移，我优化了我的图像，但是在错误地使用了原始图像。
截至今天，Facebook给了我们以下build议 ：
使用至less1200 x 630像素的图像以获得高分辨率设备的最佳显示效果。 至less应该使用600 x 315像素的图像来显示带有较大图像的链接页面post。 图像大小可以达到8MB。
所以有一个8MB的上限。
正如我意外地发现，透明的空白图像带有响应标题，指示问题的可能原因。
- 转到debugging器https://developers.facebook.com/tools/debug/og/object/
- 把你的url
- 在底部，Facebook显示你的“图像”（透明的1×1 GIF）
- 图像链接到您的原始图像 – 没有点按它
- 按右键查看图像（你会得到像
https://external-ams3-1.xx.fbcdn.net/safe_image.php?d=...&url=...）
- 打开萤火虫/开发者工具的Net标签页，如果需要刷新页面
- 您将得到
x-error-detail响应标题和解释
例如，在我的情况下，它是Invalid image extension for URL: https://[mydomain]/[myfilename].jpg
在我的情况下真正的问题是与prerender.io 。
事实certificate，如果图像通过预渲染被请求，它被转换成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>
它或者是预渲染本身的错误，或者是应该在代理中configuration为不对*.jpg请求使用预渲染（即使它们是由Facebook bot请求的）。
prerender仅用于某些用户代理标题，因此很难注意到这一点。
从我观察到的，我看到，当你的网站是公开的，即使图像的URL是https，它只是正常工作。
在我的情况下，问题是没有提供CA根证书 。 在使用https://www.ssllabs.com/ssltest/analyze.html来分析SSLconfiguration之后，我想到了它。;
经过几个小时的testing和尝试…
我尽可能简单地解决了这个问题。 我注意到他们在Facebook开发者页面里面使用“testing页面”，其中只包含“og”标签和一些正文标签中的一些文本，这些文本包含了这个标签。
那么我做了什么？
我在我的应用程序中创build了第二个视图，包含他们使用的相同的东西。
而我怎么知道Facebook访问我的网页，所以我可以改变视图？ 他们有一个独特的用户代理：“facebookexternalhit / 1.1”
