John Davidson

Message:

I'm using a php file to load images into my webpage, since they are hosted outside the webroot. Everything works well apart from Facebook not registering the image in an og:image metatag when they are loaded in this way.

Ironically, the page in question is https://www.molecularmagic.net/hosting/the.computing.cafe/www/index.php?t=3b3c55

The metatag in question is:

<meta property="og:image" content="https://www.molecularmagic.net/hosting/the.computing.cafe/www/file.php?f=feature_image.png">

The headers sent along with the image are:

accept-ranges: bytes

cache-control: public, max-age=604800

content-length: 243688

content-type: image/png

date: Sun, 06 Jun 2021 22:56:58 GMT

expires: Thu, 19 Nov 1981 08:52:00 GMT

last-modified: Sun, 06 Jun 2021 23:05:22 +0100

server: LiteSpeed

vary: User-Agent

In this case, Facebook Sharing Debugger gives me this error:

Provided og:image URL, https://www.molecularmagic.net/hosting/the.computing.cafe/www/file.php?f=featured_image.png could not be processed as an image because it has an invalid content type

For other pages, the og:image tag is:

<meta property="og:image" content="http://openmediavault/the.computing.cafe/www/images/feature_image.png?1623012347">

The numbers after the filename are the filemtime to force FB to reload the image if I change it. The headers sent with this image are:

accept-ranges: bytes

cache-control: public, max-age=604800

content-length: 183886

content-type: image/png

date: Sun, 06 Jun 2021 22:27:30 GMT

expires: Sun, 13 Jun 2021 22:27:30 GMT

last-modified: Sun, 06 Jun 2021 20:46:04 GMT

server: LiteSpeed

vary: User-Agent

...and Facebook Sharing Debugger correctly renders the image.

I've tried very hard to make sure that the headers when the image is sent through file.php are as close as possible to the headers sent from a 'real' image file.

I know that this is caused by serving the image through file.php but I cannot see why Facebook would tell me that the image has an invalid content type when the headers look identical.

Can anyone suggest why this might be the case?

---

My Answer:
The issue may be related to how Facebook's scraper tool processes images loaded via a PHP file. Facebook's scraper tool may not be able to access and retrieve the image when it is loaded dynamically through a PHP file.

One possible solution is to ensure that the PHP file is outputting the image in a way that Facebook's scraper tool can access it. This may involve setting appropriate headers, ensuring the image is publicly accessible, and using absolute URLs for the image source.

Additionally, you can try using a direct URL to the image in the og:image metatag instead of loading it through a PHP file. This way, Facebook's scraper tool can easily access and retrieve the image for display.

Overall, it is important to ensure that the image is accessible and properly formatted for Facebook's scraper tool to recognize and display it correctly in the og:image metatag.