Gemini Canvasで作ったものをWebサーバーで

 メモ。自己完結型HTMLというのが吐き出せる。自前のサーバーでも使える。

 JavaScript部分は難読化したい。Geminiに聞いてみた。以下がGeminiの答え。途中までやって手詰まり。あとで考える。とりあえず記録。

自己完結型HTMLへの適用方法

Canvasで生成された自己完結型HTMLファイルの場合、JavaScriptコードは通常 <script> タグ内に直接記述されているか、外部ファイルとして参照されています。

  1. インラインJavaScriptの場合:
    • HTMLファイルから <script> タグ内のJavaScriptコードをコピーします。terserJavaScript Obfuscator などのツールにそのコードを入力し、難読化された出力を得ます。難読化されたコードを元の <script> タグ内に貼り付け直します。
    例 (terser CLIを使用する場合): まずterserをインストールします。
    npm install -g terser
    次に、JavaScriptコードをファイルに保存し、難読化します。
    # original.js に難読化したいJavaScriptコードを保存
    terser original.js -o obfuscated.js -c -m
    ```obfuscated.js` の内容をHTMLファイルにコピー&ペーストします。
  2. 外部JavaScriptファイルの場合:
    • 参照されている .js ファイルを難読化ツールに入力します。
    • 難読化されたコードで元の .js ファイルを上書きするか、新しいファイル名で保存し、HTMLファイルの <script src="..."> を更新します。

注意点

  • デバッグの困難さ: 難読化されたコードはデバッグが非常に困難になります。開発中は難読化されていないコードを使用し、本番環境にデプロイする直前に難読化を行うのが一般的です。
  • パフォーマンスへの影響: 難読化の度合いによっては、コードの実行速度がわずかに低下する可能性があります。
  • 完璧な保護は不可能: クライアントサイドのコードは常にユーザーのブラウザで実行されるため、どんなに難読化しても、熟練したリバースエンジニアであれば解析は可能です。難読化はあくまで「障壁」であり、完全な「セキュリティ」ではありません。
  • ライセンスと互換性: 使用する難読化ツールのライセンスを確認し、プロジェクトのライセンスと互換性があることを確認してください。

これらの情報を参考に、ご自身の要件に合った難読化ツールと方法を選択してください。

コメント

タイトルとURLをコピーしました