ajaxを含むファイルを小さなチャンクでアップロードし、失敗したことを確認するには、失敗した部分を再アップロードします。

Question

私はユーザーがアップロードしたファイルを持っており、以下のことを達成したいと思います。

1. ファイルを1メガバイト分の小さなチャンクに分割します。
2. 各チャンクをアップロードし、次のチャンクのアップロードを開始する前に完了するまで待ちます。
3. すべてのチャンクに対して、成功または失敗のレポートを取得します。
4. 失敗したチャンクを再アップロードします。
5. 進捗をパーセンテージで取得します。

ここにいくつかの大まかなJavaScriptがあります。私は文字通り失われている。いくつかのコードをオンラインで入手し、修正しようとしました。

$.chunky = function(file, name){   
       var loaded = 0; 
       var step = 1048576//1024*1024; 
       var total = file.size; 
       var start = 0; 
       var reader = new FileReader(); 

       reader.onload = function(e){ 

       var d = {file:reader.result} 
       $.ajax({ 
        url:"../record/c/index.php", 
        type:"POST", 
        data:d}).done(function(r){ 
        $('.record_reply_g').html(r); 

        loaded += step;     
        $('.upload_rpogress').html((loaded/total) * 100); 

         if(loaded <= total){ 
          blob = file.slice(loaded,loaded+step); 
          reader.readAsBinaryString(blob); 
         } else { 
          loaded = total; 
         } 
       })    
       }; 

       var blob = file.slice(start,step); 
       reader.readAsBinaryString(blob); 
      } 

これをどのように達成できますか。実行可能な解決策があれば何が起こっているのか説明してください。

Answer 1

チャンクアップロードに失敗した場合は何もしません。再び失敗したチャンクをアップロードするには

$.chunky = function(file, name){   
    var loaded = 0; 
    var step = 1048576//1024*1024; size of one chunk 
    var total = file.size; // total size of file 
    var start = 0;   // starting position 
    var reader = new FileReader(); 
    var blob = file.slice(start,step); //a single chunk in starting of step size 
    reader.readAsBinaryString(blob); // reading that chunk. when it read it, onload will be invoked 

    reader.onload = function(e){    
     var d = {file:reader.result} 
     $.ajax({ 
      url:"../record/c/index.php", 
      type:"POST", 
      data:d      // d is the chunk got by readAsBinaryString(...) 
     }).done(function(r){   // if 'd' is uploaded successfully then -> 
       $('.record_reply_g').html(r); //updating status in html view 

       loaded += step;     //increasing loaded which is being used as start position for next chunk 
       $('.upload_rpogress').html((loaded/total) * 100); 

       if(loaded <= total){   // if file is not completely uploaded 
        blob = file.slice(loaded,loaded+step); // getting next chunk 
        reader.readAsBinaryString(blob);  //reading it through file reader which will call onload again. So it will happen recursively until file is completely uploaded. 
       } else {      // if file is uploaded completely 
        loaded = total;   // just changed loaded which could be used to show status. 
       } 
      })    
     }; 
} 

EDIT

次のことが可能です。

var totalFailures = 0; 
reader.onload = function(e) { 
    .... 
}).done(function(r){ 
    totalFailures = 0; 
    .... 
}).fail(function(r){ // if upload failed 
    if((totalFailure++) < 3) { // atleast try 3 times to upload file even on failure 
    reader.readAsBinaryString(blob); 
    } else {     // if file upload is failed 4th time 
     // show message to user that file uploading process is failed 
    } 
});