SORU
16 EYLÜL 2008, Salı


Nasıl XMLHttpRequest ilerleme elde etmek için

(Yüklenen bayt, bayt) indirilen bir XMLHttpRequest ilerleme elde etmek mümkün mü?

Bu kullanıcı büyük bir dosya yükleme olduğunda bir ilerleme çubuğu göstermek için yararlı olacaktır. Standart API desteği görünmüyor, ama belki tarayıcılar orada herhangi bir standart dışı bazı uzantısı var mı? Müşteri kaç/karşıya olduğunu bildiği için, tüm sonra, oldukça belirgin bir özelliği indirilmiş gibi görünüyor.

not: "ilerleme için sunucu" (şu anda yapıyorum) alternatif. anket farkındayım bu ana sorunu (sunucu tarafı karmaşık şifre dışında) büyük bir dosya gönderirken genellikle, kullanıcının bağlantı çoğu ISS zavallı memba sunuyoruz, çünkü tamamen bitik. Bu yüzden ekstra taleplerde bulunarak, umduğum kadar duyarlı değildir. Tarayıcı her zaman var olan bu bilgileri almak için bir yol (belki standart olmayan) olacağını umuyordum.

CEVAP
12 EYLÜL 2010, Pazar


Bayt için yüklenen çok kolay. Sadece xhr.upload.onprogress olay monitör, tarayıcı, dosya boyutu ilerleme bilgi verebilir ve yüklenen verilerin boyutunu yüklemek için vardır.

Bayt indirilen (xhr.responseText ile bilgi al), tarayıcı birçok bayt sunucu isteği göndermek ne olacağını bilmiyor çünkü biraz daha zor. Tarayıcı bu durumda olduğunu bilen tek şey algılıyor bayt büyüklüğünde. Ama bunun için bir çözüm yok, server senaryo üzerinde Content-Length Bir Başlık, bu yüzden tarayıcı alıyor bayt boyutunu vermek için ayarlamak için yeterli değil. daha fazla bilgi için 7* *git .

Örnek: Benim sunucu komut dosyası bir zip dosyası (5 saniye sürer) okur:

$filesize=filesize('test.zip');

header("Content-Length: ".$filesize);//set header length
//if the headers it not set then the evt.loaded will be 0
readfile('test.zip');
echo "asdasd";

Şimdi toplam uzunluğu olduğunu biliyorum çünkü sunucu komut dosyasının indirme işlemi izleyebiliyorum:

function updateProgress(evt) 
{
   if (evt.lengthComputable) 
   {  //evt.loaded the bytes browser receive
      //evt.total the total bytes seted by the header
      //
     var percentComplete = (evt.loaded / evt.total)*100;  
     $('#progressbar').progressbar( "option", "value", percentComplete );
   } 
}   
function sendreq(evt) 
{  
    var req = new XMLHttpRequest(); 
    $('#progressbar').progressbar();    
    req.onprogress=updateProgress;
    req.open('GET', 'test.php', true);  
    req.onreadystatechange = function (aEvt) {  
        if (req.readyState == 4) 
        {  
             //run any callback here
        }  
    };  
    req.send(); 
}

Bunu Paylaş:
  • Google+
  • E-Posta
Etiketler:

YORUMLAR

SPONSOR VİDEO

Rastgele Yazarlar

  • ASUS North America

    ASUS North A

    12 AĞUSTOS 2008
  • Edge-CGI 3D Tutorials and more!

    Edge-CGI 3D

    11 HAZİRAN 2013
  • Semantic Mastery

    Semantic Mas

    30 EKİM 2013