Since we've made our website SSL secure and PCI compliant, Facebook open graph scraper can no longer read the open graph meta tags. Here's a sample of our code for the meta tags in the {head} of https://FantasyDecathlon.com
<meta property="fb:app_id" content="576816272427310" />
<meta property="fb:admins" content="223653" />
<meta property="og:title" content="FantasyDecathlon: The world series of fantasy sports" />
<meta property="og:type" content="website" />
<meta property="og:site_name" content="The FantasyDecathlon" />
<meta property="og:image" content="https://fantasydecathlon.com/img/logo.jpg" />
But Facebook Open Graph scraper gives the error:
Curl Error : SSL_CONNECT_ERROR Unknown SSL protocol error in connection to fantasydecathlon.com:443
and
Object at URL 'https://fantasydecathlon.com/' of type 'website' is invalid because a required property 'og:title' of type 'string' was not provided.
And when we click on the link for what the Facebook Open Graph scraper sees for our URL, it returns null.
For our SSL setup, we would prefer not to loosen the restrictions since it's important for us to maintain PCI compliance.
Any ideas?
Fixed! We made a number of updates, but we believe the fix was a bug with our DNS records. We removed a couple of duplicates and we added new records with directly to our 2 server nodes.
Thank you everyone for your help!
Related
I have all my metadata in my NextJS app, they are put on the root page, so the metatada appear well on my view source's page. But my Facebook open graph seems to don't reach them for an unknown reason to me.
Here my ReactJS:
<Head>
<title> Test 02 </title>
<meta property="og:title" content="An awesome endless memories's title" />
<meta property="og:url" content="somepath/digital-marketing/website-digital-gq" />
<meta property="og:description"
content="Sean Connery found fame and fortune as the
suave, sophisticated British agent, James Bond." />
<meta property="og:site_name" content="IMDb" />
<meta property="og:locale" content="en_US" />
<meta property="og:locale:alternate" content="en_GB" />
<meta property="og:locale:alternate" content="cn_CN" />
<meta property="og:image" content={localImage} />
<meta property="og:image:width" content="1600" />
<meta property="og:image:height" content="800" />
</Head>
Facebook's Sharing Debugger returns me
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
Could Not Connect To Server Check that the webserver is running, and that there
are no firewalls blocking Facebook's crawlers.
Curl Error Curl error: 56 (RECV_ERROR)
Honestly, I don't have even the beginning of a clue on this story, really, if someone has any hint, would be great,
thanks
Answer - thanks to the hints in the comments.
when you use some URI for your Facebook Open Graph, be sure to target a vali URL, seems to be exclusively the root page of your component in case of NextJS, other languages/libraries/framework could probably follow a similar pattern.
You can set it directly in the facebook sharing link in your code as following:
https://www.facebook.com/sharer/sharer.php?u=[your_operational_url]
you are not obliged to encode the URL if I trust the result of my tests. So just the text of your URL should be enought.
Good builds.
I keep getting the below error from Facebook -
Object at URL 'https://qa.recrouter.com/displayJob/Y6LtGNI0WH1rVndaKCwv4PUZkM925mcq' of type 'website' is invalid because a required property 'og:title' of type 'string' was not provided.
However when I go to the debugger and see what the scraper sees, I see the below information is indeed contained in the page -
<meta property="og:type" content="website">
<meta property="og:title" content="Pega Developer for Insurance Claims">
<meta property="og:description" content="
We are a leading provider of insurance products for commercial and institutional customers through one of the world’s most far-reaching property casualty networks. We offer some of the industry’s most extensive ranges of products and services, ...">
<meta property="og:site_name" content="Recrouter">
<meta property="og:url" content="https://qa.recrouter.com/displayJob/Y6LtGNI0WH1rVndaKCwv4PUZkM925mcq">
<meta property="og:image" content="https://qa.recrouter.com/img/logo512h.png">
<meta property="og:image:type" content="image/png">
What am I missing?
I don't get this error when I check your URL on the debugger, the og:title tag seems to work perfectly. Try to have a look again ;)
I fixed it - essentially, the error was due to a modification I had made to the tag. To accomodate google sharing, I had modified the HTML tag to be as follows -
<!DOCTYPE html itemscope itemtype="schema.org/website">
I changed this back to <!DOCTYPE html> and everything works
I have been struggling with this for many hours now and have not gotten anywhere.
I have the following metatags:
<meta property="og:type" content="website" />
<meta property="og:title" content="I'm going to see Speaker name" />
<meta property="og:description" content="This is the description of the speaker" />
<meta property="og:url" content="http://example.com/Speakers.aspx?speaker=35" />
<meta property="og:image" content="http://example.com/test.jpg" />
<meta property="og:image:width" content="600">
<meta property="og:image:height" content="315">
After running this URL through the Facebook debug tool, I was given the following error message:
Object at URL 'http://example.com/Speakers.aspx?speaker=35' of type 'website' is invalid because a required property 'og:image:url' of type 'url' was not provided.
According to Open Graph protocol (http://ogp.me/#structured), the og:image & og:image:url are identical, but I tried to add it anyways:
<meta property="og:image:url" content="http://example.com/RGDDT/images/test.jpg" />
<meta property="og:image:type" content="image/jpeg" />
However the first 7 images on the page are still being scraped instead of the one I want to use.
Any insights would be greatly appreciated!
This is probably the best article on which metatags you need. Facebook requires you to have an id, in order to use even a Like button now a days. I don't see those metatags in your snippet. Try adding:
<meta property="fb:app_id" content="1111111111111111" />
<meta property="fb:admins" content="2222222222" />
The first is your app_id number, it seems you need to turn even your blog into an app to make Facebook happy. The second is your personal id number, you can also use your Fan Page if you have one. Including these things seems to make Facebook happy and I think you get Analytics for your troubles.
So I've finally solved this problem.
Problem #1: I was using 'permanent' URLs (/getmedia/3c87abee-1cd0-4ca3-a07d-b7d8fde8ec4b/irma1.jpg.aspx?width=437&height=434&ext=.jpg) instead of 'direct' URLs (/RGDDT/media/RGDDT/Speakers/facebook-share/irma-boom.jpg?width=600&height=315&ext=.jpg). This was a setting I was able to configure in Kentico (the CMS we have used to build this site)
Problem #2: I was getting the results I wanted in the Facebook debug tool, but they were being cached when I tried to share from the live site. Thanks to this article I was able to solve that problem by adding '&v=1' (or '?v=1' if you don't already have a query string at the end of your URL), so Facebook considered this a new page request and didn't cache the description I had hardcoded in as of this morning.
When I try and scrape my URL, http://development.classroom.me.uk, with the Facebook debugger at https://developers.facebook.com/tools/debug, I get back information for an older version of the website on an IP address that is no longer hosting this site.
The original IP was 46.32.233.216, but the new IP is 212.67.215.188.
I have another website running on the new IP:
http://advert.classroom.me.uk
This website gets scraped without any issues, so this is not a firewall problem.
Facebook is caching the domain http://development.classroom.me.uk with the old IP, which is why the scraper is returning a 502 [bad gateway] response. It is retrieving out of date data, but unable to actually return the URL:
Go to http://development.classroom.me.uk, and view source.
In the document head, you will see:
<meta property="og:title" content="classroom" />
<meta property="og:description" content="classroom provides a digital communication platform for teachers and students" />
<meta property="og:type" content="website" />
<meta property="og:image" content="http://development.classroom.me.uk/images/logo/logo-facebook.png" />
<meta property="og:url" content="http://development.classroom.me.uk" />
Go to https://developers.facebook.com/tools/debug, and type in http://development.classroom.me.uk into the input field. Press 'Debug'
I would expect to see information about the Facebook meta tags provided above.
I actually see data from an old version of this website held on an IP address that no longer hosts this site. In fact the old website contains no Facebook meta tags at all, which is why you can see data being scraped from the HTML title & standard meta description tag, instead...
Can anyone provide a solution for how I can clear the Facebook proxy cache. I have tried submitting this issue several times on Facebook, but no one from Facebook has provided me with a proper solution...
Thanks in advance
OK. With the help of the Facebook IT Department, we got to the bottom of this one. Indeed, the data was being cached. This was not a firewall issue, as I suspected, even though I was told repeatedly that it was.
I placed a new index page up at http://development.classroom.me.uk on my new IP 212.67.215.188
The page contained an HTML skeleton. See below [note, I placed no data in the document body]:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta http-equiv="Content-Style-Type" content="text/css" />
<meta name="keywords" content="classroom, home, yoga, indian head massage, tai chi, feng shui, united kingdom, therapy" />
<meta name="description" content="classroom provides a digital communication platform for teachers and students" />
<meta name="robots" content="index, follow" />
<meta property="og:title" content="classroom" />
<meta property="og:description" content="classroom provides a digital communication platform for teachers and students" />
<meta property="og:type" content="website" />
<meta property="og:image" content="http://development.classroom.me.uk/images/logo/logo-facebook.png" />
<meta property="og:url" content="http://development.classroom.me.uk" />
<title>classroom</title>
</head>
<body>
</body>
</html>
I then used the Facebook debugger at https://developers.facebook.com/tools/debug to scrape this address again. Voila. The page returned a 200 response & the correct meta data.
The cache has been cleared.
Unfortunately, when I returned the correct index page back to http://development.classroom.me.uk, I still get a 502 response from the Facebook debugger. However, the important thing, is that the correct meta data & image remain.
I am going to try and work out why I am getting the 502 response, and when I do, I will let you know. I thought I would write up the answer now, as I know several developers have been troubled by this issue..
I'm trying to define a Facebook Open Graph Object for the URL http://www.storeyourboard.com. Therefore, I include a Facebook meta tag for this URL in my code:
<meta property="og:url" content="http://www.storeyourboard.com" />
I would like to specify the image used for this object. Therefore, I include a Facebook meta tag for this image in my code:
<meta property="og:image" content="http://spirecollective.com/temp/gopro/img/gopro_promo.jpg" />
The URL on which I am trying to create this object is located here: http://spirecollective.com/temp/gopro/
I used the Facebook debug tool to see if the object is created successfully. You can repeat this by visiting the Open Graph Object Debugger and debugging the url mentioned above.
As you will see, the Facebook scraper seems to be ignoring all of the meta tags on my page, and instead being redirected to the og:url location. It's then reading the meta tags from that page instead of the ones specified on my website.
Here are all of the meta tags on my site for reference:
<meta property="og:title" content="I just registered to win a GoPro Hero 3 Camera!" />
<meta property="og:site_name" content="StoreYourBoard.com" />
<meta property="og:description" content="StoreYourBoard.com features board racks and accessories for however you shred. Reshare this post to be entered to win a GoPro Hero 3 camera!" />
<meta property="og:url" content="http://www.storeyourboard.com" />
<meta property="og:image" content="http://spirecollective.com/temp/gopro/img/gopro_promo.jpg" />
Is this the intended behavior? Why is Facebook ignoring all of my meta tags? The open graph object documentation does not mention anything that would make me think this is expected behavior. Am I missing something here? Thank you very much for the help!
Your og:url should be
http://spirecollective.com/temp/gopro/
and not
"http://www.storeyourboard.com"
From http://ogp.me/#metadata:
og:url - The canonical URL of your object that will be used as its permanent ID in the graph, e.g., "http://www.imdb.com/title/tt0117500/".