dropzone.js图片上传acceptedMimeTypes

Question

我正在使用dropzone.js插件向我的应用程序添加图像上传器。 我知道这可能是一个非常基本的问题所以道歉但我想要做的是限制文件扩展名。 这适用于单个文件扩展名，

<script type="text/javascript">
   Dropzone.options.dropzone = {
        accept: function(file, done) {
            console.log(file);
            if (file.type != "image/jpeg") {
                done("Error! Files of this type are not accepted");
            }
            else { done(); }
        }
    }
 </script>

所以我的问题是如何添加多个文件扩展名，即image/jpeg ， image/png ？

谢谢

Answer 1

我是Dropzone的作者。

您应该使用 acceptedMimeTypes acceptedFiles 。 这与input元素的accept属性完全相同。 这样，即使是后备也能正常工作。

有效的acceptedFiles属性可能如下所示：

• audio/*
• image/*
• image/jpeg,image/png
• 等等...

编辑 ：在Dropzone的最新版本中，此属性称为acceptedFiles ，它还允许您定义扩展。 这样可行：

"audio/*,image/*,.psd,.pdf"

（对于向后兼容性， acceptedMimeTypes仍然有效，直到下一个主要版本）

Answer 2

感谢enyo它工作....真棒...只需在dropjone.js->中粘贴该行

uploadMultiple: true,  //upload multiple files
maxFilesize: 1,  //1 mb is here the max file upload size constraint
acceptedFiles: ".jpeg,.jpg,.png,.gif",

http://www.dropzonejs.com/#config-acceptedFiles

accept的默认实现根据此列表检查文件的mime类型或扩展名。 这是一个以逗号分隔的mime类型或文件扩展名列表。 例如： 'image/*,application/pdf,.psd'如果Dropzone可点击，此选项也将用作隐藏文件输入的接受参数。

Answer 3

您可以为if添加更多扩展名，如下所示：

if (file.type != "image/jpeg" && file.type != "image/png") {

这将检查文件类型是否与您指定的所有类型不同。 对于要通过检查的文件，它必须与image / jpeg AND image / png不同

更新

我建议看看enyo的答案，因为他是Dropzone的作者。

Answer 4

var myDropzone = new Dropzone('div#profile_pictures',{
    acceptedFiles: "image/*", /*is this correct?*/
    init: function(){
        this.on("success", function(file, data) {
            /*..*/
            });
        } 
})

Answer 5

var dz = $("#FileUpload").dropzone({acceptedFiles: ".jpeg"})[0];

Answer 6

万一有人感兴趣（我不能评论Enyo的帖子）：我在使用Dropzone选项时遇到了问题，经过调查后我注意到我使用的是jQuery jquery-3.2.1.min.js的版本是故障的原因