3

ユーザーが私のウェブサイトを使用しているときにユーザーの画面のスクリーンショットを撮り、html2canvasを使用してサーバーにアップロードしようとしています。これは、ChromeとFirefoxを使用しているデスクトップでうまく機能します（画面> html2canvas> imageURL> Unit8Array> Blob>アップロード）。

ただし、iPadでコードを実行すると、Blob作成コードがhtml2canvasの画像ファイルからの入力を台無しにしています。画像は、明らかな理由もなく、サイズが約40kから19バイトに縮小します。以下は私のコードです。

iPadの出力は、「*」を使用して強調表示されます。

var unit8 = new Uint8Array(imageArray);
var imgBlob;

// check length of encoded image
// *** On this iPad, this generates meaningful size eg 41240 ***
if(navigator.userAgent.match(/iPad/i) != null){                     
    alert('length of the Unit8Array: ' + unit8.length);
}

if(typeof Blob !== 'undefined'){
    // detect if Blob object is supported
    // *** The iPad supports Blob object, it even support it's constructor ***
imgBlob = new Blob([unit8], {type: 'image/jpeg'});
} else if(window.BlobBuilder || window.MSBlobBuilder || 
            window.WebKitBlobBuilder || window.MozBlobBuilder) {
    // generating Blob - the old fashion way
    // Not used by iPad
    var blobBuilderObj = new (window.BlobBuilder || window.WebKitBlobBuilder ||
              window.MozBlobBuilder || window.MSBlobBuilder)();
    blobBuilderObj.append(unit8.buffer);
    imgBlob = blobBuilderObj.getBlob('image/jpeg');
} else {
    // Cannot generate Blob
    alert('Error occurred during Blob generation');
    return;
}

// check length of encoded image
// *** On the iPad imgBlob.size = 19 and imgBlob.toString() = [Object Blob] ***
if(navigator.userAgent.match(/iPad/i) != null){
    alert('Before attach 1: length of the encoded message: ' + imgBlob.size + 
        ', Blob content: ' + imgBlob.toString());
}

なぜですか？

どうもありがとう、ホイ

4

1 に答える 1

2

ここでのコメントの調査から、Uint8Array オブジェクトではなく Blob() コンストラクターに渡す必要があるように見えますが、それはバッファー プロパティです。

new Blob([unit8.buffer], {..})

少なくともこの方法で、iPhone5 の iOS6 にアップロードできるブロブを作成できました。

于 2013-08-27T11:27:20.977 に答える