以前、「【Android】WebViewでURLで指定された画像が表示されないときの対処法」という記事を書きましたが、全く同じ問題が Cordova でも発生していたのでその解決方法についてです。
ちなみに、発生していたエラーは「Failed to load resource: net::ERR_CLEARTEXT_NOT_PERMITTED」でした。
今回参考にさせていただいた記事はこちらです。
【Monaca】Android版をビルドしてAndroid 9 で実行すると「Failed to load resource: net::ERR_CLEARTEXT_NOT_PERMITTED」と表示される | Hato Poppo Project
http://hatopp.wpblog.jp/archives/2508
対処方法としては、AndroidManifest.xml
の <application>
タグに android:usesCleartextTraffic="true"
を追加するだけです。
サンプルコードは下記のとおりです。
<application ... android:usesCleartextTraffic="true"> ... </application>
ですが、Cordova の場合、プラットフォームを再インストールすると Android Studio 上で直接追記した箇所はすべて削除されてしまうので、都度追加しなおすのは若干面倒です。
そのため、上記の参考サイトにあるように、config.xml
に指定するようにします。
追加した箇所は、2行目と、12~14行目です。
<?xml version="1.0" encoding="UTF-8"?> <widget xmlns="http://www.w3.org/ns/widgets" id="com.example.helloworld" version="1.0.0" xmlns:android="http://schemas.android.com/apk/res/android"> <name>HelloWorld</name> <description>Made with Monaca (http://monaca.mobi)</description> <author/> <content src="index.html"/> <allow-navigation href="*"/> <allow-intent href="itms:*"/> <allow-intent href="itms-apps:*"/> <!-- 省略 --> <platform name="android"> <edit-config file="AndroidManifest.xml" target="/manifest/application" mode="merge"> <application android:usesCleartextTraffic="true" /> </edit-config> </platform> </widget>
具体的には、<widget>
タグに xmlns:android="http://schemas.android.com/apk/res/android"
を追加し、<platform name="android">
タグ内に下記を追加しています。
<edit-config file="AndroidManifest.xml" target="/manifest/application" mode="merge"> <application android:usesCleartextTraffic="true" /> </edit-config>
上記を追加して実行すると、AndroidManifest.xml
に android:usesCleartextTraffic="true"
を自動で追記してくれます。
意外とプラットフォームの削除・追加は行うので、こうやって Android Studio 上での変更を減らしておくと後々楽になるのでお勧めです。
以上、Cordova で開発したアプリを Android 9 で実行した際に画像が表示されない時の対処法でした。
ご参考になれば幸いです。