当图像不存在时使用哪种方法

时间:2012-03-09 15:57:19

标签: php javascript jquery html curl

我目前正在使用php file_exist方法检查图像是否存在,如果不存在则显示默认图像:

if(file_exists($image_location))
{
 echo "<img src='$image_location'>";
}
else
{
 echo "<img src='default_image.jpg'>";
}

除了上述内容外,我知道可以:

1)为<img>标签添加背景图片样式

2)使用javascript onerror方法替换丢失的图片

如果图像是远程托管的,

3)使用cURL生成HEAD请求以检测图像的存在或

4)使用jquery ajaxComplete事件

我认为每种方法都有其优点和缺点。我的长期目的是分别托管图像,因此所有四个选项都应该是可行的。但哪个更好,为什么?

5 个答案:

答案 0 :(得分:1)

对每页上的每张图片进行file_exists()检查,请求声音非常过分;你的环境不稳定!?

#p>#1和#2听起来是你最好的选择。在这两个中,我选择#2作为背景图像与src属性具有不同的行为(例如,如果图像不适合图像边界,图像如何调整大小/重复)。

请确保为每个请求避免为每个图像执行#3;您将无限地减慢页面加载速度(为页面上的每个图像建立HTTP连接)。如果你想这样做,可以考虑让一个在cron上运行的任务为你做这件事。

最终,不应该处于图像变得不常用的环境中。

答案 1 :(得分:1)

5)设置您的Web服务器以显示默认图像,完全不涉及PHP。 像

这样的东西
<directory /images>
ErrorDocument 404 /images/default.jpg
</directory> 

答案 2 :(得分:0)

我们使用nginx来提供静态内容,如图片,css和javascript。在那里我们配置error_page 404 / path_to_some_php_script来处理对丢失文件的所有请求。 error_page指令的工作方式如下:当您请求某些内容时,nginx会检查所请求的资源是否存在。如果它没有重定向到指定的URL。然后你可以解析网址并制作一些条件,这样你就可以显示不同类型/大小的默认图像。

答案 3 :(得分:0)

你可以使用JS

<img src='earth.jpg' onerror='this.src=/somewhereovertherainbow.jpg' />

答案 4 :(得分:0)

如果引用的图像不存在,您可以使用jQuery删除<img />标记:

<img src="image.png" onerror="$(this).remove()" />

或:

<script>
  $(document).ready(function () {
    $("#img1").error(function () { $(this).remove() });
  });
</script>

<img id="img1" src="image.png" />