检查图像是否从缓存中加载

Question

我有一个任务。我有一个服务器调用来获取图像列表。随着其他信息，我必须添加这些信息，以便从缓存或服务器加载它。

有没有一种方法可以检查api调用中的标题？如果它来自缓存，我得到的状态码是200，但是我得到了像这样的额外信息（来自缓存）。如果不是从缓存中我只得到状态码200

图片1是没有从高速缓存

下一个图像加载的那些是对于那些从缓存加载。

我得到答案已经给出或者它是重复的。我已经尝试过这个解决方案，但似乎并不奏效。此外它是铬特定的，我正在寻找更适合所有浏览器的更一般的东西。我希望这解释了为什么我没有去那个解决方案。在问这里之前我已经搜查过了。

期待回复。

Answer 1

您将不得不选择性地处理加载绑定。您可以通过测试图像对象属性complete来验证加载。

例如：

$('.images_to_load').each(function(index, elem) 
{ 
    if (!elem.complete) { 
     $(elem).on('load', function(){ 
      console.log('image loaded from server'); 
     }); 
    } 
    else { 
     console.log('image loaded from cache'); 
    } 
}); 

如何使用此代码：你上面的代码执行时有images_to_load一流的图像标签（没有src属性），您的网页上是很重要的。添加src属性（url）后，您将能够找出图像是否已从缓存中加载。