CODEWITHSUNDEEP
phphtmlpnglibpng
Robert
Robert

Reputation: 362

Display PNG with raw image data within an html document using PHP

With this code, I am trying to create an image of a signature from JSON and then display the image directly in the browser without saving it. The problem I have is I want to display this image within a HTML document so the header information has already been modified. Is there a way to display an image from it's raw image data within an HTML document? Or any other way around this issue?

$json = $ticket->sig; // get the json representing the signature
$img = sigJsonToImage($json);  //get image resource from json

    // HERE I WANT TO DISPLAY THE IMAGE BUT GET Cannot modify header information
header('Content-Type: image/png');
imagepng($img, null, 0, PNG_NO_FILTER);
imagedestroy($img);

Upvotes: 3

Views: 7894

Answers (2)

Lucas Teske
Lucas Teske

Reputation: 652

Sure, you can use two things together for this.

The HTML Image tag supports base64 encoded image. It can be big for html, but will work. Also you can output image to buffer using ob_start and ob_end functions. See https://www.php.net/manual/pt_BR/function.ob-start.php

So for PHP file you can do:

$json = $ticket->sig; // get the json representing the signature
$img = sigJsonToImage($json);  //get image resource from json

ob_start(); // Start buffering the output
imagepng($img, null, 0, PNG_NO_FILTER);
$b64 = base64_encode(ob_get_contents()); // Get what we've just outputted and base64 it
imagedestroy($img);
ob_end_clean();

// Print the HTML tag with the image embedded
echo '<img src="data:image/png;base64,'.$b64.'"/>';

This will make a HTML Img tag with the embedded image. Hope is this what you want.

PS: Keep in mind that this will increase the loading time for your HTML data, since browser opens another thread for downloading the image if you just link it.

Upvotes: 11

Lewis
Lewis

Reputation: 14866

You can try this

<img src="/path/to/yourimage.php">

In yourimage.php.

$json = $ticket->sig; // get the json representing the signature
$img = sigJsonToImage($json);  //get image resource from json

    // HERE I WANT TO DISPLAY THE IMAGE BUT GET Cannot modify header information
header('Content-Type: image/png');
imagepng($img, null, 0, PNG_NO_FILTER);
imagedestroy($img);

Upvotes: 2

Related Questions