我正在创建一个使用 Google Drive API 的 Google Chrome 扩展程序。我必须使用 HTML5 上传文件。
对于文本文件,没有问题。但是当我想上传一个二进制文件时,总是有错误。
因此,当我使用 HTML5 中的 FileReader 作为 BinaryString 上传文件时,我的图像已损坏,无法读取。
当我使用 Base64 编码(正文部分中的标头“Content-Transfer-Encoding: base64”)时,我有一个 400 Bad Request -> Malformed multipart body。
你能帮我吗 ?谢谢 :)
PS:我不想使用Google Drive SDK,我更喜欢编写所有代码。
var bb, reader;
var meta = {
"title": "mozilla.png",
"mimeType": "image/png",
"description": "Mozilla Official logo"
};
var xhr = new XMLHttpRequest();
xhr.open('GET', 'https://developer.mozilla.org/media/img/mdn-logo-sm.png', true);
xhr.responseType = 'arraybuffer';
xhr.onload = function(e){
if(this.status == 200){
bb = new WebKitBlobBuilder();
bb.append(this.response);
console.log('Download OK');
reader = new FileReader();
reader.readAsDataURL(bb.getBlob('image/png'));
reader.onloadend = function(e){
console.log('Reader OK');
var bound = 287032396531387;
var parts = [];
parts.push('--' + bound);
parts.push('Content-Type: application/json');
parts.push('');
parts.push(JSON.stringify(meta));
parts.push('--' + bound);
parts.push('Content-Type: image/png');
parts.push('Content-Transfer-Encoding: base64');
parts.push('');
parts.push(reader.result);
parts.push('--' + bound + '--');
var xhr = new XMLHttpRequest();
xhr.open("POST", "https://www.googleapis.com/upload/drive/v2/files?uploadType=multipart", true);
xhr.setRequestHeader("Authorization", "Bearer token123456");
xhr.setRequestHeader("Content-Type", "multipart/mixed; boundary=" + bound);
xhr.onload = function(e){
console.log("DRIVE OK", this, e);
};
xhr.send(parts.join("\r\n"));
}
}
};
xhr.send();
对于二进制上传,只需修改这一行:
reader.readAsDataURL(bb.getBlob('image/png'));
以此
reader.readAsBinaryString(bb.getBlob('image/png'));
并删除这一行:
parts.push('Content-Transfer-Encoding: base64');
我尝试通过首先发送元数据来创建一个文件,然后在这篇文章中上传内容,但上传内容时总是出现 404 错误,但这是另一个故事......