開発者必見！React Nativeアプリ難読化の重要性とは？

１．React Nativeはリバースエンジニアリングのリスクは？

Webの技術を活用してスマホアプリを開発できることから、React Nativeは開発者たちにとって非常に人気のあるフレームワークとなっています。.NETアプリやAndroidアプリがリバースエンジニアリングされやすいという事実はよく知られていますが、React Nativeアプリはどうでしょうか？実際のところ、他の開発フレームワーク同様、React Nativeアプリもまた、リバースエンジニアリングや改ざんをされやすい状態にあります。

このような背景を考慮すると、アプリを公開する前に、企業の知的財産（IP）とデータを守ることが非常に重要です。React Nativeを利用することで迅速にアプリを開発し市場に投入することが可能ですが、その便利さの裏で、セキュリティ面での潜在的なリスクも理解しておく必要があります。

２．React Nativeをリバースエンジニアリングしてみた

React Nativeアプリは、主にJavaScriptで記述され、APK、AAB、またはIPAファイルとしてパッケージ化されて配布されます。アプリがデバイスにインストールされると、エンドユーザーはAPKを抽出し、”assets”ディレクトリ内にバンドルされたJavaScriptファイルを確認することができます。以下のコンソール出力からもわかるように、ファイルを解凍する過程でindex.android.bundleというファイルが見つかります。これは、React Nativeでビルドされたアプリの核心部分です。

ビルドプロセスにおいて、コードのバンドルは最小化され、一見すると解析が難しいように見えます。

しかし、Nodepad++のJSToolなどのテキストエディタを使用することで、簡単にコードを元の形式に戻し、整形することが可能です。

このプロセスを行うと、API呼び出し、鍵、そして「this is a secret string!」のような機密性の高い情報が露呈する恐れがあります。これは、重大なセキュリティリスクを意味します。悪意のあるユーザーによってアプリが複製され、バックエンドシステムに侵入され、データ侵害やその他の攻撃が引き起こされる可能性があるのです。

しかし幸いにも、PreEmptiveが提供するツールを利用すれば、これらの脅威からアプリを保護できます。JavaScriptバンドルを保護するために特化されたJSDefenderなどのツールは、アプリのセキュリティを大幅に向上させることができます。

３．ReactNativeの難読化方法

JSDefenderの導入は非常に簡単で、metro.config.jsにプラグインを追加するだけです。

const jsdefenderMetroPlugin = require("@preemptive/jsdefender-metro-plugin")(
  {
    configurationFile: "jsdefender.config.json", 
    quietMode: false, 
    protectUserModulesOnly: false, 
    enableInDevelopmentMode: false,     
  },
  // --メトロ構成
  {
    resolver: {
    },
    transformer: {
    },
    serializer: {
    },
    server: {
    }
  }
)
module.exports = jsdefenderMetroPlugin;

JSDefenderはビルドプロセスに密接に統合され、アプリケーションコードを自動的に難読化します。これにより、リバースエンジニアリングや不正な改変からアプリを守ります。

npx react-native run-android

ビルド出力で、PreEmptiveが実行されているのを確認できます。

PreEmptive Protection JSDefender(TM)
Copyright 2019-2024 PreEmptive Solutions, LLC. All Rights Reserved
Use of this software constitutes acceptance of the accompanying license agreement.
Info: JSDefender version 2.6.0
Info: Licensed to: xxxxxx@agtech.co.jp
Floating Build License: ############################497C
This software may be used on binaries for general release.Concurrent Build Limit: 3
Warning: http://www.preemptive.com/dotfuscator/index.html
Info: Source tree building in progress...
Info: Source tree successfully built.
Info: Total length: 361
Info: #of scripts: 1
Info: #of syntax nodes: 59
Info: Highest ES version: ES5
Info: DevTools blocking transformation applied.
Info: Lexical tree building in progress...
Info: Lexical tree successfully built.
Info: global object hiding transformation applied.
Info: String literal transformation applied.
Info: Number of string literals extracted: 7
Info: Rendering protected files...
Info: Protected files rendered successfully.
Info: Rendering lexical scope maps...
Info: Lexical scope maps successfully rendered.
Execution time: 1s 987ms
npm notice 
npm notice New major version of npm available! 8.15.0 -> 10.5.0
npm notice Changelog: https://github.com/npm/cli/releases/tag/v10.5.0
npm notice Run npm install -g npm@10.5.0 to update!
npm notice

このビルド後、バイナリは逆コンパイル、リバースエンジニアリング、および改ざんに対して強化されます。
一部抜粋しますが、ロジックの解析や文字列検索が一目で不可能になります。

４．まとめ

React Nativeで開発されたアプリは、その便利さと効率の良さから多くの企業に採用されていますが、セキュリティ面での懸念も伴います。リバースエンジニアリングや改ざんといった脅威からアプリを守るためには、難読化ツールの導入が不可欠です。JSDefenderをはじめとするPreEmptiveのツールは、このようなセキュリティ対策を実現するための強力な手段を提供します。アプリを市場に出す前に、適切な保護措置を講じることで、企業の財産とユーザーの信頼を守ることができます。

ぜひ、JSDefenderの評価版を試して、React Nativeアプリの保護レベルを実際に体験してみてください。

５．評価版のお申し込みについて

評価版のご利用を希望されるお客様は、以下のURLよりお申し込みください。
https://www.agtech.co.jp/preemptive/jsdefender/trial/