facebookshare-open-graph

OG Tags via php


I'm trying to make a very simple game.

a) I let the user input his name;
b) I put this name in a canvas;
c) I generate an image (base64) whit canvas.toDataRL() and I create an image file sending the base64 URI to a php file. I'm doing it with this code:

JAVASCRIPT:

var canvas = document.getElementById("myCanvas");
    var dataURL = canvas.toDataURL("image/jpeg", 0.2);
    //console.log(dataURL);

    // post the dataUrl to php
    $.ajax({
        type: "POST",
        url: "upload.php",
        data: {image: dataURL}
        }).done(function( respond ) {
            console.log(respond);
    });

UPLOAD.PHP

<?php
if ( isset($_POST["image"]) && !empty($_POST["image"]) ) {
    $dataURL = $_POST["image"];
    $parts = explode(',', $dataURL);  
    $data = $parts[1];
    $data = base64_decode($data); 
    // create a temporary unique file name
    $file = "img/" . UPLOAD_DIR . uniqid() . '.png';
    // write the file to the upload directory
    $success = file_put_contents($file, $data);
    print $success ? $file : 'Unable to save this image.';
}
?>

d) Now I'd like to use this image that I've created to set the og:image tag (to share it on Facebook)! How can I do? I've honestly no idea.

Thank you!


Solution

  • I've found out the solution. I pass the respond via get to another php page that catch the get parameter and put it in the og:image'content part.