Upload imagecreatefrompng to server

Question

I am trying to upload an image created from Java's toDataURL, submitted in a form automatically with javascript, captured by PHP and converted using imagecreatefrompng() and assigned to a variable.

Here is the code to start with:

Javascript code:

if(getImageData == true){
    console.log("Saving avatar as image...");
    window.setTimeout(function () {
    imgData = renderer.domElement.toDataURL("image/png");
    document.getElementById('avatarimg').src = imgData;
    document.getElementById("timg").value = imgData;
    console.log(imgData);
    document.getElementById("form1").submit();
    console.log("Avatar saved as PNG img.");
}, 300);
getImageData = false;

PHP code:

if($_POST['timg']){
    $renderedav = imagecreatefrompng($_POST['timg']); 
    imageAlphaBlending($renderedav, true);
    imageSaveAlpha($renderedav, true);
    $target = "images/Avatars/";
    $newname = md5($_POST['timg']);
    echo ("<font color='#000000'>Image rendered. - " . $newname . " </font>"); 
     $target = $target . $newname . ".png";
     if(move_uploaded_file($renderedav, $target)) 
    {   echo("File uploaded."); }else{echo("Error uploading file.");}
}

When I display the image as a raw img using the imgData, everything looks great, but I want to create an actual image from that data and upload it to a directory on my database using the name created in $newname. Is this possible to do? Am I going about it correctly? I know move_uploaded_file() is intended to move a suspended file from a file form element to a new location, but in my research I couldn't find another method that does this.

Answer 1

There are a couple things here that are not going to work:

1. You can not write text over top by echoing some html, you have to use a gdlib text function like imagettftext(). One note, you have to point to a font file to use it (Resource here). If you are not trying to write this echo ("<font color='#000000'>Image rendered. - " . $newname . " </font>"); over top of the image, disregard this part of the script HOWEVER, you still can not do it because if you echo anything (or have empty space before your script), it will corrupt the image.
2. You have to use imagepng() (Resource here) to save the file.

PHP Script:

if($_POST['timg']){
    // Set file path info
    $target = "images/Avatars/";
    $newname = md5($_POST['timg']);
    $target = $target.$newname.".png";
    // Start gdlib functions
    $renderedav = imagecreatefrompng($_POST['timg']); 
    imagealphablending($renderedav, true);
    imagesavealpha($renderedav, true);
    $fColor_white = imagecolorallocate($renderedav, 255, 255, 255);
    // Path to truetype font
    $font = 'font.TTF';
    // Add text to image
    imagettftext($renderedav, 25, 0, 75, 300, $fColor_white, $font, "Image rendered. - ".$newname);
    // Here you output the png and use the second parameter to save to a destination
    imagepng($renderedav,$target);
    // Now you destroy the resouce
    imagedestroy($renderedav);
}