og：image不起作用，除非我尝试使用“Open Graph Object Debugger” [英] og:image not working, except when I try with "Open Graph Object Debugger"

问题描述

我有一个网站，所有的 og：image 标签正确设置，它不起作用，除了当我使用打开图形对象调试器，显示我预期

一步一步（每一步都有图像）：

缓存的网址如...
（点击任何活动图片）

感谢提前给出任何帮助：）

解决方案

尝试在OG元标记中指定图像尺寸。

https：//developers.facebook。 com / docs / sharing / best-practices＃precaching ：

有两种方法可以避免[image不显示第一次分享]，并在第一张Like或Share动作中显示图片：

1. 预先缓存图片使用URL调试器[...]




2. 使用 og：image：width 和 og：image：height 打开图形标签
   
   使用这些标签将向抓取器指定图像，以便它可以立即呈现而无需异步。 （sic）

I have a website with all the og:image tags properly set and it does not work, except when I use the Open Graph Object Debugger, which shows me the expected preview.

Step by step (with an image for every step):

If I take a non-cached URL like... http://club.ad/andorra-la-vella/ca/activitat/activitats-infantils and I try to share it on facebook, this is what I get:

As you can see there's no image shown on the preview. In this case the first thing I do is check that the og:image is properly set. Checking the sourcecode of that link, we can read:

<meta property="og:image" content="http://club.ad/files/thumbs/activities-illustrative/10557110_m.jpg" />

And if we check the image URL, we get this:

activity's illustrative image http://club.ad/files/thumbs/activities-illustrative/10557110_m.jpg

The og:image tag is inside the head tag, so everything seems to be ok. Here's when I go to Facebook's Open Graph Object Debugger and I try the previously checked link.

The first time it says that that URL has not been cached, but it shows the preview pretty well:

Now that the request has been done from here, if I go back to facebook the preview is properly loaded:

And if we go back again to the Open Graph Object Debugger and we click on "Fetch new scrape information" there aren't errors nor warnings shown:

So, what's wrong with my website? Or what's wrong with facebook?

If you want to check it by yourself, take any URL from the websites' activities index (there are some of them that have been checked and thus will return the cached content):

http://club.ad/andorra-la-vella/ca/activitats (click on any activity image)

Thanks in advance for any help given :)

解决方案

Try specifying image dimensions in your OG meta tags as well.

https://developers.facebook.com/docs/sharing/best-practices#precaching:

There are two ways to avoid [image not being shown on first share] and have images render on the first Like or Share action:

1. Pre-cache the image with the URL Debugger […]

2. Use og:image:width and og:image:height Open Graph tags
   Using these tags will specify the image to the crawler so that it can render it immediately without having to asynchronously. (sic)

这篇关于og：image不起作用，除非我尝试使用“Open Graph Object Debugger”的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！