How can we resume failed uploads?

[CitizenBeta]

Is there a way to make it so that failed uploads can be resumed or retried?

[40rn05lyv]

Hi, did you solve this problem?

[CitizenBeta]

I stopped using dropzone :(

https://github.com/blueimp/jQuery-File-Upload
https://github.com/FineUploader/fine-uploader

[40rn05lyv]

My workaround (remove all files, reset status and add them back):

let dropzoneFilesCopy = dropzone.files.slice(0);
dropzone.removeAllFiles();
$.each(dropzoneFilesCopy, function(file) {
    if (file.status === Dropzone.ERROR) {
        file.status = undefined;
        file.accepted = undefined;
    }
    dropzone.addFile(file);
});

[ademchenko]

40rn05lyv, I'm not sure if you're using jquery object under $ sign, but if so there's an innacuracy in the solution. Each method's callback on arrays receives array index as the fist parameter and value as the secound. So the solution should be:

var dropzoneFilesCopy = dropzone.files.slice(0);
dropzone.removeAllFiles();
$.each(dropzoneFilesCopy, function(_, file) {
     if (file.status === Dropzone.ERROR) {
         file.status = undefined;
         file.accepted = undefined;
     }
     dropzone.addFile(file);
});

[serhatculhalik]

@ademchenko

Should I add this snippet to end of my dropzone.config file just to make it work?
Or Should I put under Dropzone.options.MyDropzone? Please advise. My custom config file is. I just added your snippet to the end of my file but it didn't work.

var total_photos_counter = 0;
Dropzone.options.myDropzone = {
    uploadMultiple: true,
    parallelUploads: 1,
    maxFilesize: 100,
    previewTemplate: document.querySelector('#preview').innerHTML,
    addRemoveLinks: true,
    dictRemoveFile: 'Resmi Sil',
    dictFileTooBig: 'Dosya 100 MB den büyük. Daha küçük boyutlu bir fotoğraf yükleyiniz' ,
    acceptedFiles: '.jpeg,.jpg,.png,.zip',
    dictCancelUpload: 'Yüklemeyi İptal Et',
    dictInvalidFileType: "Bu tip bir dosyayı yükleyemezsiniz. Sadece resim ve Zip yükleyebilirsiniz.",
    timeout: 100000000,

    init: function () {
        this.on("removedfile", function (file) {
            $.post({
                url: '/images-delete',
                data: {id: file.name, _token: $('[name="_token"]').val()},
                dataType: 'json',
                success: function (data) {
                    total_photos_counter--;
                    $("#counter").text("# " + total_photos_counter);
                }
            });
        });
    },
    success: function (file, done) {
        total_photos_counter++;
        $("#counter").text("# " + total_photos_counter);
    }
};


var dropzoneFilesCopy = dropzone.files.slice(0);
dropzone.removeAllFiles();
$.each(dropzoneFilesCopy, function(_, file) {
    if (file.status === Dropzone.ERROR) {
        file.status = undefined;
        file.accepted = undefined;
    }
    dropzone.addFile(file);
});

[nkogit]

Try changing the file status from "error" to "queued" on upload error and then calling processQueue() to continue processing.

dropzone.on("error", function(file, errorMessage, xhr) {
    file.status = "queued";
    dropzone.processQueue();
});

Add infinite loop protection as needed.

[orion3dgames]

@nkogit solution works well. Thanks to him. Below an example with infinite loop protection.

var retryTimes = 3;

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

dropzone.on("success", function(file, errorMessage, xhr) {
    this.removeFile(file);
},

dropzone.on("error", function(file, errorMessage, xhr) {
    if(!file.retryTimes){
        file.retryTimes = 0;
    }

    file.retryTimes = file.retryTimes + 1;

    if(file.retryTimes < retryTimes) {
        file.status = Dropzone.QUEUED
        // dropzone.processQueue(); // No need this as I already have autoProcessQueue = true
    }else{
        this.removeFile(file);
    }
});

[WalkUnderPressure]

file.status = "QUEUED";

file.status = Dropzone.QUEUED