キャンバスのデータ配列にtExtチャンクを追加し、それをjavascriptのpngファイルとして保存するにはどうすればよいですか？

Question

私はキャンバスにイメージを持っています。余分なライブラリをインストールする必要なく、単純なテキストメタデータを追加したいと思います。 toDataURLの結果を見ると、これはtoDataURL結果からbase64配列を解析し、IDATチャンクの前にlength、type、key：content、およびcrcバイトのチャンクを挿入することで可能と思われます。 しかし、私はhttps://www.w3.org/TR/PNG-Structure.htmlに記載されているpng構造にbase64配列を一致させることができませんでした。たとえば、最初の8バイトは、小数点付きの署名バイトとみなされます。137 80 78 71 13 10 26 10.しかし、toDataURL結果の最初のASCii文字（data：image/png; base64、 "prefix"の後）はiVBORw0が。どのようにそれが期待シグネチャと一致していますか？

私はJavaScriptを使用していますし、変換がクライアント側で実行されます。

ありがとう！

Answer 1

感謝をKaiidoさんのコメントに上記の、私は正常にtoDataURL配列をデコードここでbase64-binary.jsコードを使用してください：http://blog.danguer.com/2011/10/24/base64-binary-decoding-in-javascript/。これは使い方のスニペットです：

pngLayer = layerToSave.canvas.toDataURL(); 
    var uintArray = Base64Binary.decode(pngLayer.replace(/data:image\/png;base64,/,'')); 
    console.log("signature:", uintArray.slice(0,8)); 
    console.log("chunk 1 length:", uintArray.slice(8,12)); 
    console.log("chunk 1 type:", uintArray.slice(12,18)); 

このCコードはまた、PNGの構造を操作する方法のサンプルとして役立ちました：https://github.com/gbenison/png-text-embed/blob/master/png-text-append.c