ビューソースからJavaScriptコードを非表示にする方法

Sep 10, 2025
操作方法
How to hide your JavaScript code

JavaScriptコードで注意を払っていない場合は、それを複製したい人にとって、人生を簡単にしています。しかし、プログラミングプロセスが複数のクリック距離を超えている場合、攻撃者は競合他社のソフトウェアを複製することを好みます。 AWSまたはAzureの資格情報のためのインターネットをとるボットやその他の不正確さは通常難読化コードでは気にしません - 次のウェブサイトのログイン情報はビットコインを採掘するために使用することができ、より少ない労力で収穫することができます。

難読化JavaScriptは複雑であるために使用されます。しかし、このプロセスはここ数年の間に著しく簡単になりました。今日、中小企業でさえも、目的の目から彼らのコードを保護することができます。場合によっては、安全になることはNode.jsパッケージの呼び出しだけです。

次の手順では、一般的に使用されるJavaScript Obfuscatorを紹介し、その問題に関連する他のいくつかのトピックを調べます。

  • 最高のウイルス対策ソフトウェア
  • 15のEnsedal JavaScriptツール

01.バージョンチェック

JavaScript obfuscatorはノードランタイム環境に住んでいます。使用されているバージョンを確認することから、起動しましょう。以下の出力は、以下のステップで使用されている本当に使用されるワークステーションで見つかったバージョンの状態を提供します。 

 Tamhan @ Tamhan-ThinkPad：〜$ node --version
v8.12.0
Tamhan @ Tamhan-ThinkPad：$ NPM  -  Version
6.4.1

02.プログラムをインストールします

JavaScript-obfuscatorは、ワークステーションのグローバルアセンブリキャッシュにインストールする必要があります。でNPMを起動します - パラメータでスーパーユーザー権利を提供することを忘れないでください - 実際の展開プロセスは数秒で行われるべきです。 

 Tamhan @ Tamhan-ThinkPad：〜$ sudo npm install -g
JavaScript-obfuscator.
[sudo] Tamhanのパスワード：
。 。 。

+ javascript-obfuscator @ 0.18.1
162の寄稿者から103パッケージを追加しました
4.4歳で

03.サンプルを作成します

難読化をテストすると、「本当」のコードがある場合は最適です。そのため、小さなHTML Webページで始めましょう。それはworker.jsというJavaScriptファイルをロードし、ボタンを宣言し、小さなインラインスクリプトを含みます。ブラウザにロードされているときは、ボタンをクリックしてテキストボックスを表示します。 

＆lt; html＆gt。
＆lt; body＆gt;
＆lt; script src = "worker.js"＆gt;＆script＆gt;
＆lt;スクリプト＆gt;
関数worker（）{
警告（Dothetrick（））。
}
＆lt;＆script＆gt。
＆lt;ボタンタイプ= "ボタン" onclick = "ワーカー（
）」「＆gt;私をクリック！＆lt; / button＆gt;
＆lt; / body＆gt;
＆lt; / html＆gt;

04.コードを追加してください

Worker.jsは文字列変数で起動します。それらは古典的な攻撃対象です - ROMをデコードする場合、アセンブラは通常、文字列シーケンスを含むテーブルを探すことによって起動します。さらに、暗号化は、非常に「話す」という名前の変数のセットを使用して実行されます。 

 varsystring = "将来のPLCからこんにちは"

