角度上传组件,设置最小和最大上传文件大小

时间:2021-05-16 20:12:56

I'm working on a upload file component that will send the file through nodejs, but I have a problem with file size because if the file if bigger than few kb I receive this error:

我正在处理一个上传文件组件,它将通过nodejs发送文件,但我的文件大小有问题,因为如果文件大于几kb我收到此错误:

Error: request entity too large (from nodejs)
[HTTP/1.1 413 Payload Too Large 7ms] (on browser console).

The upload component is created on frontend with angular and I need a solution on frontend to set the min and max file size.

上传组件是在带有角度的前端创建的,我需要前端的解决方案来设置最小和最大文件大小。

here is a fiddle with the angular component.

这里是角度分量的小提琴。

1 个解决方案

#1


0  

You can use directive to get file size

您可以使用指令来获取文件大小

    app.directive('checkFileSize', function() {
  return {
    link: function(scope, elem, attr, ctrl) {
      function bindEvent(element, type, handler) {
        if (element.addEventListener) {
          element.addEventListener(type, handler, false);
        } else {
          element.attachEvent('on' + type, handler);
        }
      }

      bindEvent(elem[0], 'change', function() {
        alert('File size:' + this.files[0].size);
      });
    }
  }
});

Another way is to get file size when sending to server like

另一种方法是在发送到服务器时获取文件大小

uploader = new FileUploader();
uploader.filters.push({
    'name': 'enforceMaxFileSize',
    'fn': function (item) {
        return item.size <= 10485760; // 10 MiB to bytes
    }
});

Updated fiddle Fiddle

更新小提琴小提琴

#1


0  

You can use directive to get file size

您可以使用指令来获取文件大小

    app.directive('checkFileSize', function() {
  return {
    link: function(scope, elem, attr, ctrl) {
      function bindEvent(element, type, handler) {
        if (element.addEventListener) {
          element.addEventListener(type, handler, false);
        } else {
          element.attachEvent('on' + type, handler);
        }
      }

      bindEvent(elem[0], 'change', function() {
        alert('File size:' + this.files[0].size);
      });
    }
  }
});

Another way is to get file size when sending to server like

另一种方法是在发送到服务器时获取文件大小

uploader = new FileUploader();
uploader.filters.push({
    'name': 'enforceMaxFileSize',
    'fn': function (item) {
        return item.size <= 10485760; // 10 MiB to bytes
    }
});

Updated fiddle Fiddle

更新小提琴小提琴