Facebook shows blank image and preview after sharing a HTTPS link from my website

Question

My site before was only HTTP. I used that website for sharing public information with my friends. I like to post news that I want then share it to Facebook and when I post a link (HTTP link since my website is still HTTP) on Facebook, it pulls og tags correctly from my site.

Yesterday I just moved my site from HTTP to HTTPS by getting free CloudFlare SSL. I redirect my website to HTTPS and checked mixed content errors and there is none. Now, when I share any my posts (which is now HTTPS) on Facebook, it just shows my my domain name (example.com) for the title and the description instead of the og:title and og:description I specify in my meta tags.

My friend says that I have the og tags set currently in my site:

<title>My site</title>
<meta name="description" content="Example description" />
<meta name="robots" content="follow,index" />
<link rel="canonical" href="https://example.com/url-path/" />
<meta property="og:locale" content="en_US">
<meta property="og:type" content="article">
<meta property="og:title" content="Mysite">
<meta property="og:description" content="Example description">
<meta property="og:url" content="https://example.com/url-path/">
<meta property="og:site_name" content="MySite">
<meta property="article:publisher" content="https://www.facebook.com/examplefbpage">
<meta property="article:author" content="https://www.facebook.com/example">
<meta property="article:published_time" content="2019-09-14T11:49:14+00:00">
<meta property="article:modified_time" content="2019-09-19T02:39:08+00:00">
<meta property="og:updated_time" content="2019-09-19T02:39:08+00:00">
<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:title" content="Mysite">
<meta name="twitter:description" content="Example description">
<meta name="twitter:site" content="@exampletwitteruser">
<meta name="twitter:creator" content="@exampletwitteruser">

How do I fix this? Is this could be an Facebook cache issue or something?

Answer 1

I will make the assumption that the screenshot in your post is the Facebook debugger tool found here: https://developers.facebook.com/tools/debug/sharing

The first thing that I notice is that you are being returned a response code of 0. You should be getting a response code of 200.

This prompted me to think it was a caching issue, so I checked the domain through Facebook social sharing debugger myself. This was my result:

As you can see I received a response code of 503. Since you are coming from a migration from HTTP to HTTPS this most likely means that there is an issue with your hosting server(s).

I would begin with a ticket inquiring into the 503 response code to your hosting provider. Once this issue is sourced and resolved your OG image should populate as intended.