上传前在angularjs控制器中解析文件答案

【问题标题】：parse file in angularjs controller before upload上传前在angularjs控制器中解析文件
【发布时间】：2023-04-09 12:20:01
【问题描述】：

我有 angularjs 应用程序，用户应该能够从文本文件中导入数据。在上传之前，我想从客户端的文件中读取几行以进行一些验证。我正在使用https://github.com/nervgh/angular-file-upload 上传文件。我可以上传文件并在服务器端进行验证，但文件可能有几兆字节大，如果数据无效，我不想创建不必要的流量。

在我的控制器中，我有以下代码：

$scope.validateFile = function(file){

  console.log(file.name);
  console.log(file.size);      
  var reader = new FileReader();

  reader.onloadend = function(evt){      
    console.log(evt.target.result);
    //do something with file content here 
  };

  //var blob = file.slice(0, file.size - 1);
  reader.readAsText(file);

};

执行时，控制台输出文件名和大小。之后我得到了以下错误：

TypeError: Failed to execute 'readAsText' on 'FileReader': parameter 1 is not of type 'Blob'.

当我从下一行删除评论时...

var blob = file.slice(0, file.size - 1);

并将最后一行更改为：

reader.readAsText(blob);

这是来自控制台的错误

TypeError: undefined is not a function

看起来切片功能不起作用。为什么 slice() 不起作用？有可能这样做吗？

更新：

根据 DTing 的评论我发现了一个错误

我原来的html是

<input type="file" nv-file-select="" uploader="uploader" multiple  /><br/>
...   
<tr ng-repeat="item in uploader.queue">
...   
ng-click="validateFile(item.file)"

我已将最后一行更改为

ng-click="validateFile(item._file)"

现在可以了。

【问题讨论】：

您的代码应该可以工作，因此您可能没有将文件传递给函数。 console.log(file) 带给你什么？
感谢您的回答。这是输出的第一部分： FileLikeObject {lastModifiedDate: Fri Apr 03 2015 11:21:48 GMT+0200 (Central European Summer Time), size: 47, type: "text/plain", name: "test.txt" , _createFromFakePath: 函数…}
是的，您没有传入文件，而是传入了一个构造，角度文件上传使用该构造来表示复制名称和大小的文件。除非您添加更多代码，否则无法真正帮助解决这个问题，我们会看到您使用什么以及在何处调用此函数。
其实你很有帮助。正如我所说，我正在使用github.com/nervgh/angular-file-upload 上传文件。我从一开始就传递了错误的价值。 “uploader”的“File”属性是一个FileLikeObject，但uploader._file实际上是一个文件。我犯了一个大错误，没有按照您的建议输出到控制台“uploader.file”。我假设如果我有大小和名称，那么我的文件对象从乞讨中是错误的。非常感谢你做得很好。
您应该将此问题标记为已回答。

标签： javascript angularjs file blob filereader

【解决方案1】：

查看 File API 规范，FileReader 部分：https://developer.mozilla.org/en-US/docs/Web/API/FileReader

它有许多 .readAsXXX 方法，这些应该允许您在将文件上传到服务器之前检查文件的内容。

【讨论】：

谢谢 btk，这不是我想要的，但它是对原始问题的一个很好的扩展。我知道 FIle API，我的问题是我使用了错误的对象。感谢DTing，我解决了我的问题。我接受这个答案来关闭这个帖子，因为我不能接受 DTing 的评论。