web-dev-qa-db-fra.com

dropzone.js upload d'image acceptéMimeTypes

J'utilise le plugin dropzone.js pour ajouter un programme de téléchargement d'image à mon application. Je sais que c’est probablement une question très élémentaire, alors excuses-moi, mais je veux limiter les extensions de fichier. Cela fonctionne pour une extension de fichier unique,

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

Ma question est donc la suivante: comment ajouter plusieurs extensions de fichier, à savoir image/jpeg, image/png?

Merci

phpjqueryfile-uploaddropzone.js
25
user1098178

Vous pouvez ajouter d'autres extensions à votre if, comme ceci:

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

Cela vérifiera si le type de fichier est différent de TOUS les types que vous spécifiez. Pour qu'un fichier réussisse, il doit être différent de image/jpeg ET image/png

Mettre à jour

Je conseillerais de regarder la réponse d'Enyo puisqu'il est l'auteur de Dropzone.

13
jdepypere

Je suis l'auteur de Dropzone.

Vous devriez utiliser le acceptedMimeTypes acceptedFiles. Cela se comporte exactement comme la propriété input de l'élément accept. De cette façon, même le repli fonctionnera correctement.

Les propriétés acceptedFiles valides peuvent ressembler à ceci:

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

EDIT: dans les dernières versions de Dropzone, cette propriété s'appelle acceptedFiles et permet de définir des extensions. Donc, cela fonctionnerait:

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

(Pour la compatibilité ascendante, acceptedMimeTypes fonctionnera toujours jusqu'à la prochaine version majeure)

98
enyo

merci enyo cela a fonctionné ... génial ... il suffit de coller cette ligne dans 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

L'implémentation par défaut d'accepter vérifie le type mime ou l'extension du fichier par rapport à cette liste. Voici une liste de types mime ou d'extensions de fichier séparés par des virgules. Ex .: 'image/*,application/pdf,.psd' Si la Dropzone est cliquable, cette option sera également utilisée comme paramètre d'acceptation sur l'entrée de fichier caché.

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

Si quelqu'un est intéressé (je ne peux pas commenter le post d'Enyo): J'ai eu des problèmes avec l'application des options de Dropzone et, après avoir enquêté, j'ai remarqué que la version de jQuery jquery-3.2.1.min. js que j'utilisais était la cause de son dysfonctionnement

0
rafa_pe