javascript - 在将文件大小传递到服务器端之前在客户端进行处理

Question

我只想验证客户端的文件大小。下面的代码仅处理成功。我也想处理文件大小。目前，如果文件大于 2MB，则会返回 500(内部服务器错误)。

有没有办法手动处理它并将错误设置为“最大文件大小应为 2MB”？

提前致谢

注意:下面的代码是 AngularJS 的一部分

file.upload(url, function(data) {
    if(data.success !== true) {
        $scope.$apply(function() {
            $scope.design.pdf.status = '';
            $scope.errors.pdf = data.data;
        });
        return;
    }
    $scope.$apply(function() {
        $scope.design.pdf = {
            status: 'uploaded',
            file: data.data.name,
            name: data.data.original,
            size: data.data.size
        }
    });
});

Answer 1

我假设您使用input type='file' 按钮。您可以创建一个指令，该指令将在按钮更改时绑定(bind)到按钮并获取大小。

指令:

app.directive('customUpload', function(){
  return {
    restrict: 'A',
    link: function(scope, element, attrs){
        element.on('change', function(){
          //size in bytes
          var size = element[0].files[0].size;
          console.log(size);
          //do something with the file
        });
      }
    };
});

还有 html:

<input type='file' custom-upload>

这是 plunker 中的所有代码: http://plnkr.co/edit/GB6MFOWMbjOA7obFBq83?p=preview