Rest 使用Dropzone.js上载BLOB/ArrayBuffer

使用SharePoint 2013 REST API，我正在使用Dropzone.js成功地将文件（如

.docx

或

.png

）上载到文档库中的文件夹中。我有一个初始化dropzone的函数，如下所示：

myDropzone = new Dropzone("#dropzone");

myDropzone.on("complete", function (file) {
    myDropzone.removeFile(file);
});

myDropzone.options.autoProcessQueue = false;

myDropzone.on("addedfile", function (file) {
    $('.dz-message').hide();
    myDropzone.options.url = String.format(
    "{0}/{1}/_api/web/getfolderbyserverrelativeurl('{2}')/files" +
    "/add(overwrite=true, url='{3}')",
    _spPageContextInfo.siteAbsoluteUrl, _spPageContextInfo.webServerRelativeUrl, folder.d.ServerRelativeUrl, file.name);
});

myDropzone.options.previewTemplate = $('#preview-template').html();

myDropzone.on('sending', function (file, xhr, fd) {
    xhr.setRequestHeader('X-RequestDigest', $('#__REQUESTDIGEST').val());
});

我遇到的问题是，当上传完成时，几乎所有的文件（PDF是唯一没有）都显示为损坏的文件。这很可能是因为SharePoint要求将上载的文件作为阵列缓冲文件发送

通过使用常规Ajax帖子和上述方法将文件转换为arraybuffer，我成功地将内容上载到SharePoint文档库，而不会损坏它们。现在，我想做同样的事情，但不必省略Dropzone.js的使用，它为功能的界面添加了非常好的触感

我已经研究过如何修改

dropzone.js

中的

uploadFiles（）

-方法，但这似乎很激烈。我还试图弄清楚是否可以使用

options

中的

accept

选项，但这似乎是一条死胡同

解决方案中两个最相似的问题如下所示，第一个似乎适用于我的情况，但同时看起来没有我想要使用的那么“干净”

第二个用于上传带有

Base64

编码的图像

---

因此，我的问题是，当添加一个文件时，我如何截取它，将数据转换为arraybuffer，然后使用Dropzone.js发布它？

这是对我自己问题的最新回答，但这是我们最终寻求的解决方案

我们保留了

dropzone.js

，只是为了更好的界面和一些帮助功能，但是我们决定使用

$.ajax（）

进行实际的文件上传

我们使用HTML5

FileReader

var reader = new FileReader();
reader.onloadend = function(e) {
    resolve(e.target.result);
};
reader.onerror = function(e) {
    reject(e.target.error);
};
reader.readAsArrayBuffer(file);

---

然后将其作为ajax选项中的

数据

参数传递。

我最近遇到了这个问题，并且对Dropzone库进行了一些调查

我通过对Dropzone.prototype.submitRequest（）方法进行猴子修补，成功纠正了SharePoint/Office 365的上载过程，将其修改为使用我自己的getArrayBuffer方法，该方法使用FileReader API返回ArrayBuffer，然后再通过Dropzone生成的XMLHttpRequest发送

这使我能够继续使用Dropzone API的功能

只测试了一次自动上传，因此需要进一步调查多文件上传

猴斑 getArrayBuffer

---

文件上载到SharePoint后，我使用Dropzone“success”事件使用元数据更新文件

我面临着一个类似的问题。。。你能告诉我你最后做了什么吗？你使用dropzone的拖放功能了吗？如果是，您是如何将文件传递给阅读器的？或者您示例中的文件是dropzone的file参数？我在dropzone中添加了一个事件侦听器，并使用

files=evt.dataTransfer.files访问文件，所以它不是来自
dropzone.js
，而是纯javascript。
Dropzone.prototype.submitRequest = function (xhr, formData, files) {
    getArrayBuffer(files[0]).then(function (buffer) {
        return xhr.send(buffer);
    });
};

function getArrayBuffer(file) {
    return new Promise(function (resolve, reject) {
        var reader = new FileReader();

        reader.onloadend = function (e) {
            resolve(e.target.result);
        };
        reader.onerror = function (e) {
            reject(e.target.error);
        };
        reader.readAsArrayBuffer(file);
    });
}