我想使用dropzone。js将文件直接上载到Azure Blob存储,SAS(此处示例)将文件保持私有。
据我所知,工作流程是:
我发现下面的wiki文章展示了如何动态设置dropzone URL(https://github.com/enyo/dropzone/wiki/Set-URL-dynamically)
Dropzone.options.myDropzone = {
init: function() {
this.on("processing", function(file) {
// I need to do an async call here, to get the URL...
this.options.url = "/some-other-url";
});
}
};
问题是上面的例子是同步的。我如何延迟上传,直到从我的web api异步请求URL?
谢谢
也许我的回答有点晚了
只需保存在表单
中
Dropzone.options.myDropzone = {
method: "PUT",
headers: {"x-ms-blob-type": "BlockBlob"},
sending: (file, xhr) => {
// To send file without wrappintng it to multipart/form-data,
// Azure won’t unwrap it
const _send = xhr.send;
xhr.send = () => { _send.call(xhr, file) };
},
init: function() {
const dz = this,
action = dz.element.action,
sas = dz.element.dataset.sas;
dz.on("processing", (file) => {
dz.options.headers["Content-Type"] = file.type;
dz.options.url = `${action}/${file.name}?${sas}`;
})
},
}
Dropzone.options.myDropzone = {
autoProcessQueue: false, // To prevent automatic auploading before getting SAS
acceptedFiles: ".xls,.xlsx",
method: "PUT",
headers: {"x-ms-blob-type": "BlockBlob"},
sending: (file, xhr) => {
// To send file without wrappintng it to multipart/form-data,
// Azure won’t unwrap it
const _send = xhr.send;
xhr.send = () => { _send.call(xhr, file) };
},
init: function() {
let sas = null;
const dz = this,
xhr = new XMLHttpRequest();
xhr.addEventListener("load",
(event) => {
sas = getSasFromEvent(event);
dz.options.autoProcessQueue = true;
dz.processQueue();
}, true);
xhr.open("GET", "/get-sas");
xhr.send();
dz.on("processing", (file) => {
dz.options.headers["Content-Type"] = file.type;
dz.options.url = `${action}/${file.name}?${sas}`;
})
},
}
请参见以编程方式创建删除区
您可以尝试使用jQuery进行同步ajax调用。
function GetUrl() {
var url = "";
$.ajax({
async: false,
success: function(data) {
url = data;
}
// Other opts
});
return url;
}
Dropzone.options.myDropzone = {
init: function() {
this.on("processing", function(file) {
this.options.url = GetUrl();
});
}
};