DaniWeb Forum Index > Web Development > PHP

How to replace missing images with default image

Please support our PHP advertiser: PostgreSQL or MySQL? Compare and contrast the two most popular open source databases

•

Join Date: Nov 2006

Posts: 9

Reputation: ultranet is an unknown quantity at this point

Solved Threads: 0

ultranet

Offline

Newbie Poster

How to replace missing images with default image

Jan 2nd, 2007

Is there a way to detect missing images and redirect them to a static image?

Basically if I had an image that I was displaying from a different site (with permission), and that image were removed, is there a way I can default that image to a default .gif? I have tried PHP getimagesize, but to do that multiple times per page REALLY slowed things down.

Is there a better way? The only other thing I could think of was to create a background image of the default gif, load the images on top of the background, and use blank alt text so that if the image I'm trying to load doesn't exist, just the background default image will show, but this won't work very well, as sometimes the background image would show through as the size of the images are variable.

Thanks in advance

free after rebate
booksvista

•

Join Date: Sep 2006

Posts: 44

Reputation: MCP is an unknown quantity at this point

Solved Threads: 3

MCP

Offline

Light Poster

Re: How to replace missing images with default image

Jan 2nd, 2007

Maybe use something in javascript along the lines of:

 Help with Code Tags 
 PHP Syntax (Toggle Plain Text) 
function validateImage(url){
  var img = new Image();
  img.src = url;
  return img.height>0;
}
function validateImage(url){
  var img = new Image();
  img.src = url;
  return img.height>0;
}

which should return true if the image exists (i.e. height is greater than 0). This might fail if the image takes time to load, so test a lot. You might be able to mitigate this by running your validation function using the body onload event. And in this case, you should be able to avoid the image loading lag, because your browser would have cached the image and the height would be readily available. Hmm, so something like:

 Help with Code Tags 
 PHP Syntax (Toggle Plain Text) 
function replaceMissingImages(){
  for (var i=0; i<document.images.length; i++){
    img = new Image();
    img.src = document.images[i].src;
    if (img.height == 0)
      document.images[i].src = 'mydefault.jpg';
  }
}
function replaceMissingImages(){
  for (var i=0; i<document.images.length; i++){
    img = new Image();
    img.src = document.images[i].src;
    if (img.height == 0)
      document.images[i].src = 'mydefault.jpg';
  }
}

Alternatively, you can do an XMLHTTPRequest to the image, to get the return code (I think you can use some kind of HTTP HEAD instruction to avoid actually requesting/retrieving the entire image). 404 would indicate a missing picture, 200 it's good, 304 it's not modified if you use the right headers, etc.. There are plenty of pages where they have these codes available..

•

Join Date: Nov 2006

Posts: 9

Reputation: ultranet is an unknown quantity at this point

Solved Threads: 0

ultranet

Offline

Newbie Poster

Re: How to replace missing images with default image

Jan 3rd, 2007

Thanks a lot for information code, I got it right now:lol:

free after rebate
booksvista

•

Join Date: Nov 2009

Posts: 1

Reputation: romeo0830 is an unknown quantity at this point

Solved Threads: 0

romeo0830

Offline

Newbie Poster

It is working however?

29 Days Ago

The function you stated is working, i put a little twist on it to get it to work..

 Help with Code Tags 
 PHP Syntax (Toggle Plain Text) 
function replaceMissingImages(){
  for (var i=0; i<document.images.length; i++){
    img = new Image();
    img.src = document.images[i].src;
    if (img.height == 0) {
      document.images[i].src = '/images/no-image.jpg';
    }
function replaceMissingImages(){
  for (var i=0; i<document.images.length; i++){
    img = new Image();
    img.src = document.images[i].src;
    if (img.height == 0) {
      document.images[i].src = '/images/no-image.jpg';
    }

1 problem as you stated the delay of the images loading is telling the script hey these images are not here and we need to replace them before giving the image time to load.. How can I add a delay to the function so it doesnt start until the end of the page loading?

Last edited by nav33n; 29 Days Ago at 11:46 am. Reason: Use [code] tags to wrap your code for better readability.

•

Join Date: Oct 2008

Posts: 61

Reputation: Manuz is an unknown quantity at this point

Solved Threads: 8

Manuz

Offline

Junior Poster in Training

28 Days Ago

Try to call the function at the end of the script.

 Help with Code Tags 
 PHP Syntax (Toggle Plain Text) 
<?php "<script type="text/javascript">replaceMissingImages()</script>"; ?>
<?php "<script type="text/javascript">replaceMissingImages()</script>"; ?>

Sharing Knowledge Is Better Than Any Other Thingz

•

Join Date: Oct 2006

Posts: 1,064

Reputation: ardav will become famous soon enough

Solved Threads: 136

ardav

Offline

Veteran Poster

-1

28 Days Ago

Here's my two-penneth worth. If JS not on - problems with JS solution. WHat about file_get_contents?

The reason I suggest this is that the display of the page if using JS is at the mercy of the client's (user's) settings. The following should work regardless as it is processed on the server (although you may need full control of your php.ini file).

$file is the image to check (from DB value I take it)

 Help with Code Tags 
 PHP Syntax (Toggle Plain Text) 
  if( false == ($str=@file_get_contents('$file',NULL,NULL,0,1))){
    echo "<img src=\"$default_file\" ...other_attributes... />";
  }else{
    echo <img src=\"$file\" ...other_attributes... />";
  }
  if( false == ($str=@file_get_contents('$file',NULL,NULL,0,1))){
    echo "<img src=\"$default_file\" ...other_attributes... />";
  }else{
    echo <img src=\"$file\" ...other_attributes... />";
  }

The parameters for file_get_contents (0 and 1) relate to start at character 1 and read 1 character - so you're not reading the whole file - should save time - should be quick.

The '@' is required to surpress errors.

CAVEAT - if allow_url_fopen is set to false (0) - this will not work, if you have access to your php.ini file, turn allow_url_fopen on. The alternative would be to use cURL, but I assume this would be sloooooow.
?>

***
Linking to remote images may be asking for trouble. If this is an "avatar"/"profile" type image, perhaps it would be better if users could upload their image (which could be resized via GD2 or ImageMagick library) and the filename stored in a db.

Last edited by ardav; 28 Days Ago at 2:56 pm.

Happy Humbugging Christmas