Pass Base64 jpeg image to og:image

Question

I have image that is being generated in runtime on my website and I display it in html using

<img src="data:image/jpeg;base64,<!-- base64 data -->" />

Now, I want for Facebook to fetch this image, but if I do the same for og:image meta tag, facebook debugger gives me an error. Any solution?

<meta property='og:image' content='data:image/jpeg;base64,<!-- base64 data -->'/>

Of course, I would like to avoid permanent saving of files since they are always different and it would get too crowded very quickly

Answer 1

Paste it to a PHP file that echos it out:

    <meta property='og:image' content='decoder.php?data=<!-- base64 data -->'/>

decoder.php:

    <?php
        echo base64_decode($_GET['data']);
    ?>

EDIT Make sure you check source for security reasons.

Answer 2

Open Graph needs an URL.

You could try saving your base64 as a temp image.

Answer 3

If the images is saved in a db as a blob you can get the image using the following:

image_generator.php:

$imageID = $_GET['id'];

$image = // Fetch the image from database using an id;

// Set the appropriate content type for the image (e.g., JPEG)
header('Content-Type: image/jpeg');
    
// Output the image data directly
echo $image;

og tag creation:

$imageID = // id referred to the image
$imageUrl = "https://yoururl/image_generator.php?id=$imageID";
echo "<meta property='og:image' content='$imageUrl' />