GoogleDriveAPIを使用するGoogleChrome拡張機能を作成しています。HTML5でファイルをアップロードする必要があります。
テキストファイルの場合、問題はありません。しかし、バイナリファイルをアップロードしたい場合、常にエラーが発生します。
そのため、HTML5のFileReaderをBinaryStringとして使用してファイルをアップロードすると、画像が破損し、読み取ることができません。
また、Base64エンコーディング(本文部分「Content-Transfer-Encoding:base64」のヘッダーを使用)を使用すると、400 Bad Request-> Malformedmultipartbodyが発生します。
手伝ってくれませんか?ありがとう :)
PS:Googleドライブ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エラーが発生しますが、これは別の話です...