Ionic CordovaのAndroidでlivereloadできない時
Ionic CordovaでアプリをAndroid向けに開発するときに、livereloadが動いていませんでした。本記事ではその解決方法を紹介します。
実行したのは次のコマンドです。
ionic cordova emulate android --livereload --externalエラー内容
エミュレータのAndroidの画面には次のようなエラーが表示されました。
Application Errornet::ERR_CLEARTEXT_NOT_PERMITTED (http://0.0.0.0:8100/)ちなみにiOSの方では問題なくlivereloadできていました。
これで検索するとよくcleartextTrafficPermittedやandroid:usesCleartextTraffic="true"についての話が出ますが、これだけでは足りませんでした。
解決
Ionic Forumの投稿を参考に解決しました。具体的な対応手順は次のとおりです。
プライベートIPアドレスを調べる
まずはプライベートIPアドレス（ローカルIPアドレス）を調べます。
ここらへんはOSによって違うので各自で調べてください。ifconfig、ipconfig、ipとかです。
xmlの編集
resources/android/xml/network_security_config.xmlに次のようにIPアドレスを書きます。
<?xml version="1.0" encoding="utf-8"?><network-security-config> <domain-config cleartextTrafficPermitted="true"> <domain includeSubdomains="true">my IP address</domain> // ... </domain-config></network-security-config>ホストを指定する
実行時にオプション--hostにIPアドレスを指定します。
ionic cordova emulate android --livereload --external --host=<my IP address>以上です。
あくまでもローカルでエミュレータを動かして確認する時の対応であるため、IPアドレスを書いたままnetwork_security_config.xmlをコミットしないようにしましょう。
筆者の環境
念の為、筆者の環境も書いておきます。古いです😣
ionic infoIonic:
Ionic CLI : 6.20.3 (/Users/eetann/.local/share/mise/installs/npm-ionic-cli/6.20.3/lib/node_modules/@ionic/cli) Ionic Framework : ionic-angular 3.9.10 @ionic/app-scripts : 3.2.4
Cordova:
Cordova CLI : 12.0.0 ([email protected]) Cordova Platforms : android 8.0.0, ios 5.0.1 Cordova Plugins : cordova-plugin-ionic-keyboard 2.1.3, cordova-plugin-ionic-webview 3.1.2, (and 15 other plugins)
Utility:
cordova-res : 0.15.4 native-run : 2.0.1
System:
Android SDK Tools : 26.1.1 (/Users/eetann/Library/Android/sdk) ios-sim : 8.0.2 NodeJS : v14.21.3 (/Users/eetann/.local/share/mise/installs/node/14.21.3/bin/node) npm : 6.14.18 OS : macOS Unknown Xcode : Xcode 16.0 Build version 16A242dlivereloadできない時の対応でした。最近アプリ開発を始めたばかりなのでXcodeやAndroid Studioとよく格闘しています。