是否可以通过 AJAX *顺序*上传文件?

Is it possible to upload files *sequentially* via AJAX?

我已经使用 dragAndDrop: reportDirectoryPaths 选项通过 Fine Uploader 成功实现了目录结构的上传。每个上传的文件都有它的 qqpath 属性 来表示它来自的路径。

var exampleUploader = new qq.FineUploader({
    element: document.getElementById('fine-uploader'),
    template: 'qq-template-manual-trigger',
    request: {
        endpoint: '/api/UploadDocuments',
        params: {
            param1: "Test1",
            param2: "Test2"
        }
    },
    callbacks: {
        onComplete: function (id, name, responseJSON, xhr) {
            console.log("onComplete");
        },
        onAllComplete: function (id, name, responseJSON, xhr) {
            console.log("onAllComplete");
        }
    },
    multiple: true,
    dragAndDrop: {
        reportDirectoryPaths: true
    },
    autoUpload: true,
    debug: false
});

但是有一个问题:文件是一个一个上传的,但是有时会同时调用ajax请求。如果同时将具有相同目录结构的两个文件传递给服务,则可能会一次性创建两次目录。有没有办法只在前一个成功时执行 ajax 请求?换句话说,有没有办法按顺序上传文件,而不是同时上传(一大堆文件一次传递到服务中)?

提前致谢, j

您看到的问题是您的服务器问题,而不是任何问题 client/browser-side。将您的前端一次限制为一个请求是短视的。这提出了一个完全不必要的瓶颈。您的服务器应该解决所有这些问题。

一种方法是通过Fine Uploader分配的UUID keying上传的文件,然后再整理存储层次。如果您不想信任 Fine Uploader 提供的 UUID,您始终可以生成自己的服务器端,return 将其与响应一起使用,Fine Uploader 会将其用于与该特定相关的所有其他请求改为文件。

另一种方法是让您的服务器简单地检查服务器端以查看目标文件的目录是否已经存在。

请记住,您所依赖的 "qqPath" 属性 仅存在于 Chrome/Opera 中,并且仅在删除目录时存在。

如果您想使用 fine uploader 一个一个地上传文件,最简单的方法是将最大连接数限制为 1。

var exampleUploader = new qq.FineUploader({
    element: document.getElementById('fine-uploader'),
    template: 'qq-template-manual-trigger',
    request: {
        endpoint: '/api/UploadDocuments',
        params: {
            param1: "Test1",
            param2: "Test2"
        }
    },
    callbacks: {
        onComplete: function (id, name, responseJSON, xhr) {
            console.log("onComplete");
        },
        onAllComplete: function (id, name, responseJSON, xhr) {
            console.log("onAllComplete");
        }
    },
    maxConnections: 1,
    multiple: true,
    dragAndDrop: {
        reportDirectoryPaths: true
    },
    autoUpload: true,
    debug: false
});

默认情况下,参数 maxConnections 为 3。