2011-10-21 13 views
6

, bu şimdiye kadar sahip kodudur:Görüntünün kromda önbelleğe alındığını görmek için image.complete kullanma? Ben harici görüntü js ile tarayıcının önbelleğine olup olmadığını öğrenmek için çalışıyorlar

<html> 
    <head></head> 
    <body> 

    <script src="http://code.jquery.com/jquery-1.4.2.min.js"></script> 

    <script> 

     function cached(url) { 
      $("#imgx").attr({"src":url}); 
      if(document.getElementById("imgx").complete) { 
       return true; 
      } else { 
       if(document.getElementById("imgx").width > 0) return true; 
      } 

      return false; 
     } 

    </script> 

    <img id="imgx" src="" /> 

    <script> 

     $(document).ready(function(){ 
      alert(cached("http://www.google.com/images/srpr/nav_logo80.png")); 
     }); 

    </script> 

    </body> 
</html> 

O ateş üzerinde mükemmel çalışıyor ama her zaman chrome false döndürür.

Birisinin kromla nasıl çalışacağı konusunda bir fikri var mı?

+0

Bir öğenin önbelleğe alınıp saklanmadığı önemli değil? :/ – Matchu

+0

W3C standardı böyle bir API'ye sahip değil, bu yüzden bazı tarayıcıya özgü hackler kullanacaksınız, bu da – Ankur

+0

yapmak için iyi bir şey değil. Ayrıca, görüntü önbelleğe alınmış olsa bile, resim yüklenmek hala büyük olasılıkla eşzamansızdır, ve tarayıcının bir sonraki JavaScript satırını yürütmeden önce resmi yüklemesini ve görüntülemeyi bitirmesi olası değildir. – RoToRa

cevap

13

JQuery'de daha bağımsız olması için kodunuzu düz JavaScript’e yeniden yazdım. Temel işlev değişmedi. Fiddle: http://jsfiddle.net/EmjQG/2/

function cached(url){ 
    var test = document.createElement("img"); 
    test.src = url; 
    return test.complete || test.width+test.height > 0; 
} 
var base_url = "http://www.google.com/images/srpr/nav_logo80.png" 
alert("Expected: true or false\n" + 
     cached(base_url) 
     + "\n\nExpected: false (cache-busting enabled)\n" + 
     cached(base_url + "?" + new Date().getTime())); 
//false = not cached, true = cached 

ilk kez, false and false olsun. Kodu tekrar çalıştırdıktan sonra true and false'u alırım. .complete ve .height + .width kullanılması


beklenen sonuçları (FF 3.6.23, Krom 14) verir.

Önbelleğe almayı Chrome tarayıcınızda devre dışı bırakmış olmanız olasıdır. Değilse, sunulan resminizin HTTP headers'unu kontrol edin (Cache-control şimdi mi?). Bu başlık, Google örnek

'da bulunmaktadır. Bir resmin ne zaman bitip yüklenmediğini belirlemek istiyorsanız, this question numaralı ürüne göz atın.

+0

Önbelleğe alma özelliğini etkinleştirdim ve Önbellek denetimi mevcut değil. Görüntünün anında yüklenip yüklenmediğini (önbellekten) veya aşamalı olarak yüklenip yüklenmediğini bilmek istiyorum. Gönderdiğim kod FF'de iyi çalışıyor ancak kromda asla işe yaramıyor. – user979390

+0

@ user979390 Çalışan bir test vakası ekledim. Bkz. Http://jsfiddle.net/EmjQG/2/. –

+0

Bu, kromda "true - false" i döndürüyor mu? Benim için her zaman false döndürür - krom üzerinde yanlış, sanırım en iyi çapraz tarayıcı çözümü, görüntü yükünü zamanlamak için bir sayaç kurmak olacaktır. – user979390

İlgili konular