8

画像をエンコードしてデコードしようとしています。FileReaderのreadAsDataURLメソッドを使用して、画像をbase64に変換しています。それからそれを元に戻すために私は使ってみ ましたが運がありませんでしたreadAsBinaryString()。atob()base64でエンコードせずに画像を永続化する別の方法はありますか？

readAsBinaryString（）

指定されたBlob（ファイルの場合もあります）の内容の読み取りを開始します。読み取り操作が終了すると、readyStateはDONEになり、onloadendコールバック（存在する場合）が呼び出されます。その時点で、result属性にはファイルからの生のバイナリデータが含まれています。

私がここで間違っていることについて何か考えはありますか？

サンプルコード http://jsfiddle.net/qL86Z/3/

$("#base64Button").on("click", function () {
    var file = $("#base64File")[0].files[0]
    var reader = new FileReader();

    // callback for readAsDataURL
    reader.onload = function (encodedFile) {
        console.log("reader.onload");
        var base64Image = encodedFile.srcElement.result.split("data:image/jpeg;base64,")[1];
        var blob = new Blob([base64Image],{type:"image/jpeg"});
        var reader2 = new FileReader();

        // callback for readAsBinaryString
        reader2.onloadend = function(decoded) {
            console.log("reader2.onloadend");
            console.log(decoded); // this should contain binary format of the image

            // console.log(URL.createObjectURL(decoded.binary)); // Doesn't work
        };
        reader2.readAsBinaryString(blob);

        // console.log(URL.createObjectURL(atob(base64Image))); // Doesn't work

    };
    reader.readAsDataURL(file);
    console.log(URL.createObjectURL(file)); // Works
});

ありがとう！

4

2 に答える 2

14

さらに調査した結果、ここから答えが見つかりました。 基本的に、生のバイナリを配列バッファでラップし、バイナリ文字をUnicodeに変換する必要がありました。

これは欠落していたコードです、

    var binaryImg = atob(base64Image);
    var length = binaryImg.length;
    var ab = new ArrayBuffer(length);
    var ua = new Uint8Array(ab);
    for (var i = 0; i < length; i++) {
        ua[i] = binaryImg.charCodeAt(i);
    }

完全なサンプルコードはこちら

于 2013-02-20T19:17:09.550 に答える
1

URL.createObjectURL引数としてBlob（）を期待します。File文字列ではありません。それが機能する理由URL.createObjectURL(file)です。

代わりに、データURLとして読み取るを作成し、そのデータURLを使用して別の（同じ内容の）データを作成します。そして、作成したばかりのからバイナリ文字列を取得するためにを作成することもできます。ただし、URL文字列部分（より大きな文字列にデコードされた場合でも）も文字列も！への有効な引数ではありません。FileReader readerfileBlobreader2blobbase64Imagebtoadecoded.binaryURL.createObjectURL

于 2013-02-20T00:24:13.363 に答える