Error displaying blob image in php/html

Question

I am trying to display image from a blob field of a MySQL table. Looks like I have some sort of error in the following line. As soon as I put "header("Content-type: image/jpeg")" things get messed up and instead of displaying webpage, all source code of the page is displayed.

Please let me know how to correct.

<div class="image" align="left">
    <a href="<?php header("Content-type: image/jpeg"); echo $rec['image']; ?>">
        <img src="<?php echo $rec['image']; ?>" width="150" border="0"/>
    </a>
</div><!-- image -->

Change `"Content-type: image/jpeg"` to `'Content-type: image/jpeg'`. You are nesting `"` — karthikr, Jun 03 '13 at 03:16
That's not the issue, and isn't actually nesting, since the header `"`s are in PHP — jcsanyi, Jun 03 '13 at 03:20
Don't use any header. just echo the blob content in src attribute. — Chetan Bhopal, Jun 03 '13 at 06:09

score 1 · Answer 1 · edited May 23 '17 at 12:05

1

You normally don't put the actual image contents in the src= attribute of the image tag. Instead, you point to the URL of an image file.

(There are ways to include the image source directly in the HTML, but it doesn't work consistantly with all browsers, and you still won't have your <a> link working properly.

Instead, the best way to do this is to create a separate PHP file to serve the image.

Your HTML:

<div class="image" align="left">
<a href="myimage.php?key=<?php echo($key) ?>"><img src="myimage.php?key=<?php echo($key) ?>" width="150" border="0"/></a>
</div><!-- image -->

myimage.php:

<?php
    header("Content-type: image/jpeg");
    $key = $_GET['key'];
    // todo: load image for $key from database
    echo $rec['image'];

edited May 23 '17 at 12:05

Community

1
1

answered Jun 03 '13 at 03:17

jcsanyi

8,133
2
29
52

How do I pass record key from main php to myimage.php? so that I fetch the same record which I am processing in the main program. – user2026794 Jun 03 '13 at 03:25
Updated my answer with a key variable – jcsanyi Jun 03 '13 at 03:27

score 0 · Answer 2 · edited Feb 12 '14 at 22:51

0

I've done something like that retrieving blob from my database in another way that you may find useful, here is the code example.. see if it suits your needs and if you needed anymore help let me know.

while ($row = mysql_fetch_array($hc_query2)) {
                        $title = $row['title'];
                        $text = $row['text'];
                        $image = $row ['image'];
                        $output ='<div class="HCInstance"><img src="data:image/jpeg;base64,' . base64_encode($image) . '" alt="High Council" width="100px" height="100px"/>
                        <div class="HCHeader"><h2>'.$title.'</h2></div><br/><div class="HCDetails"><p>'.$text.'</p></div></div>';
                        echo $output;
                    }

edited Feb 12 '14 at 22:51

rene

41,474
78
114
152

answered Jun 03 '13 at 03:26

Shady Manaa

44
9

In his original HTML, he had an `` tag around the image, linking to the image itself. It's impossible to do that with a `data:` url. – jcsanyi Jun 03 '13 at 03:28
hmm apparently you're right, but why does he link the image to itself? what kind of case could that be? – Shady Manaa Jun 03 '13 at 03:44

score 0 · Answer 3 · answered Jun 03 '13 at 03:28

0

You're trying to put the image data inline inside the content. The only feasible way to do this is via a Data URI data URI. Something like:

<img src="data:image/jpeg;base64,<?= base64_encode($rec['image']) ?>" width="150" border="0" />

However, what you probably want to do is put it into a separate script. So your HTML would be:

<a href="showimage.php?id=XXX"><img src="showimage.php?id=XXX" width="150" border="0" /></a>

And your showimage.php script would be:

<?php
// Get $rec from database based on the $_GET['id']
header('Content-Type: image/jpeg');
echo $rec['image'];
?>

answered Jun 03 '13 at 03:28

itsmejodie

4,148
1
18
20

Is it possible you are using IE7? Data URI's are only supported in IE8 and above, and in all versions of Chrome, Firefox, Safari and since Opera 7.2 – itsmejodie Jun 03 '13 at 04:06
I loaded an image manually using myPHPadmin and tried this code. It only displays lower 60% of the image.

Following is the CSS entry for image. .image{ width:155px; float:left; – user2026794 Jun 03 '13 at 19:17

Error displaying blob image in php/html

3 Answers3