filter files in Blueimp/ jQuery-File-Upload

Question

我正在尝试使用Blueimp / jQuery-File-Upload我的项目，并且我想测试文件扩展名，因为我只想下载照片，有人向我展示了我应该在哪里以及如何配置blueimp / jQuery-File-Upload，所以我可以这样做

Answer 1

As stated in the documentation you can simply set the options to a regex for the file type like that:

$('#fileupload').fileupload('option', {
            url: '//localhost/',
            maxFileSize: 5000000,
            acceptFileTypes: /(\.|\/)(gif|jpe?g|png)$/i,
            process: [
                {
                    action: 'load',
                    fileTypes: /^image\/(gif|jpeg|png)$/,
                    maxFileSize: 20000000 // 20MB
                },
                {
                    action: 'resize',
                    maxWidth: 1440,
                    maxHeight: 900
                },
                {
                    action: 'save'
                }
            ]
        });

Answer 2

I found this add method

So, here is my code for .gpx files:

 $('#fileupload').fileupload({ // your fileupload options add:function(e,data){ data.files.map(function(i){ if(i.type!='application/gpx+xml'){ alert('please upload only .gpx files'); }else{ data.submit(); } }), process: function(e,data){/* your process actions here */} }); 

Answer 3

Your can use the method add for filter files:

var $input = $('#upload_input');
$input.fileupload({
  fileInput: $input,
  url: 'YOU_URL',
  // Other options...

  start: function(e, data) {
    // Before start upload... Please wait...
  },
  add: function(e, data) {
    types = /(\.|\/)(gif|jpe?g|png)$/i;
    file = data.files[0]
    if (types.test(file.type) || types.test(file.name)) {
      data.submit();
    } else {
      // alert('Unfortunately, we don’t support that file type. Try again with a PNG, GIF, JPG');
      return;
    }
  },
  done: function(e, data) {
    // After upload... alert('Done');
  },
  fail: function(e, data) {
    // Error. Please try again later...
  }
});