回退404图片 [英] Fallback for 404 images

问题描述

在每天我自动导入XML的饲料（Tradetracker，Daisycon等）使用PHP的联盟网站。该饲料含有各种商店的产品。

一切工作就像一个魅力，除了图像。在进料的图像被简单地热链接到提供者的图像。这在大多数情况下，但有时（由于种种原因）的形象不存在了，被热链接保护被改变，等等，等等这将导致找不到像在浏览器中，它没有按'牛逼好看。

我试图解决这个使用htaccess的，但不管是什么原因，这是行不通的。我用Google搜索，并尝试了几种htacces脚本，但没有没有成功。我也试过J​​S在图像的URL，但这没有工作eiter。我做preFER htaccess的。

任何人有一个建议？

使用htaccess的更换图片

  RewriteEngine叙述上
＆LT; FilesMatch（JPG | PNG | GIF）$。＆GT;
的ErrorDocument 404/noimage.jpg
＆LT; / FilesMatch＆GT;
 

使用JS

 ＆LT; IMG SRC =image.jpg文件的onerror =this.onerror = NULL; this.src ='default.jpg'＆GT;
 

更新：工作版本

 ＆LT;脚本类型=文/ JavaScript的＆GT;
   jQuery的（窗口）.load（函数（）{
      jQuery的（IMG）。每个（函数（）{
         VAR图像= jQuery的（本）;
         如果（image.context.naturalWidth == 0 ||
         image.readyState =='未初始化'）{
            jQuery的（图）.unbind（错误）。ATTR（
                SRC，noimage.jpg
            ）;
         }
    }）;
}）;
＆LT; / SCRIPT＆GT;
 

解决方案

jQuery的支持的图像错误事件 - 我不知道为什么你的直列例如不工作，但如何：

  $（'IMG'）。在（'错误'，函数（）{
    $（本）.attr（'src'中，'default.jpg'）;
}）;
 

这也具有不需要被添加到每个元件的优点。如果你的图像被热链接你的.htaccess解决方案不起作用，因为这些不会从您的网站提供服务。

On a daily basis I automatically imported several XML-feeds (Tradetracker, Daisycon, etc.) for an affiliate site using PHP. The feeds contain products from all kinds of shops.

Everything works like a charm, with exception of the images. The images in the feeds are simply hotlinked to an image of the provider. This works in most of the cases, however sometimes (due to various reasons) the image doesn't exist anymore, is hotlink protected, is changed, etc. etc. This results in "image not found" in the browser, which doesn't look good.

I tried to solve this using htaccess, but for whatever reason, it doesn't work. I googled and tried several htacces "scripts", but none without success. I also tried JS in the image URL but this didn't work eiter. I do prefer htaccess.

Anyone has a suggestion?

Replace image using htaccess

RewriteEngine on
<FilesMatch ".(jpg|png|gif)$">
ErrorDocument 404 "/noimage.jpg"
</FilesMatch>

Using JS

<img src="image.jpg" onerror="this.onerror=null;this.src='default.jpg'">

Update: Working Version

<script type="text/javascript"> 
   jQuery(window).load(function() { 
      jQuery("img").each(function(){ 
         var image = jQuery(this);             
         if(image.context.naturalWidth == 0 ||
         image.readyState == 'uninitialized'){    
            jQuery(image).unbind("error").attr(
                "src", "noimage.jpg"
            ); 
         } 
    }); 
}); 
</script>

解决方案

jQuery supports the error event for images — I'm not sure why your inline example isn't working, but how about:

$('img').on('error', function() {
    $(this).attr('src', 'default.jpg');
});

This also has the advantage of not needing to be added to each element. Your .htaccess solution doesn't work if your images are being hotlinked, since those would not be served from your site.

这篇关于回退404图片的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！