View Image Stored in Database on Webpage

  • Avinash
  • 5
  • Jan 22, 2012
  • Tutorial

In earlier article we have check to store the image in database using the BLOB datatype. In this article we will check for how to display the images which are stored in database rather than images which are stored in specific folders.

If you have stored images in database then displaying those images is not just a task of giving the data in src tag.

For displaying these type of images we will have Image src just like below.

  <img src="/view_image.php?id=1" />
  <img src="/view_image.php?id=2" />
  <img src="/view_image.php?id=3" />

From the above code you will get that we have to create a php file which serves the based on ID which we have passed in the URL parameter.

So now create a new files with the name “view_image.php” and we have to place the below code in that file.

// some basic sanity checks if(isset($_GET["id"]) && is_numeric($_GET["id"])) { //connect to the db $link = mysql_connect("localhost", "username", "password"); if(!$link) { die("Could not connect: " . mysql_error()); } // select our database mysql_select_db("testimage") or die(mysql_error()); // get the image from the db $sql = "SELECT image FROM testimage WHERE image_id=".$_GET[id"]; // the result of the query $result=mysql_query("$sql") or die("Invalid query: " . mysql_error()); // set the header for the image // This is the line which does the trick. header("Content-type: image/jpeg"); echo mysql_result($result, 0); // close the db link mysql_close($link); } else { echo "Image ID not Set"; }
  // some basic sanity checks
  if(isset($_GET["id"]) && is_numeric($_GET["id"]))
  {
   //connect to the db
   $link = mysql_connect("localhost", "username", "password");
   if(!$link)
   {
     die("Could not connect: " . mysql_error());
   }
 
   // select our database
   mysql_select_db("testimage") or die(mysql_error());
 
   // get the image from the db
   $sql = "SELECT image FROM testimage WHERE image_id=".$_GET[id"];
 
   // the result of the query
   $result=mysql_query("
$sql") or die("Invalid query: " . mysql_error());
 
   // set the header for the image
   // This is the line which does the trick.
   header("
Content-type: image/jpeg");
   echo mysql_result($result, 0);
 
   // close the db link
   mysql_close($link);
  }
  else
  {
    echo "
Image ID not Set";
  }

Only one line is important which is header("Content-type: image/jpeg");, which instruct that the output of the view_image.php file is image and not the php code.

The line which does the trick is header(“Content-type: image/jpeg”);

So this is how you can show your images which are stored in database, if you are not sure about the earlier article about storing the image in database then you can refer to this article for the same.

Subscribe to our RSS feed to get the latest updates via mail.

Related Posts

Written by Avinash

Avinash Zala is leading various projects which deals with the various technology involved with the web. A combination of perfect technical and management skills. Avinash would like to chat with you and convert your imagination into the working system. You can get in touch with him on Facebook and Twitter.

View all posts by:

  • http://www.itsgotto.be/cv.php Rob

    I read your first article and now the follow up. I am glad someone wrote a simple howTo on this. However there are few things you may want to consider hopefully you don’t mind the feedback? I offer it because I too was working on a site and thought it would be fun to put the images in the database. I think it’s cool to do but in the real world probably not very good to do if the site is ever popular.

    1) When you store the images, store them with a “code” varchar 255 or similar. use php’s uniqid function generate this code when you are storing.

    2) When displaying the image, use the code from part 1. if you have a .php?id=1 =2 =3 =4. Some jerkus maximus can make a script and basically kill your site. Instead you will have .php?code=344ef1a…. not predictable.

    3) When someone requests an image and it doesn’t exists, save their IP some where. If they do it 3 times in 1 minute stop them from making more requests.

    In general this is a fun experimental idea and it does work, but in real world practice storing the image on the disk some where and store the location as a field in the DB. The apache server is the product of YEARS AND YEARS AND YEARS of work and refinement. Your MySQL is not going to ever be able to out perform it. The size of your base_64 encoded files in the database will be come HUGE! a 400k jpg will balloon to almost 1mb. Plus you got the mime/types issues, etc…

    I am not trying to rain on your parade, I think you got a nice tutorial here. Just I’ve done this before and it ended up going very bad.

    • http://www.xpertdeveloper.com Avinash

      Hi Rob,

      I also agree that this not falls into best practice, but i want to show the another way. Hope you understand what I mean :)

  • Josep

    Hi, I just read your article here, but I got a question really a simple question but how do I display within dynamically ? I mean if I have to show 10 image, how do I do that ? Is that should use this imgsrc at the same time within “while” syntax? Thanks a lot, if you can create tutorial about this and I would be so glad. Thanks a lot

    • http://www.xpertdeveloper.com Avinash

      If I understand your question correctly the you might do something like below:

      <?php
      while ($i <= 10)
       {
      ?>
      <img src="view_image.php?id=<?php echo $i?>" />  
      <?php
      $i++;
      }

      ?>

      please elaborate if this is not what you want :)

  • tabish

    <img src="geti/tipb_geti.php?id=” width=”200px” height=”180px”>
    this above code is working properly on localhost but on live site it is showing crack image.eventhough
    image is successfully stored in database because by executing another php file in which i have written query,then header
    and echo $image it is working properly full image is shown)

    can you help me with the problem in 200×180 one .