Tip for PHP/GD programmers: Outputting images and debug information together

[Steve]

Hi guys,

Been working on some image related stuff today, and when using libraries that spit out PNGs, it can be annoying when the PNG data gets corrupted by warning messages, stray echo/print statements etc. Of course, such things are very useful for debugging, so how do we view them without killing the image data integrity?

The obvious way is to output the image to file, but checking that file takes time. Here's how to get debug output and the resultant image on a single web page in one hit:

/* Code that might have warnings, print statements etc */

//Now catch the image output:
ob_start();
functionthatprintsimagestream();
$im = base64_encode(ob_get_contents());
ob_end_clean();
//Set content type in case output hasn't been flushed yet and image function has set type.
header('Content-type: text/html',true);
echo '<img src="data:image/png;base64,'.$im.'" alt="Thanks steve" />';

/* Anything else... */ 

Be sure to set the data mimetype up appropriately in the <img /> tag.

Obviously if you can get your image data without having to catch it using output buffers, that's great, and you can still base64_encode for inline output. I couldn't do this, however (easily).

The key here is the use of encoded data in the image tag, so in theory you could do this in other scripting languages supporting image manipulation.

[Jonatron]

Thanks Steve, I'll use this.