it-swarm.com.de

dropzone.js-Image-Upload akzeptiertMimeTypes

Ich verwende das Plugin dropzone.js, um meiner Anwendung einen Bilduploader hinzuzufügen. Ich weiß, das ist wahrscheinlich eine wirklich grundlegende Frage, also entschuldige mich, aber ich möchte die Dateierweiterung begrenzen. Dies funktioniert für eine einzelne Dateierweiterung,

<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>

Meine Frage ist also, wie Sie mehrere Dateierweiterungen hinzufügen, d. H. image/jpeg, image/png?

Vielen Dank

25
user1098178

Sie könnten weitere Erweiterungen zu Ihrer if hinzufügen:

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

Dadurch wird geprüft, ob sich der Dateityp von ALLEN von Ihnen angegebenen Typen unterscheidet. Damit eine Datei die Prüfung bestehen kann, muss sie sich von image/jpeg AND image/png unterscheiden

Update

Ich würde raten, sich die Antwort von enyo anzusehen , da er der Autor von Dropzone ist.

13
jdepypere

Ich bin der Autor von Dropzone.

Sie sollten das verwenden acceptedMimeTypes acceptedFiles. Dies verhält sich genauso wie die Eigenschaft input des Elements accept. Auf diese Weise funktioniert auch der Fallback einwandfrei.

Gültige acceptedFiles-Eigenschaften können wie folgt aussehen:

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

EDIT: In den neuesten Versionen von Dropzone heißt diese Eigenschaft acceptedFiles und ermöglicht es Ihnen, Erweiterungen zu definieren. Das würde also funktionieren:

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

(Für die Rückwärtskompatibilität funktioniert acceptedMimeTypes bis zur nächsten Hauptversion.)

98
enyo

danke enyo es hat funktioniert .... super ... einfach diese Zeile in dropjone.js-> einfügen

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

Die Standardimplementierung von Accept prüft den Mime-Typ oder die Dateierweiterung der Datei anhand dieser Liste. Dies ist eine durch Kommas getrennte Liste von MIME-Typen oder Dateierweiterungen. ZB: 'image/*,application/pdf,.psd' Wenn die Dropzone anklickbar ist, wird diese Option auch als Akzeptor für die versteckte Dateieingabe verwendet.

23
Sachin
var myDropzone = new Dropzone('div#profile_pictures',{
    acceptedFiles: "image/*"; /*is this correct?*/
    init: function(){
        this.on("success", function(file, data) {
            /*..*/
            });
        } 
})
6
user2865151
var dz = $("#FileUpload").dropzone({acceptedFiles: ".jpeg"})[0];
0
Hafsal Rh

Für den Fall, dass jemand interessiert ist (ich kann den Beitrag von Enyo nicht kommentieren): Ich hatte Probleme mit der Anwendung der Dropzone-Optionen und nach einer Untersuchung habe ich festgestellt, dass die Version von jQuery jquery-3.2.1.min. js das ich verwendet habe, war die Ursache seiner Fehlfunktion

0
rafa_pe