どうも、@ryusei__46です。
昨今、世間でメジャーとなっているデスクトップアプリ開発フレームワークの「Electron」ですが、ソースコードのバイナリー化・秘匿化ができないため、モダンなアプリが開発できるとはいえ、Electronでのデスクトップアプリ開発を見送っている方も多いと思います。
しかし、Electronと同系列のフレームワークである「NW.js」を使えば、ソースコードをバイナリー化できます。
この記事では、その方法を簡単に備忘録としてまとめました。
開発環境
- OS：Windows 11 Pro
- node.js v 18.13
- npm v 6.19.1
- nw.js v 0.72.0
ソースコードのコンパイル（バイナリー化）
ソースコードのコンパイルには、「nwjc」という公式が提供するコンパイラーが必要になります。このコンパイラーnw.jsの開発版パッケージ（SDK版）をnpmでインストールしないと使えません。
npm install nw --nwjs_build_type=sdk -g上記のコマンドで、nw.jsのSDK版がグローバルにインストールされます。環境変数にパスを設定していない場合は、「npm root -g」コマンドで「node_module」フォルダーへのパスを確認し、追加してください。
「nwjc」コマンドを使って、JavaScriptファイルをコンパイルするには、
nwjc [コンパイルしたいファイルのパス] [コンパイル後のファイル名]コンパイル後のファイル拡張子は、「.bin」にしておくと無難かと思います。バイナリーファイルなので、ぶっちゃけ拡張子は何でも構いません。
コンパイル後のバイナリーファイルを読み込ませるには、
nw.Window.get().evalNWBin(null, 'コンパイルしたファイルのパス');というメソッドを使います。アプリの配布時には、htmlファイル内のscriptタグに書いてjsの処理を実行するようにします。
<!-- index.html -->
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>code test</title>
<script defer>
nw.Window.get().evalNWBin(null, 'main.bin');
</script>
</head>
<body>
<h2>Hello World.</h2>
</body>
</html>モジュールのコンパイル（バイナリー化）
開発規模が膨らんでくると、ファイルを分割してモジュールとして管理することが増えると思いますが、そういった場合にもモジュールとして読み込むソースファイルをコンパイルすることもできます。
前項で説明した、「.evalNWBin()」メソッドはモジュールの読み込みには対応していませんので使えません。コンパイルされたモジュールファイルをロードするためには、「nwjc」コマンドを実行する際に、「–nw-module」オプションをつけることで、ソースファイルをモジュールとしてコンパイルできます。
nwjc [コンパイルしたいファイルのパス] [コンパイル後のファイル名] --nw-moduleその後、コンパイルされたモジュールファイルを、
nw.Window.get().evalNWBinModule(null, 'モジュールファイル', 'モジュール名');
を使ってロードできます。第3引数の「モジュール名」というのは、任意の文字列を自分で指定できます。その指定したモジュール名でロードされるので、「require()」や「import」を使う際に、「./[指定したモジュール名]」で読み込むことができます。
// main.js ≡ main.bin
nw.Window.get().evalNWBinModule(null, 'module.bin', 'modulle');
const test_module = require('./module');
console.log(test_module.sum());// module.js ≡ module.bin
module.exports = {
number: 150,
sum: function() {
return this.number + 500;
}
}参考ページ
