文件阅读器错误:对象正忙于读取blob

FileReader error: The object is already busy reading Blobs

本文关键字：于读取 读取 blob 错误 对象 文件      更新时间：2023-09-26

我正在制作一个用于照片库上传的拖放文件上传系统。这是我处理丢失文件的源代码。这个适用于多个文件如果我一个一个地删除它们，它会工作但当我同时删除多个文件时，会出现这个错误:

Uncaught InvalidStateError: Failed to execute 'readAsDataURL' on 'FileReader': The object is already busy reading Blobs. 

function handleFiles(files)
{
    var reader = new FileReader();
    var formdata = new FormData();
    $.each(files, function(i, j)
    {
        $("td.photos span.status").html("Processing file: "+j.name);
        formdata.append('file', j);
        $.ajax({
            url: "uploadalbum.php",
            type: "POST",
            dataType: "json",
            data: formdata,
            processData: false,
            contentType: false,
            success: uploadfinished
        });
        reader.onload = handleReaderLoad;
        reader.readAsDataURL(j);
    });
}

任何想法?

我想错误已经给你了。

在'FileReader'上执行'readAsDataURL'失败:对象正忙于读取Blobs

所以文件阅读器已经很忙了，但只有当你删除多个文件时?那么它可能正忙于处理第一个文件(第二个文件崩溃)。

当你把var reader = new FileReader();放到jQuery的每个循环中，它会像下面这样工作:

$.each(files, function(i, j)
{
    var reader = new FileReader();
    $("td.photos span.status").html("Processing file: "+j.name);
    formdata.append('file', j);
    .... <snip>
}

可能导致这种情况的情况是文件读取器被调用两次。如果它仍在运行，它将发出此错误。

    reader.onload = function( event ) {
            // do stuff
        };
    reader.readAsDataURL( file );
    /* arbitrarily complex code */
    reader.readAsDataURL( file2 );
    /* oops */

您可以尝试重新初始化FileReader对象。

    <script type="text/javascript">                                                             
   debugger;        
    ////////////////Write-1/////////////////////////
    
    var blob = new Blob([],  {type: "text/plain"});
    
    for (var i=0; i<10; i++)
    {
      
        blob = new Blob([blob," "+i], {type: "text/plain"});
    }
    
    /////////////////Write-2//////////////////////////
    
    var parts = [];
    for (var i = 11; i < 20; i++) 
    {
        parts.push(" " + i);
    }
     
      
    var blob1 = new Blob(parts);
    
    //////////////////Read-1////////////////////////////
    
    var def = new FileReader();  
    
   def.addEventListener("loadend", function(e) {  var x      = e.srcElement.result;  alert(x); });  
  def.readAsText( blob );  
  
  ///////////////////Read-2/////////////////////////////// 
  
    def = new FileReader();  
    
    def.addEventListener("loadend", function(e) {  var x      = e.srcElement.result;  alert(x); });  
   
    def.readAsText( blob );  
   
 /////////////////////////////////////////////////
     </script>
相关文章：