関数dothetrick（）{
var chiffrat;
Chiffrat = ROT13（MYSTRING）。
戻るChiffrat。

05.暗号化を実装します

これは暗号化101として意図されていないので、比較的単純な代替暗号を解決する必要がある。 ROT13は難しくありませんが、それは非常に冗談を言うことができます。 DSOARESの実装 「話す」変数のセットが付属しており、私たちの難読会器のためにたくさんの食べ物を提供しています。 

関数ROT13（str）{
var re =新しい正規表現（ "[a-z]"、 "i"）;
var min = 'a'.ccharcodeat（0）;
var max = 'z'.charcodeat（0）;
var factor = 13;
var result = "";
str = str.touppercase（）;
  
（var i = 0; i

06.最初の難読化

コードの難読化を実行することは単純です。 inv JavaScript-obfuscator. そして、現在の作業ディレクトリにあるすべてのファイルで機能するようにプログラムにドットを渡します。これは、著者のIBMワークステーションの結果を示しています。 

 Tamhan @ Tamhan-ThinkPad：〜/ futureobuscate /
コード$ javascript-obfuscator

07.出力をリダイレクトします

ファイルをコンテナフォルダに直接Figeing Figing Fixingは非効率的です。名前を使用する前に名前を変更する必要があります。より良い方法での使用を含みます 出力 パラメータ。もしの場合 JavaScript-obfuscator. それを見つけると、プログラムは現在の作業ディレクトリにサブフォルダを生成し、そこでそのラバの結果をダンプします。 

 Tamhan @ Tamhan-ThinkPad：〜/ FutureoBuscate / Code $
JavaScript-obfuscator --output ./OBFUSCA

08.結果を分析します

How to hide your JavaScript code: Results

それは恐ろしいですが、それは悪くなるかもしれません

「Obfusca」フォルダに飛び込んで、このステップに付随する廃棄にあなたの目をごちそうに最新バージョンのworker.jsを開きます。コードのフォーマットはひどく乱づされました。ただし、外部呼び出しに必要なので、メソッド名は同じままでした。さらに、文字列は攻撃者がそれらを便利に収穫できるアレイに座っています。 

 var a0_0xb9e2 = ['こんにちは\ x20from \ x20future
\ x20plc '、' [a-z] '、' test '、' charcodeat ']。

09.文字列の収穫を防ぐ

JavaScript-obfuscatorには、String-Manglingアルゴリズムの選択が付属しています。 - ストリングアレイエンコーディング 。忘却を忘れないように、出力ファイルの難読化を忘れないようにするため、出力ディレクトリを各呼び出しの前に空にする必要があります。 

 Tamhan @ Tamhan-ThinkPad：〜/ FutureoBuscate / Code $
JavaScript-obfuscator -  output ./OBFUSCA
 - ストリングアレイエンコーディングbase64

10.結果をもう一度見てください

この時点で、Obfuscatorの出力は異なります - ファイルの上部の配列は読みやすいです。しかし、これはすべての問題を解決しません。いくつかの難読化サイクルを実行すると、最終的にこのステップに付随するものと同様のマークアップになります。 

 VAR A0_0X31E5 = ['BGVUZ3RO'、 'DGVZDA =='、 '
znjvbunoyxjdb2rl '、' y2hcknvzgvbda == '、'
DG9VCHBLCKNHC2U = ']。
。 。 。
。 。 。
varsystring = 'hello \ x20from \ x20future \ x20plc'

ランダム化を理解する

Obfuscatorsは、高性能とコード保護の間の圧力場で機能します。問題に対処する1つの方法は、「ランダム化」要素を含みます。ランタイム高価な難読化はすべてのノードに追加されませんが、サブセットにのみ追加されます。ノードが影響を受けるかどうかを検出するかどうか、通常は乱数発生器を介して行われます。その感度を調整できます。

12.文字列の後に行きます

上記乱数発生器は、ゼロから1までの数字を出射する。数がしきい値より大きい場合、変更は行われません。設定 StringArraythreshold. 1つの値には、すべての数値がしきい値より小さいことを意味し、各文字列がマングルされるようにします。 

 Tamhan @ Tamhan-ThinkPad：〜/ FutureoBuscate / Code $
JavaScript-obfuscator -  output ./OBFUSCA
 - ストリングアレイエンコーディングBase64
 -  StringArraythreshold 1

13.ランダムコードを注入します

JSNICEの利益などの分析ツールが小さいコードベースを持つこと。 JavaScript-obfuscatorがとにかくコードをASTに分割することを考えると、その場で「ゴミコード」を挿入することに対して何も話しません。この機能が重要な肥大を追加すると、開発者は次の横に表示されている2つのパラメータを介して手動でそれをアクティブにする必要があります。

【44】 - 拡大符号注入<登録商標） - 拡大符号噴射しきい値<数値＆gt;

14.カオスを楽しむ

両方のobfuscatorを実行しています - 拡張コード注入TRIM. そして - 拡大符号 - 射出閾値1 セットは約2.5KBのファイルサイズにリードします。コードを無くことを試みることは、ほとんどのTeutrosological JavaScriptのほとんど新しい壁につながります。

15.プログラムフローを積極的に変更します

ASTにコードを破ることは、深い変換を可能にします。の設定を設定します ControlFlowFlattening TRUEの属性は、機能呼び出しを除去できることをプログラムに指示します。これにより、生成されたコードの拡張が大幅に拡大されます。結果は150％のパフォーマンスのヒットを受けることができます。

16.デバッガを悩ませます

デバッグからのアーティファクトは、ハッカーへの世界最大の贈り物です。 console.log（）とその友人への数が多くの呼び出しが、プログラムの内部に何が起こるかについての攻撃者の貴重な情報を与えることができます - 良い例が示されているスニペットになるでしょう： 

関数dothetrick（）
{
var chiffrat;
console.log（ "暗号化の準備
chiffrat」）;
Chiffrat = ROT13（MYSTRING）。
console.log（ "Chiffrat"を返す）;
戻るChiffrat。

技術的な問題を評価する

以下のコマンドでプログラムを再難読化しようとすることができます。文字列キャッシング機能を無効にし、リダイレクトを介してコンソールロギングを無効にする必要があります。 

 Tamhan @ Tamhan-ThinkPad：〜/デスクトップ/
デッドスティッフ/ 2018nov / FutureoBuscate / Code $
JavaScript-obfuscator -  output ./OBFUSCA
 - ストリングアレイエンコーディングFALSE
--disableConsoleOutput true

18.猫とマウスのゲームをプレイします

obfuscatorおよびブラウザのベンダーは、デバッガ機能について長くそして苦い戦いを戦います。これにより、このステップに付随するプログラムフローの中断のコンソールのリダイレクトなど、「積極的な」メジャーが通常、長い間働きません。 

 DebugProtection：false、
DebugProtectionInterval：false

19.迅速なオンライン難読化

1つまたは2つのファイルを難読化するためのnode.jsパッケージ全体のインストールは無意味です。訪問 obfuscator.io. ブラウザに住んでいるプログラムのオンライン版にアクセスするには。メイン入力の下のチェックとコンボボックスを使用すると、上記の手順で概説したプログラムの動作を変更できます。

20.詳細を学びます

How to hide your JavaScript code: Learn more

クリックすると、必要なすべてのパラメータが表示されます

開発者チームは、さまざまなコマンドラインパラメータが互いに対話する方法を説明する比較的詳細な文書を維持しています。単に訪問してください ここに頭 上記の「短いヘルプ」出力があなたの目標を達成するのに役立ちません。

21.難読力の致命的な敵

How to hide your JavaScript code: JS Nice

JS Niceはあなたのコードを読めないようにする簡単な方法です

ETHチューリッヒは、でホストされている除肥度サービスを提供しています。 jsnice.org. 。それは、既存のコードで構成されたニューラルネットワークと知識データベースを使用して変数名を決定します。フォーマットを停電しながら、通常はかなりよく機能します。 PixelSizeTargetMax このステップに付随する暗号化ルーチンでは、かなり面白いとすることができます。 

関数ROT13（PL $ 120）{
/ ** @type {！regexp} * /
VAR INSUFFIURTREGEXP =新しい正規表現
（A0_0X395D（ "0x1"）、 "i"）; var
PIXELSIZETARGETMAX = "A" ["CHARCODEAT"（0）;
VAR ZEROSIZEMAX = "z" ["charcodeat"]（0）;
/ ** @type {number} * /
var minh = 13;
/ ** @type {string} * /
ar out = "";

Generate, the award winning conference for web designers, returns to NYC on April 24-25! To book tickets visit www.generateconf.com&nbsp;

Webデザイナーの受賞歴のある会議は、4月24日から25日にNYCに戻ります。チケットを予約する www.generateconf.com

この記事はもともとCreative Web Design Magazineの第283号に掲載されました ウェブデザイナー 。 ここで問題283を購入してください または ここでWeb Designerを購読してください 。

関連記事：

  • 最高のJavaScriptフレームワークの9
  • 明らかにされた：最新のJavaScriptトレンド
  • 5素晴らしいJavaScript API

操作方法 - 最も人気のある記事

鳥を描く方法

操作方法 Sep 10, 2025

鳥を描く方法を学ぶことは素晴らしい娯楽になることができます。あなたがあなたの描画スキルを磨くこと、また�..

WordPressをビジュアルビルダーに変える方法

操作方法 Sep 10, 2025

（イメージクレジット：エレメンター/ジョセフフォード） ビジュアルビルダーはWordPre..

トリッキーなデザインの簡潔な簡単なことを解決する方法

操作方法 Sep 10, 2025

[画像：ジャックレンウィックスタジオ] 誰かがトリッキーな短い概要をどのように処理..

Zbrushのエイリアン海賊クリーチャーをモデル化する

操作方法 Sep 10, 2025

3Dエイリアンの海賊キャラクターを作成する方法を学ぶのを助けるために、私は私が私のクリー�..

VRの文字を彫刻する方法

操作方法 Sep 10, 2025

ページ1/2： ページ1 ページ1 2�..

リアルフローで注ぐ水効果を作成する

操作方法 Sep 10, 2025

このチュートリアルは、液体注入効果をシミュレートする方法を説明します。液体効果を作成す..

C4Dで低ポリ壁紙を作成する

操作方法 Sep 10, 2025

ページ1/2： C4Dで低ポリ壁紙を作成します。ステップ01-06 ..

あなたの芸術の品質デジタルコピーを作成する

操作方法 Sep 10, 2025

芸術は作成するだけではありません、それは共有についてもあります。あなたが誇りに思っている美しい仕事をしたら、他の人にも会うこと�..

カテゴリ