Dropzone.js lädt nur zwei Dateien hoch, wenn autoProcessQueue auf „false“ gesetzt ist

Lesezeit: 5 Minuten

Benutzer-Avatar
Juuro

ich benutze Dropzone.js und ich möchte, dass es nicht automatisch hochgeladen wird, sondern wenn der Benutzer auf eine Schaltfläche klickt. Also habe ich die eingestellt autoProcessQueue Option zu false. Wenn auf die Schaltfläche geklickt wird processQueue() Methode aufgerufen wird. Ich würde vermuten, dass jetzt die volle Warteschlange verarbeitet wird. Aber das ist nicht der Fall. Nur die Anzahl der Dateien, die in der angegeben ist parallelUploads Option wird hochgeladen. Der Standardwert von parallelUploads scheint 2 zu sein. Wobei bei jedem Klick 2 Dateien verarbeitet und hochgeladen werden.

Muss ich einstellen parallelUploads zu einer sehr hohen Zahl, um das jetzt zu lösen?

Hier ist mein vollständiger JS-Code:

var myDropzone = new Dropzone("div#myId", {
  url: "http://www.torrentplease.com/dropzone.php",
  addRemoveLinks: true,
  thumbnailWidth: "80",
  thumbnailHeight: "80",
  dictCancelUpload: "Cancel",
  autoProcessQueue: false
});

myDropzone.on("drop", function(event) {
  $('.edit_tooltip .option_bar').animate({
    opacity: 1,
    top: "-5"
  });
});


$('.edit_tooltip .option_bar .button').click(function() {
  myDropzone.processQueue();
});

  • Das ist weil parallelUploads ist standardmäßig 2, wenn dies nicht in Ihren Optionen festgelegt ist.

    – mcometa

    15. Dezember 2013 um 9:05 Uhr

Hinzufügen parallelUploads: 10(Das ist dein max. nein)

  • Vielen Dank! Ich habe einen halben Tag damit verbracht, dieses Problem zu lösen, und endlich hilft mir Ihre Antwort.

    – Arthur Keyan

    27. März 2014 um 20:44 Uhr

  • Um es klar zu sagen, dieser Ansatz erfordert, dass die parallelUploads gleich oder größer gesetzt ist maxFilesandernfalls, wenn ein Benutzer mehr als ablegt paralleluploads Dateien, die letzten werden möglicherweise nicht hochgeladen. Biankas Antwort unten scheint in dem Sinne “korrekter” zu sein, wie sie es zulässt parallelUploads unabhängig davon zu funktionieren maxFilesso wie es entworfen wurde.

    – Tohster

    11. Februar 2015 um 1:41 Uhr


  • Ich bin mir nicht sicher, ob es die beste Lösung ist. Nicht, wenn wir möchten, dass mehr als 10 Dateien hochgeladen werden.

    – Pete_Gore

    11. September 2015 um 12:07 Uhr

Es gibt eine einfache Möglichkeit, dies zu lösen, die hier zu finden ist:

https://github.com/enyo/dropzone/issues/253#issuecomment-22184190

“Wenn Sie möchten, dass autoProcessQueue nach dem ersten Upload wahr ist, dann hören Sie einfach auf das Verarbeitungsereignis und setzen Sie this.options.autoProcessQueue = true; inside.”

Also einfach hinzufügen

this.on("processing", function() {
    this.options.autoProcessQueue = true;
});

  • Da ich dies von einem externen Prozess aus verwendet habe, um den Upload zu starten, sah mein Code so aus: myDropzone.options.autoProcessQueue = true; Ich hatte die parraleleupload-Einstellung = 1, was dazu führte, dass jede Datei 1 zu 1 hochgeladen wurde. DANKE für die richtige Lösung.

    – Andy

    2. August 2015 um 16:14 Uhr

  • Das bewirkt zwar, dass die Dateien sequentiell hochgeladen werden, aber jetzt wird die Aktions-URL für jede einzelne Datei aufgerufen! In meinem Beispiel erhalte ich mit dieser Lösung genauso viele E-Mails wie Dateien. und das ist nicht, was ich will! Ich möchte, dass die Dateien sequentiell hochgeladen werden und erst danach die Aktions-URL aufgerufen wird. ist es möglich?

    – hat ein

    17. Mai 2017 um 11:39 Uhr


Meine Lösung ist:

// init dropzone with auto process queue false
var adPhotosDropzone = new Dropzone("#dropzone", {
    autoProcessQueue: false,
    parallelUploads: 3
});

