Images not displaying properly from mysql database

Question

i am trying to use mysql database and php to display a image in a table. Every other information in my table is displaying fine except for image, i am receiving this.

��JFIF�� ( %!1!1)....383,7*-.7 +%&-----5---+--------5-----+-------------------5-/---��"��B!1A"Qa2

In my table and this goes on for awhile. in my database i have images set to a blob and no null. I am using this code to display it.

 <?php 
          include 'connect.php';
          $results = mysqli_query($con, 'select * from products');    
          ?>
            <table cellpadding="3" cellspacing ="3" border="0">
                <tr>
                    <th>Image</th>
                    <th>Name</th>
                    <th>Description</th>
                    <th>Price</th>
                    <th>Buy Product</th>
                </tr>
                <?php

                 while($products= mysqli_fetch_object($results)){
                     if($products->id<=10){?>
                <tr>
                    <td><?php echo $products->images;?></td>
                    <td><?php echo $products->name;?></td>
                    <td><?php echo $products->description;?></td>
                    <td><?php echo $products->price;?></td>
                    <td><a href="cart.php?id=<?php echo $products->id; ?
 >">Add to Cart</a></td>
                </tr>
                 <?php }} ?>    
            </table>

Any help would be appreciated. Thank you.

In html you use an image tag with a source which is a reference to a file (or dynamically created one). What you are doing is to print out the blob data inside html. — axel.michel, Dec 04 '17 at 08:08

iivannov · Accepted Answer · 2017-12-04T08:34:01.840

First I have to say that storing image data in the database can be a bad idea especially when you have a lot of images. A slightly better approach might be to store just the path to the file and link to it in your html code.

Anyway, you have a problem and there is a solution. At the moment you are just displaying the BLOB contents, which is the raw binary data of the image. To display an image, you need an <img> tag with the right source.

Something like this:

<img src="data:image/jpeg;base64,<?= base64_encode($blob) ?>"/>;

In your exact case it will look more like this:

...
<td>
   <!-- JPG image -->
   <img src="data:image/jpeg;base64,<?= base64_encode($products->images) ?>"/>;
</td>
...

I'm glad I helped @harrison Please select my solution as the accepted answer, by clicking on the check mark beside the post, so it may help others too. — iivannov, Dec 04 '17 at 09:58

score 0 · Answer 2 · answered Dec 04 '17 at 08:11

0

Storing images in database is generally considered a bad idea, you should try to store the image path instead.

If you really need to do it that way, you need to use the correct tags to display them :

<td><img alt="" src="data:<?php echo $products->images;?>"></td>

For example, but please reconsider.

answered Dec 04 '17 at 08:11

François L.

21
6

Thank you but why would you consider storing images a bad practice? – harrison Dec 04 '17 at 08:24
For performances, ease of use and database size mainly. You can find many pro/cons on the web, for example : https://stackoverflow.com/questions/815626/to-do-or-not-to-do-store-images-in-a-database?noredirect=1&lq=1 – François L. Dec 04 '17 at 08:48

Images not displaying properly from mysql database

2 Answers2