このページは tnSplit.js を使って、ソースコードを難読化するデモを行います。
- 「解析後のソースコード」とは、デベロッパーツール、ページ保存機能などで取得可能なソースです。
- 「元のソースコード」とは、【ソースを表示】メニュー、Web自動巡回ツールなどで取得可能なソースです。
以下の「桃太郎」の部分のソースを、tnSplit.js を用いて、難読化いたしました。(ソースを難読化すると、マウスで選択してコピーすることはできなくなります。)
昔々ある所に、おじいさんとおばあさんが住んでいました。おじいさんは山へしばかりに、おばあさんは川へせんたくに行きました。
ある日おばあさんが川で洗濯をしていると、ドンブラコ、ドンブラコと、大きな桃が流れてきました。おばあさんは大きな桃をひろいあげて、家に持ち帰りました。
その夜、おじいさんが、「じゃあ、この桃を切ってみよう」と言うと、桃の中から元気の良い男の赤ちゃんが飛び出してきました。おじいさんとおばあさんは、「これはきっと、神さまがくださったにちがいない」と思いました。その子は桃から生まれたので、「桃太郎」という名前に決めました。
難読化の確認を行うには、「右クリック → 検証」(FireFoxでは、「右クリック → 要素を調査」)で、デベロッパーツールを開けて、ソースコードを見渡してください。「桃太郎」以外の文章はすぐに見つかると思います。
「桃太郎」の部分を見つけるのは、かなり手間がかかるかもしれません。以下の図のように、ランダムな階層構造をもった多数のタグが「桃太郎」の文章を構成しています。これらのダグは tnSplit.js によって生成されたものです。文字が一つ一つに分解されて複雑な階層構造を形成しているので、読むのはかなり難解です。
なお、ブラウザのページ保存機能を使ってページを書き出しても、この難解さは維持されます。ページ保存機能を試すには、Windowsでは、[Ctrl] + [S]、Macでは、[Cmd] + [S]のキーを押してください。