JavaScriptのコードをPNGに偽装!?

 プログラム
 公開日:2015年5月13日

JavaScript を PNG に圧縮する

 これは面白い!
難読化というかステルスなJavaScriptとして使えそうです(^_^;)
DOM生成とかも全てJavaScriptでやれば、
一つのhtmlファイルだけで完結するアプリとか作れちゃいそうですね。
サーバー側の仕組みとか無しで、
クライアント側だけで出来ちゃうのがポイントですね。
仕組みとしては以下の様な感じのようです。
1)JSコードの文字列をcanvasのimagedataとして詰め込む。
2)自己解凍なコードをチャンクとして埋め込んでPNGにエンコードする。
3)拡張子をhtmlにしたファイルとして生成する。
JSコードに戻すには上記の逆をやれば良いことになりますが、
PNGのデコードはブラウザの方でやってくれるので、
1)の逆だけで済みますね。

 特定の公開フォルダに置いたPNGのMIMEがtext/htmlとして解釈されるように
サーバーの設定とか出来れば、画像が置かれているだけのように見えますね。
といってもサーバー管理者以外に意味なさそうですが(^_^;)

 自己解凍の仕組みがスゲー巧妙&トリッキー!
バイナリであってもHTMLとして解析できれば動いちゃうのですね(^_^;)
こちらのデモでダウンロードした、png.html を png.png にリネームすると、
ちゃんと画像として表示できます。

 ときに、自己解凍のコードに (1,eval)(e) とあるのが気になりました。
そういえば自分は eval とか使ったこと無いなぁ。
こちらによると、間接のeval呼び出しはグローバルスコープで実行されることが保証されているそうです。
以下のようなコードを実行すると、

↓こんな結果になるそうです。一つ勉強になりました。

 それにしても、もともとは読み込み時間を短くするために、
Closure Compiler とかを使ってJavaScriptコードを圧縮するわけですが、
意図せずしてコードの難読化にもなっていたりします。
とは言えテキストなので読もうと思えばナントカ読めます。
しかしバイナリ圧縮までされるともう読む気が失せますね(^_^;)
というか最近は Emscripten で変換したコードとかあって、
もはや人間が読めるような代物でないのもありますが(^_^;)

 ちなみに、jQueryは↓こんな画像になるようです。

コメント / トラックバック 4 件

  1. kaoru より:

    はじめまして。

    JavaScriptのコードの圧縮
    の記事、興味深く読ませて頂きました。
    http://www20.atpages.jp/katwat/wp/?p=4827

    該当のURLのサービスを利用して、
    png.pngというファイルを作り、
    サーバーにアップするところまでは、
    出来たのですが、このjavascriptファイルを
    読み込む方法が分かりませんでした。

    下記のような方法で合っているか
    ご存じでしたら、ご教授頂けますと幸いです。

    どうぞよろしくお願いいたします。

    • 管理人 より:

       自動承認にしていたため、先ほどコメントに気づきました(^_^;)
      失礼しました。

       htmlのimgタグでやるには例えば以下のように書けば良いかと。
      こちらに書いてあるように decodeText() した後に eval() すればOKです。元のコードだと長くなるのでminifyしてあります。

  2. kaoru より:

    ご連絡ありがとうございます!

    試しに
    http://which.ever.jp/test.html
    に、
    教えて頂いたコードを記述してみました。

    http://which.ever.jp/js.png

    pngの画像は、htmlファイルを、js.pngと言う名前で
    リネームしています。

    おそらく何か、自分のやり方が
    間違っているのかも知れません。
    アラートで「3」と表示されるはずなのですが
    自分の方法が、なにか違うのだと思います。

    何かお気づきの点がありましたら
    ご教授頂けますと大変助かります。

    どうぞよろしくお願いいたします。

    • 管理人 より:

       おそらく、
      こちらのサイトのツールで生成していると思われますが、エンコードの仕方が異なるのでうまく行かないと思います。

       拙作のツールを使って変換してみてください。

管理人 にコメントする