Каков общий подход к возобновлению ранее прерванных загрузок с помощью Fine-uploader после закрытия браузера? Я искал документы и играл с кодом, но не добился успеха.
Я предусмотрел повторное заполнение загрузчика возобновляемыми файлами вместе с кнопками «Возобновить» и «Отмена» (например, загрузка ПРИОСТАНОВЛЕНА). Я думал, что могу использовать getResumableFilesData()
и addInitialFiles()
, но по умолчанию статус ВЫПОЛНЕН. Если я должен использовать addFiles()
, то как лучше построить входные значения? Или я вообще на неверном пути?
Пожалуйста, простите меня, если я упустил что-то очевидное. Я ищу полезный толчок в правильном направлении.
Заранее спасибо!
Вот мой шаблон прекрасного загрузчика:
<script type="text/template" id="qq-template">
<div class="qq-uploader-selector qq-uploader" qq-drop-area-text="Drop files here">
<div class="qq-total-progress-bar-container-selector qq-total-progress-bar-container progress total_progress">
<div role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100"
class="qq-total-progress-bar-selector progress-bar"></div>
</div>
<div class="qq-upload-drop-area-selector qq-upload-drop-area" qq-hide-dropzone>
<span class="qq-upload-drop-area-text-selector"></span>
</div>
<div class="qq-upload-button-selector btn btn-default">
<div><span class="glyphicon glyphicon-plus"></span> Browse
Files</div>
</div>
<br><br>
<span class="qq-drop-processing-selector qq-drop-processing">
<span>Processing dropped files...</span>
<span class="qq-drop-processing-spinner-selector qq-drop-processing-spinner"></span>
</span>
<ul class="qq-upload-list-selector qq-upload-list" aria-live="polite" aria-relevant="additions removals">
<li>
<div class="qq-progress-bar-container-selector progress">
<div role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100" class="qq-progress-bar-selector progress-bar"></div>
</div>
<span class="qq-upload-spinner-selector qq-upload-spinner"></span>
<span class="qq-upload-file-selector qq-upload-file"></span>
<span class="qq-edit-filename-icon-selector qq-edit-filename-icon" aria-label="Edit filename"></span>
<input class="qq-edit-filename-selector qq-edit-filename" tabindex="0" type="text">
<span class="qq-upload-size-selector qq-upload-size"></span>
<button type="button" class="btn btn-default btn-sm qq-upload-cancel-selector">Cancel</button>
<button type="button" class="btn btn-default btn-sm qq-upload-retry-selector">Retry</button>
<button type="button" class="btn btn-default btn-sm qq-upload-delete-selector qq-upload-delete">Delete</button>
<button type="button" class="btn btn-default btn-sm qq-upload-pause-selector">Pause</button>
<button type="button" class="btn btn-default btn-sm qq-upload-continue-selector">Continue</button>
<span role="status" class="qq-upload-status-text-selector qq-upload-status-text"></span>
</li>
</ul>
<dialog class="qq-alert-dialog-selector">
<div class="qq-dialog-message-selector"></div>
<div class="qq-dialog-buttons">
<button type="button" class="qq-cancel-button-selector">Close</button>
</div>
</dialog>
<dialog class="qq-confirm-dialog-selector">
<div class="qq-dialog-message-selector"></div>
<div class="qq-dialog-buttons">
<button type="button" class="qq-cancel-button-selector">No</button>
<button type="button" class="qq-ok-button-selector">Yes</button>
</div>
</dialog>
<dialog class="qq-prompt-dialog-selector">
<div class="qq-dialog-message-selector"></div>
<input type="text">
<div class="qq-dialog-buttons">
<button type="button" class="qq-cancel-button-selector">Cancel</button>
<button type="button" class="qq-ok-button-selector">Ok</button>
</div>
</dialog>
</div>
</script>
Вот моя конфигурация тонкого загрузчика.
var uploader = $('#fine-uploader').fineUploader({
template: 'qq-template',
debug: true,
callbacks: {
onAllComplete: function(succeeded, failed) {
$('#doclib_tree').jstree(true).refresh()
if (failed.length > 0) {
alert("Error: Some files were not uploaded");
} else {
if (succeeded.length > 0 ) {
alert("Successfully uploaded " + succeeded.length + " file(s)");
}
this.reset();
toggle_upload();
}
},
onError: function(id, name, errorReason, xhrOrXdr) {
alert("Error uploading " + name + ". Reason: " + errorReason)
},
onSubmit: function(id, name) {
var promise = new qq.Promise();
var dest = document.getElementById('dest_label').innerHTML.replace(/ > /g, "/")
$.ajax({
'type': 'POST',
'async': false,
'url': "/documents/exists" ,
'data': {
'parents' : get_path(dest),
'name': name,
},
'success': function(data, textStatus, jqHXR) {
if ( check_session(data) ) {
promise.failure();
} else {
if (confirm("The file '" + dest + "/" + name + "' already exists. Replace?"))
promise.success();
else
promise.failure();
}
},
'error': function(jqHXR, textStatus, errorThrown) {
promise.success();
}
});
return promise;
},
},
chunking: {
enabled: true,
partSize: 20000000, // 20MB
success: {
endpoint: "/documents/upload?success=1",
}
},
resume: {
enabled: true
},
request: {
endpoint: "/documents/upload",
},
autoUpload: true
});
Вот фрагмент кода, в котором я хотел бы получить и отобразить возобновляемые файлы при инициализации. Я действительно получаю заполненный массив resumes
.
var resumes = uploader.fineUploader('getResumableFilesData')
if ( resumes > 0 ) {
// Should I be doing something different here?
uploader.fineUploader('addFiles', resumes)
}