4

新しい FileReader API を使用して、アップロード前に画像をプレビューしています。これは、DataURL を使用して行われます。ただし、画像が大きい場合、DataURL は巨大になる可能性があります。ユーザーが一度に複数の画像をアップロードする可能性があり、その束をプレビューすると実際にブラウザーが大幅に遅くなり、実際にクロムが数回クラッシュしたため、これは特に問題です。

アップロード前にクライアントで画像をプレビューするために DataURL を使用する代わりに何かありますか?

4

1 に答える 1

3

クライアントのディスク（JavaScriptを使用してファイルにアクセスできるように別の場所）にデータを保存することもできます。このテーマに関しては、この記事は非常に広範囲にわたっています。

http://www.html5rocks.com/en/tutorials/file/filesystem/

ただし、すべてのブラウザでサポートされているわけではありません。

ストレージスペース（ファイルシステム）を要求し、ファイルを作成してデータを書き込み、最後にURLを取得する必要があります。

window.requestFileSystem(window.PERSISTENT, 5*1024*1024, function(fs) {
    fs.root.getFile(filename, {create: true}, function(fileEntry) {
        fileEntry.createWriter(function(fileWriter) {
            var arr = new Uint8Array(data.length);

            // fill arr with image byte data here

            var builder = new BlobBuilder();
            builder.append(arr.buffer);
            var blob = builder.getBlob();

            fileWriter.write(blob);

            location.href = fileEntry.toURL(); // navigate to file. The URL does not contain the data but only the path and filename.
        });
    });
}, function() {});
于 2011-07-17T13:05:57.433 に答える