15

XHRを介してArrayBufferを取得していて、FileWriterを使用してFileSystemAPIに保存したいと思います。FileWriterはBlobを想定しており、BlobコンストラクターはArrayBufferを取得せず、ArrayBufferViewを取得します。

選択できるArrayBufferViewは多数ありますが、どれを使用するのが正しいかをどのように知ることができますか?

4

1 に答える 1

15

MDNでは、利用可能なすべてのArrayBufferViewサブクラスの概要を見つけることができます。

Type         | Size | Description                           | Equivalent C type
-------------+------+---------------------------------------+------------------
Int8Array    | 1    | 8-bit twos complement signed integer  | signed char
Uint8Array   | 1    | 8-bit unsigned integer                | unsigned char
Int16Array   | 2    | 16-bit twos complement signed integer | short
Uint16Array  | 2    | 16-bit unsigned integer               | unsigned short
Int32Array   | 4    | 32-bit twos complement signed integer | int
Uint32Array  | 4    | 32-bit unsigned integer               | unsigned int
Float32Array | 4    | 32-bit IEEE floating point number     | float
Float64Array | 8    | 64-bit IEEE floating point number     | double

基本的に、これは、配列の各項目が占めるメモリスペースと、それが単純な数値であるかFP番号であるかを示します。あなたが精通している言語はわかりませんが、Javaもカバーしている場合は、基本的に、、、、およびで行うのと同じ選択ですbyte[]short[]Javaint[]float[]常にdouble[]署名されているため、その部分は重要ではありません) )。

画像のようなバイナリデータは通常、バイト配列として表されます。短い/整数/長い配列も可能ですが、これはメモリスペースの浪費です。100KBの画像(「B」は8ビットであるバイトを表すことに注意してください)をバイト配列ではなくint配列に格納すると、400KBのメモリを占有し、300KBの無駄になります。したがって、Int8Arrayメモリスペースに関しては、最小のものですでに十分です。プログラムでそれをトラバースしたい場合(この場合はほとんどありません)、符号なし配列として、Uint8Array各項目が値の代わりに値0を保持する代わりに選択することができます。255-128127

これは、コピー'n'paste'n'実行可能なキックオフの例です。これは、サーバーから画像ファイルをダウンロードし、それを一時的なローカルストレージスペースに保存して<img>、本文に表示します(その部分には小さなjQueryが必要です)。image.pngこの例では、ファイルがJS(またはJSがインライン化されている場合はHTML)ファイルがダウンロードされたのと同じベースフォルダーにあることを前提としています。

window.requestFileSystem = window.requestFileSystem || window.webkitRequestFileSystem;
window.requestFileSystem(window.TEMPORARY, 1024*1024, startDownload, errorHandler);

var errorHandler = function(error) {
    console.log('FS error: ' + error);
}

var xhr = new XMLHttpRequest();
xhr.open('GET', 'image.png', true);
xhr.responseType = 'arraybuffer';

function startDownload(fileSystem) {
    xhr.onload = function(event) {
        var content = new Int8Array(this.response);
        fileSystem.root.getFile('/image.png', { 'create': true }, function(fileEntry) {
            fileEntry.createWriter(function(fileWriter) {
                fileWriter.onwriteend = function(event) {
                    $('body').append('<p>Image successfully downloaded:</p>')
                             .append('<p><img src="' + fileEntry.toURL() + '"/></p>');
                };

                var blob = new Blob([content], { type: 'image/png' });
                fileWriter.write(blob);
            }, errorHandler);
        });
    }

    xhr.send();
}

現在の状態では、これはChromeでのみ機能することに注意してください。

于 2013-01-18T02:27:15.527 に答える