I am trying to output an image to a browser and then output HTML (not directly related to the image) on the same page. Is this possible? I am having a heck of a time figuring it out. Here is my code I have been messing with:
<?php function LoadJpeg($imgname){ /* Attempt to open */ $im = @imagecreatefromjpeg($imgname); /* See if it failed */ if(!$im){ /* Create a black image */ $im = imagecreatetruecolor(150, 30); $bgc = imagecolorallocate($im, 255, 255, 255); $tc = imagecolorallocate($im, 0, 0, 0); imagefilledrectangle($im, 0, 0, 150, 30, $bgc); /* Output an error message */ imagestring($im, 1, 5, 5, 'Error loading ' . $imgname, $tc); } return $im; } header('Content-Type: image/jpeg'); $img = LoadJpeg('images/Ball.jpg'); imagejpeg($img); imagedestroy($img); //trying to start my text here header('Content-Type text/html; charset=utf-8'); echo "<br /><h2>ross</h2>"; ?>
Right near the bottom of my code is where I try to add in my html. when I run it, I only get the image, then no text after. If I try to move it to the top before the function, right after the opening php tag, the text works correctly, and then I get an error:
Warning: Cannot modify header information – headers already sent by (output started at /Applications/MAMP/htdocs/newimage.php:4) in /Applications/MAMP/htdocs/newimage.php on line 28
Any help would be greatly appreciated, thanks.
Advertisement
Answer
Stop and think for a moment. How would you normally embed an image in a HTML file? You create two files: text.html and image.jpg. Same here, you will create two scrips, one that outputs the HTML and one that generates the image. The HTML would look like:
<img src="generateimage.php" alt="generated image"/> <br/> <h2>ross</h2>
The generateimage.php
script only generates the image.
Lets take for example a form that allows the user to create a digital Christmas card: he can select the image and write a personal note beneath it.
form.html:
<html><body> <form action="view_card.php" method="post"> Select an image: <select name="imgname"> <option value="tree">Picture of Christmas tree</option> <option value="santa">Picture of Santa</option> </select><br/> Write a message: <textarea name="message"></textarea> <br/> <input type="submit" value="View Christmas card"/> </form> </body></html>
view_card.php:
<html> <body> Here is your Christmas card: <hr/> <!-- sending the requested image to the generateimage.php script as a GET parameter --> <img src="generateimage.php?imgname=<?php echo(urlencode($_POST['imgname'])); ?>"/> <?php echo(htmlspecialchars($_POST['message'])); ?> </body> </html>
generateimage.php:
<?php /* Stop evil hackers from accessing files they are not supposed to */ $allowed_files = array('tree' => 'tree.jpg', 'santa' => 'santa.jpg'); if( !isset($allowed_files[$_GET['imgname']])) { exit; // Thank you for playing... } /* Attempt to open */ $im = @imagecreatefromjpeg($allowed_files[$_GET['imgname']]); /* See if it failed */ if(!$im){ /* Create a black image */ $im = imagecreatetruecolor(150, 30); $bgc = imagecolorallocate($im, 255, 255, 255); $tc = imagecolorallocate($im, 0, 0, 0); imagefilledrectangle($im, 0, 0, 150, 30, $bgc); /* Output an error message */ imagestring($im, 1, 5, 5, 'Error loading ' . $imgname, $tc); } header('Content-Type: image/jpeg'); imagejpeg($im); imagedestroy($im); ?>