Page 1 of 1

Embedding GD Images in a php page

Posted: Fri Jul 11, 2008 2:46 am
by Spartan101
I'm wondering if someone can point me in the right direction with the GD PHP Image Library. I've only just started using it and finding some of the methods a little restrictive to say the least... and very temperamental!

I've dynamically created a .png image which is based on user input and information obtained from a url. I then store the image in a location on the site so it can then be referred to using BB Code in a phpBB forum in a user's signature.

My question is that I want to allow the user to preview the signature that has been created prior to referring to it using a url. In order to do this in a functional way I need to be able to embed the image inside a webpage.

I can get the .png to display on it's own on a webpage using the imagepng() function. The problem is if I attempt to do an echo '<img src="http://someurl.com/folder/subfolder/blah.png" />'; I just get a message stating that the image contains errors. Clearly it doesn't because I can view it by accessing it directly through a browser.

Here's a snapshot of my GD code:-

Code: Select all

 
<?php
$gdfonts = array(
    '8x13iso', '9x15iso', 'andale12', 'atommicclock', 'bmreceipt',
    'chowfun', 'courier8', 'dimurph', 'georgia8', 'proggyclean',
    'proggysquare', 'systemex', 'terminal6', 'trisk'
);
 
//
//
//
 
if( !isset($image_info) || !isset($image_text) )
{
    exit;
}
 
//
//
//
$sz = @getimagesize(MAINDIR.'sigs/'.$custom_sig->get_sig_theme().'/'.$image_info['image']);
if( !$sz )
{
    exit;
}
$image_w = $sz[0];
$image_h = $sz[1];
 
//
//
//
@header('Content-type: image/png');
 
$im = @imagecreatefromgif(MAINDIR.'sigs/'.$custom_sig->get_sig_theme().'/'.$image_info['image']);
$rgb = ( isset($image_info['color']) ? $image_info['color'] : array(255, 255, 255) );
$bgColor = imagecolorallocate($im, $rgb[0], $rgb[1], $rgb[2]);
 
for( $i = 0; $i < count($image_text); $i++ )
{
    if( !is_numeric($image_text[$i]['font']) )
    {
        $font = 3;
    }
    else if( $image_text[$i]['font'] < 0 )
    {
        $font = $image_text[$i]['font'] * -1;
    }
    else
    {
        if( !($font = @imageloadfont('./gd_fonts/'.$gdfonts[$image_text[$i]['font']].'.gdf')) )
        {
            $font = 10;
        }
    }
    $rgb = $image_text[$i]['color'];
    $fgColor = imagecolorallocate($im, $rgb[0], $rgb[1], $rgb[2]);
    imagestring($im, $font, $image_text[$i]['x'], $image_text[$i]['y'], $image_text[$i]['text'], $fgColor);
}
 
// Calculate the path and filename
//echo "maindir " . MAINDIR;
$path = MAINDIR."images/signatures/";
$image_name = $pfuser. ".png";
$fpath = $path.$image_name;
 
// Get the contents of the png
 
ob_start();
imagepng($im);
$sImage = ob_get_contents();
ob_end_clean();
 
// Store on the disk
if(($handle = fopen($fpath,'w+b')) === FALSE){
        die('Failed to open file for writing!');
} else {
chmod($fpath, 0777);
fwrite($handle, $sImage);
fclose($handle);
 
//echo '<img src="'.MAINDIR.'images/signatures/'.$pfuser.'.png" />';
imagepng($im);
imagedestroy($im);
}
?>
 
The key part of it is referred to at the bottom. As you can see i've commented out the echo <img /> line because it didn't work!

I'm wondering if it's perhaps because i've declared the @header('Content-type: image/png'); which is why it's telling me my image is corrupt when I'm trying to print out any other html code. Is there any way around this??

Re: Embedding GD Images in a php page

Posted: Fri Jul 11, 2008 2:59 am
by onion2k
If you wanted to display a normal image you wouldn't open the file in a text editor and start adding HTML tags to the binary data would you? Of course not. When you create an image with GD the browser treats it in exactly the same way as a normal image. The only way to display it is to use an <img> tag in your HTML page. You cannot merge HTML and image data in the same file.

Re: Embedding GD Images in a php page

Posted: Fri Jul 11, 2008 6:49 am
by Spartan101
I've already tried to output the image using the following:-

Code: Select all

echo '<p>BB Code: </p><input type="text" value="\[img\]http://forumtest.runehints.com/dynsig/images/signatures/'.$pfuser.'.png\[/img\]" />';
(Obviously excluding the "\" escape characters since I need them to display it to you in full)

Like you said but to no avail. If I try that it throws an exception. What I don't understand is is how you can avoid this exception and display html on the same page?!

I understand exactly what you are saying... that any erroneous data that isn't of a recognised .png format will cause the image to be corrupt but what's wrong with echo 'ing out some data after I've called imagepng(). Surely imagepng() only considers the object $im that's passed to it to be part of the image and not any data before or after it??

Re: Embedding GD Images in a php page

Posted: Fri Jul 11, 2008 7:05 am
by onion2k
It you have any data at the end the of the image file the browser will think it's part of the image and it'll fail to display it properly. It's down to how browsers work:

You request a page.
Browser fetches the HTML.
Browser parses the HTML into a tree structure.
Browser looks through the tree for <img> tags.
Browser fetches each image required.
Browser renders the HTML (to a buffer outside of the screen usually).
Browser copies the images to the screen buffer with the images in the right places.

Modern browsers actually start rendering to the screen buffer before all the image data has downloaded in order to speed up the display process.

The image data is totally separate from the HTML. Any data in an image file will only affect that image. It can't affect the HTML or another image at all. If you want to display an image the only way to do it is with your page's HTML. You can't add things to the image hoping that it'll change the layout. Because it won't.

(Note: There is a slight caveat here - it is actually possible to embed image data in HTML in IE. It's not cross-browser compatible though, so I won't go into here.)

Re: Embedding GD Images in a php page

Posted: Fri Jul 11, 2008 7:10 am
by Spartan101
Edited Post:
I still get the following error even when I tried the code below.

All i'm doing is referring to the following image in src"":-
http://forumtest.runehints.com/dynsig/i ... aogier.png

Code: Select all

 
chmod($fpath, 0777);
fwrite($handle, $sImage);
fclose($handle);
 
echo '<img src="'.MAINDIR.'images/signatures/'.$pfuser.'.png" />';
//imagepng($im);
//imagedestroy($im);
 
Any ideas what's wrong? Why doesn't the echo work??

I get the following error if I try the above script --

"The image “http://forumtest.runehints.com/dynsig/image.php” cannot be displayed, because it contains errors."

Not particularly helpful :(

Thanks for your input onion2k

Re: Embedding GD Images in a php page

Posted: Fri Jul 11, 2008 7:56 am
by onion2k
That error is because you have a content-type header for an image, eg image/png, followed by non-image data.