Javascript Dropzone区块上载到Azure存储

我正在尝试使用dropzone使用SAS（共享访问签名）将大型文件直接上载到Azure存储。这在Azure端有文档记录，如下所示：

因此，我必须获取blockId（一个标识我正在发送的区块的Base64字符串），并将其放入发送该区块的请求的url中

Dropzone现在支持分块，所以我决定使用它。不幸的是，很难找到它的实现

我可以在处理事件中更改url，但这是每个文件的url，我无法从中获取区块数据

我可以使用params在表单数据中发送blockId，但似乎无法从中更改url

是否可以将blockId添加到我的url？或者我必须先将它发送到我的服务器并从那里上传？谢谢

$("#videoSection").dropzone({
            params: function (files, xhr, chunk) {
                console.log(chunk);

                xhr.setRequestHeader('x-ms-blob-type', 'BlockBlob');

                //I can get the blockId from the chunk here

                //this.options.url.replace("test") //doesn't work
                //xhr.open(this.options.method, this.options.url.replace("test"), true); //doesn't work

                return {"url": "test"}; //this returns form-data
            },
            url: "Create",
            method: "PUT",
            //headers: { "x-ms-blob-type": "BlockBlob" },
            chunking: true,
            chunkSize: 4000000,
            forceChunking: true,
            retryChunks: true,
            retryChunksLimit: 3,
            autoProcessQueue: false,
            acceptedFiles: "video/*",
            maxFiles: 1,
            maxFilesize: 3000,
            previewTemplate: $("#videoTemplate").html(),
            dictDefaultMessage: "Drop Video Here",
            init: function () {
                this.on("processing", function (file) {
                    var blockId = 1;

                    @*this.options.url = "@(Config.Value.StoragePrefix)/@(user.Company.StorageName)/inspections/@Model.InspectionData.Inspection.Id/videos/"
                        + file.name + "@Html.Raw(Model.SharedAccessSignature + "&comp=block&blockid=")" + blockId;*@


                    var progressBar = $(file.previewElement).find(".dropzoneProgressBar");
                    progressBar.show();
                });
                this.on("chunksUploaded", function (file, done) {
                    $.ajax({
                        type: "PUT",
                        url: "@(Config.Value.StoragePrefix)/@(user.Company.StorageName)/inspections/@Model.InspectionData.Inspection.Id/videos/"
                            + file.name + "@Html.Raw(Model.SharedAccessSignature + "&comp=blocklist")",
                        success: function (data) {
                            done();
                        },
                        error: function (e) {
                            toastr.error(e);
                            console.log(e);
                        }
                    });
                });
                this.on("uploadprogress", function (file, progress, bytesSent) {
                    var progressBar = $(file.previewElement).find(".dropzoneProgressBar");
                    progress = bytesSent / file.size * 100;
                    progressBar.width(progress + "%");
                });
                this.on("success", function (file, response) {
                    var successCheckmark = $(file.previewElement).find(".dropSuccess");
                    successCheckmark.toggle();
                    var progressBar = $(file.previewElement).find(".dropzoneProgressBar");
                    progressBar.css("background-color", "green");
                });
            }
        });

---

此行

this.options.url.replace（“test”）//有问题。

。它应该是

this.options.url=this.options.url.replace（“test”，“newValue”）//这应该可以用

。我正在使用类似的方法。问题是，一旦打开

XmlHttpRequest

，就会调用

params

回调，因此您需要在开始处理文件之前设置第一个块的url，并且在

params

中，您需要设置要发送的下一个块的url（使用

chunk.index+1

进行零基索引）。如果启用了

parallelChunkUploads

，我不确定这是否有效-我还没有测试要处理的第一个块是否是第一个块。如果您需要更多信息，请告诉我。

实际上，我已经转到了内置azure支持和其他一些漂亮功能（如初始文件列表）的网站。当然，在我实现它18小时后，作者停止了对它的维护，但它在我当前的目的下工作。不过，还是要感谢大家对dropzone的关注。我将把这个标记为答案。