【发布时间】：2016-07-08 17:34:42
【问题描述】：
在关闭浏览器后，使用 Fine-uploader 恢复先前中断的上传的一般方法是什么？我搜索了文档并使用了代码，但没有任何成功。
我设想使用可恢复文件以及“恢复”和“取消”按钮（如暂停上传）重新填充上传器。我以为我可以使用 getResumableFilesData() 和 addInitialFiles()，但状态默认为 COMPLETED。如果我应该使用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)
}
【问题讨论】：
-
看看大多数大文件上传器，99% 的时间它们都是桌面/移动应用程序，因为浏览器如何处理事情。 Web 浏览器通常是沙盒式的，以至于一旦文件在内存中释放，就很难判断文件在哪里被遗漏了。我在 Internet Explorer 中看到了一些非常骇人听闻的东西，但这本身就是一件令人头疼的事情。你有什么可以向我们展示你正在做的事情吗？
-
关键是您的用户必须重新提交中断的文件。浏览器无法在没有用户干预的情况下访问您的文件系统并检索文件。有关详细信息，请参阅我的答案。
标签： fine-uploader