14

私の見解の1つに、ファイルアップロードコントロールがあります。ドラッグアンドドロップ、またはボタンクリック後に開く標準のファイルダイアログを介したファイルのアップロードをサポートします。

私のe2eテストでこれを行う方法1？

12つのオプションのうち1つだけで十分です

4

1 に答える 1

3

Javascript BLOB を使用してファイルをアップロードできます。これには、古いブラウザー ( http://caniuse.com/fileapi )と互換性のない FileApi が必要です。しかし、FileApi を使用するドラッグ アンド ドロップ アップロードの使用について言及したので、それほど重要ではありません。

BLOB API を使用してファイルをアップロードするには、2 つの方法があります。1 つは非常に簡単で、もう 1 つは単純に最初の続きです。

Javascript を使用すると、次のように新しい BLOB を作成できます。

var blob = new Blob("content", contentType);

たとえば、これは "Hello World!" というテキストを含む blob オブジェクトを作成します。

var foo = new Blob("Hello World!", {type: "text/plain"});

次の方法は、pdf などの非プレーンテキスト ファイルに適しています。ファイルを Base64 に変換し (このようなものを使用できます)、Base64 データを使用して BLOB を作成する必要があります。

この関数 (これを少し変更したバージョン)を使用して、ブロブを作成します。

function b64toBlob(b64Data, contentType, sliceSize) {
b64Data = b64Data.replace(/\s/g, '');
contentType = contentType || '';
sliceSize = sliceSize || 1024;

function charCodeFromCharacter(c) {
    return c.charCodeAt(0);
}

var byteCharacters = atob(b64Data);
var byteArrays = [];

for (var offset = 0; offset < byteCharacters.length; offset += sliceSize) {
    var slice = byteCharacters.slice(offset, offset + sliceSize);
    var byteNumbers = Array.prototype.map.call(slice, charCodeFromCharacter);
    var byteArray = new Uint8Array(byteNumbers);

    byteArrays.push(byteArray);
}

var blob = new Blob(byteArrays, {type: contentType});
return blob;
}

たとえば、これは PDF blob オブジェクトを作成します。

var pdf = "JVBERi0xLjQKJcfsj6IKNSAwIG9...=="; //base64 encoded file as a String
var pdfBlob = b64toBlob(pdf, "application/pdf", 1024);

上記のいずれかの方法で BLOB を作成すると、それをファイルとして扱うことができます。たとえば、ファイルを FormData オブジェクトに入れることができます (このようなアップロードを行う場合):

var fd = new FormData();
fd.append("uploadedFile", pdfBlob, "My PDF.pdf"*);

*ファイル名パラメーターは現在 Chrome でのみ機能するようです。

于 2013-06-03T14:45:45.420 に答える