XMLHttpRequest JS Görüntü yükleme

Question

Ben XMLHttpRequest üzerinden bir görüntüyü yükleyen bir web sitesi oluşturmak isteyen

(). (Ben kullanıcıya% progressbar temsil etmek istiyorum, çünkü XMLHttpRequest)

Benim Kod:

var req = new XMLHttpRequest(); 

req.addEventListener("progress", onUpdateProgress, false); 
req.addEventListener("load", onTransferComplete, false); 
req.addEventListener("error", onTransferFailed, false); 
req.addEventListener("abort", onTransferFailed, false); 

req.open("GET", "image.png", true); 
req.send(); 

function onUpdateProgress(e) { 
if (e.lengthComputable) { 
var percent_complete = e.loaded/e.total; 
if (Math.round(percent_complete*200)>=20) { 
        $("#progress").animate({ 
        width: Math.round(percent_complete*100) 
      }, 0); 
     } 
     } 
} 

function onTransferFailed(e) { 
    alert("Something went wrong. Please try again."); 
} 

function onTransferComplete(e) { 
    //Problem 
} 

Benim sorunum ben şimdi yüklenir görüntüyü göstermek için nasıl bilmiyorum olduğunu. Ben Sen VERİ URI'lerini kullanarak yapabilirsiniz

Answer 1

... Herkes bana :) Teşekkür yardımcı olabilir umut, ama hepsi mevcut tarayıcılarla bu işi yapmak zor.

Önbelleğe alma seçenekleri doğru şekilde ayarlanmışsa, iki kez daha iyi bir şekilde yükleyebilirsiniz: önce AJAX isteğinizi kullanarak, görüntü tarayıcı tarafından önbelleğe alındıktan sonra, normal görüntü işlevlerini kullanarak başka bir kez daha. İkinci kez, resminiz sunucudan tekrar alınmayacak, ancak tarayıcı önbelleğe alınmış dosyayı kullanacak ve resmi neredeyse anında gösterecektir.