$(document).on('click', '#btnUpload', function () {
    // enable auto process queue after uploading started
    adPhotosDropzone.options.autoProcessQueue = true;
    // queue processing
    adPhotosDropzone.processQueue();
});

// disable queue auto processing on upload complete
adPhotosDropzone.on("queuecomplete", function() {
    adPhotosDropzone.options.autoProcessQueue = false;
});

  • Dies hat bei mir funktioniert, da ich ein Ereignis habe, das den Upload initiiert. Es scheint diese Einstellung autoProcessQueue=true kurz bevor processQueue() das Problem behoben.

    – Daniel Kim

    7. August 2020 um 4:02 Uhr


Sehr spät, aber vielleicht hilft es jemandem.

Ich habe festgestellt, dass es nicht funktioniert hat, als ich maxFilesSize über parallerUploads platziert habe.

Die Reihenfolge für Optionen sollte also sein.

.
.
parallelUploads: 20,    
maxFilesize: 2, 
maxFiles: 20,
.
.

Fügen Sie Overdrive zwei Ereignisse wie hinzu

Verarbeitung -> Hochladen aller Dateien zulassen

queuecomplete -> Rückkehr zum Normalzustand

    init: function () {

            this.on("queuecomplete", function () {
                this.options.autoProcessQueue = false;
            });

            this.on("processing", function () {
                this.options.autoProcessQueue = true;
            });

    };

Benutzer-Avatar
Akbar Noto

Ich habe diese Dropzone mit der Option (autoProcessQueue:false) verwendet und sie lädt nur 2 Dateien anstelle meiner gesamten Dateien hoch. Und ich habe diesen Workaround gefunden in der Antwort des Oligoils auf das Problem des Git

Die Idee ist sehr einfach (wir möchten die Dateien einzeln hochladen, merken Sie sich die Option! 😀 ).

Es lädt mehrere hoch, ist aber auf 1 begrenzt. Nachdem eine Datei hochgeladen wurde, wird die nächste Warteschlange ausgelöst!

Hoffe es hilft jemandem!

Hier ist mein Code, der diese Idee verwendet (da ich 2 Formulare hochladen muss, nachdem alle Bilder hochgeladen wurden, werden die anderen Formulare gesendet)

Dropzone.options.dropzoneForm = {
        paramName: "file", // The name that will be used to transfer the file
        autoProcessQueue: false,
        addRemoveLinks:true,
        parallelUploads : 1,
        maxFiles : 50,
        autoProcessQueue : false,
        autoQueue : true,
        dictDefaultMessage: "<strong>Drop files here or click to upload. </strong>",
        init: function () {
            ....

            this.on("complete", function (file) {
                if (this.getUploadingFiles().length === 0 && this.getQueuedFiles().length === 0) {
                    console.log("END ", this.getQueuedFiles().length);
                }
                else {
                    Dropzone.forElement("#dropzoneForm").processQueue();
                }
            });
        }
    };

Wenn Sie maxFiles nicht festlegen möchten (standardmäßig kein Limit) und parallelUploads mit dem gewünschten Wert verwenden. Lesen Sie dies!

Ich habe das Problemverhalten per Einstellung gelöst

autoQueue: false,
autoProcessQueue: true,

Wenn ich dann die Dateien hochladen möchte, füge ich sie einfach der Warteschlange hinzu mit:

myDrop.enqueueFile(file)

Aber diese Methode akzeptiert nur eine Datei, für mehrere Dateien verwende ich:

myDrop.on("addedfiles", function(files){
 //wait confirmation, or do some processing with the files, then:

 files.forEach(function(file){
    myDrop.enqueueFile(file)
 })
}

Beachten Sie, dass das Ereignis “addedfiles” noch nicht in der Dokumentation enthalten ist. I erfasst alle Dateien, die in die Dropzone gezogen oder durch das Click-Ereignis hinzugefügt wurden.

Dies ist gut, denn wenn Sie das Ereignis „sending“ zum Hinzufügen von POST-Daten oder „parallelUploads“ verwenden, funktioniert der Beispielcode einwandfrei und stört nicht die nächsten Dateien. Ich verwende Sweet Alert 2, um nach einigen Tags zu fragen, bevor ich die Bilder hochlade.

1283040cookie-checkDropzone.js lädt nur zwei Dateien hoch, wenn autoProcessQueue auf „false“ gesetzt ist

This website is using cookies to improve the user-friendliness. You agree by using the website further.

Privacy policy