Webページをデスクトップアプリ化するソフト「nativefier」の紹介です。
「頻繁に利用するWebサービスをデスクトップ・アプリとして使いたい」
そのようなことを考えたことがありませんか？
例えば、Webサイトを運用している人なら"Googleアナリティクス"。仕事で利用する管理システム。その他にもブラウザゲーム等々。
Google Chromeにはプラグインの他に"Chrome App"というクローム内でアプリケーションを実行する機能が備わっていますが、使いたいアプリがGoogle ウェブストア内に公開されていない場合は、自分で実装する必要があります。
そんなChrome Appと同等のことをコマンド一発で作成できるソフトウェアが「nativefire」です。
nativefireを使えば、自分の好きなWebサービス・サイトをデスクトップアプリ化できます！
(クロスプラットフォーム上で動くので、Windows, Mac, Linuxで動作します )
nativefirはnode.jsで作られたパッケージなので、事前にnode.jsがインストールされている必要があります。
( node.jsの公式ページから入手できます *node.js v4以上で動作するのでお使いのバージョンを確認してください )
node.jsが導入されていたら、コマンドライン(Windowsであれば"コマンドプロンプト")からnpmコマンドを使ってnativefireをインストールします。
# nativefireのインストール * 環境によっては sudo が必要かもしれません
npm install nativefier -g
# 正しくインストールされているとnativefireコマンドが使えるようになります
$ nativefier
Usage: nativefier [options] targetUrl [dest]
...
nativefireの使い方は、コマンドプロンプトライン上からnativefire [url] [option]という形で簡単にWebページをアプリに変換・作成できます。
一例として、このサイトをデスクトップアプリ化する場合は下の様に。
# コンソール上のカレントディレクトリにアプリがビルドされます
# webページのタイトル名がアプリ名になりますが'name'オプションを付ければ自由にアプリ目を変更できます
nativefier http://co.bsnws.net/ --name cupOF
# コマンド実行時には下の様なメッセージが流れます * Mac環境でテストしました
Packaging app for platform darwin x64 using electron v1.1.3
App built to /Users/yourName/cupOF-darwin-x64
ビルドが終了すると、アプリ名-プラットフォームという形でフォルダが作成され、その中に実行ファイルが格納されます。
( windowsであれば '.exe'ファイルで実行されます )
nativefireには沢山のオプションが用意されており、ビルド時に様々な指定ができます。
nativefireはelectron(node.jsでGUIアプリを作るライブラリ)のラッパーなので electronのバージョンをバージョンを指定したり、flashを有効化したり(デフォルトでは無効)、違うOS用にビルドすることも出来ます。
* 用意されている、よく使いそうなオプション一覧
| オプション | 説明 | 注釈 |
|---|---|---|
| -n OR --name [value] | アプリケーション名の指定 | |
| -p OR --platform [value] | OSの指定 | デフォルトでは自動で指定されますが、使っているOSから違うOS用のアプリにビルドすることができます (例: Mac -> Windows用) |
| -e, --electron-version [value] | ビルド時に使用するElectronのバージョンを指定 | |
| --no-overwrite | ビルドするディレクトリの指定 | このオプションがあるとディレクトリ上にアプリが存在する場合は上書きされません |
| --width [value] | アプリ起動時の横幅のサイズ | デフォルト: 1280px |
| --height [value] | アプリ起動時の縦幅のサイズ | デフォルト: 800px |
| --min-width [value] | アプリ実行時の横幅の最小値 | |
| --min-height [value] | アプリ実行時の縦幅の最小値 | |
| --max-width [value] | アプリ実行時の横幅の最大値 | |
| --max-height [value] | アプリ実行時の縦幅の最大値 | |
| -m, --show-menu-bar | メニューバーの表示 | |
| -f, --fast-quit | アプリ終了時に完全終了するオプション | * このオプションはMac専用です |
| -u, --user-agent [value] | ユーザーエージェント名のセット | |
| --honest | ユーザーエージェント名を上書きしないオプション | このオプションがあるとユーザーエージェントの値が上書きされません |
| --ignore-certificate | 証明書エラーを無視 | このオプションがあるとcertificationエラーが回避されます |
| --honest | ユーザーエージェント名を上書きしないオプション | このオプションがあるとユーザーエージェントの値が上書きされません |
| --insecure | セキュリティーエラーの非表示 | このオプションがあるとセキュリティーエラーが表示されなくなります *http -> httpsが混ざっているサイトなど |
| --flash | flashの有効化 | このオプションがあるとflashが有効化されます *デフォルトでは無効 |
| --inject | ビルド時にjsやCSSのカスタムスクリプトを追加 | 例: $ nativefier http://google.com --inject ./some-js-injection.js --inject ./some-css-injection.css ~/Desktop |
| --full-screen | フルスクリーンで起動 | アプリ実行時にフルスクリーンで起動します |
| --maximize | マックスサイズで起動 | |
| --hide-window-frame | フレームの無効 | |
| --disable-context-menu | メニューの無効 | メニューが表示されなくなります |
| --disable-dev-tools | dev-toolの無効 | chromeに搭載されているdeb-toolsを表示させないように出来ます |
上記のオプションを利用して、実際に使用する場合は下記のようになります
# flashゲームをアプリ化する例
# ドラゴンクエストのモンスターパレードをビルドしました
nativefier http://www.dqmp.jp/ -n dqmp --flash
# googleアナリティクスをアプリ化する例
nativefier https://analytics.google.com/analytics/web/ -n GoogleAnalytics --honest
# macからwindows用のアプリをビルドする例
# wineがインストールされいる必要があります
nativefier http://co.bsnws.net/ --name cupOF -p windows
# electronのバージョンを指定する場合
# 執筆時の最新バージョンを指定してビルドしました *オプション無しでは1.1.3でビルド
nativefier http://co.bsnws.net/ --name cupOF -e 1.4.3
以上がnativifireの紹介でした。
nativefireを使ってモンパレや戦艦コレクション等のブラウザゲームを独立したデスクトップアプリ化したり、ITベンダーの人は Web管理システムの納品時にアプリ化すればでブラウザのバージョンも含めて統一してもらう事もできますね！
趣味 ~ 仕事まで幅広く使えそうなアプリなので、気になった人はゼヒ×２チェックしてください！
GitHub: jiahaog/nativefier
