1

I am having issues deploying my Ionic app to Android specifically my Arcgis embedded map. I get the error "net::ERR_CLEARTEXT_NOT_PERMITTED"

After researching I found this can be caused because the address is an HTTP::// and not an HTTPS::// but even after following other peoples solutions for changing the AndroidManifest

android:usesCleartextTraffic="true"

I am still getting the same error. Because this is an embedded link I cannot change it to https::// I even attempted to remove the

android:networkSecurityConfig="@xml/network_security_config"

But still receiving the same error. The map works perfectly when run from the browser but once deployed to android it breaks. Ill link files below

HTML File

<ion-header>
  <ion-toolbar>
    <ion-buttons slot="start">
      <ion-back-button></ion-back-button>
    </ion-buttons>

  </ion-toolbar>
</ion-header>

<ion-content>

  <div class="embed-container">
  <iframe width="500" height="400" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" title="ShipWrecks"
  src="//stubbsie.maps.arcgis.com/apps/Embed/index.html?webmap=054a9d0eb0984141be2863a8c3abb705&extent=-9.5902,51.2352,-5.5335,52.6355&home=true&zoom=true&previewImage=true&scale=true&search=true&searchextent=true&details=true&legend=true&active_panel=legend&basemap_gallery=true&disable_scroll=true&theme=dark"></iframe>
  </div>
</ion-content>



AndroidManifest.xml

<?xml version='1.0' encoding='utf-8'?>
<manifest android:hardwareAccelerated="true" 
android:targetSandboxVersion="1" 
android:versionCode="1" 
android:versionName="0.0.1" 
package="io.ionic.starter" xmlns:android="http://schemas.android.com/apk/res/android">

    <supports-screens 
    android:anyDensity="true" 
    android:largeScreens="true" 
    android:normalScreens="true" 
    android:resizeable="true" 
    android:smallScreens="true" 
    android:xlargeScreens="true" />

    <uses-permission android:name="android.permission.INTERNET" />

    <application 
    android:hardwareAccelerated="true" 
    android:icon="@mipmap/ic_launcher" 
    android:label="@string/app_name" 
    android:networkSecurityConfig="@xml/network_security_config" 
    android:supportsRtl="true" 
    android:usesCleartextTraffic="true">


        <activity android:configChanges="orientation|keyboardHidden|keyboard|screenSize|locale|smallestScreenSize|screenLayout|uiMode" android:label="@string/activity_name" android:launchMode="singleTop" android:name="MainActivity" android:theme="@android:style/Theme.DeviceDefault.NoActionBar" android:windowSoftInputMode="adjustResize">

            <intent-filter android:label="@string/launcher_name">
                <action android:name="android.intent.action.MAIN" />
                <category android:name="android.intent.category.LAUNCHER" />
            </intent-filter>
        </activity>

    </application>
    <uses-permission android:name="android.permission.ACCESS_COARSE_LOCATION" />
    <uses-permission android:name="android.permission.ACCESS_FINE_LOCATION" />
    <uses-feature android:name="android.hardware.location.gps" />
</manifest>

Config.xml Here I attempted to add in the line android:usesCleartextTraffic="true" to the application and did not work.

<?xml version='1.0' encoding='utf-8'?>
<widget id="io.ionic.starter" version="0.0.1" xmlns="http://www.w3.org/ns/widgets" xmlns:cdv="http://cordova.apache.org/ns/1.0">
    <name>MyApp</name>
    <description>An awesome Ionic/Cordova app.</description>
    <author email="[email protected]" href="http://ionicframework.com/">Ionic Framework Team</author>
    <content src="index.html" />
    <access origin="*" />
    <allow-intent href="http://*/*" />
    <allow-intent href="https://*/*" />
    <allow-intent href="tel:*" />
    <allow-intent href="sms:*" />
    <allow-intent href="mailto:*" />
    <allow-intent href="geo:*" />
    <preference name="ScrollEnabled" value="false" />
    <preference name="android-minSdkVersion" value="19" />
    <preference name="BackupWebStorage" value="none" />
    <preference name="SplashMaintainAspectRatio" value="true" />
    <preference name="FadeSplashScreenDuration" value="300" />
    <preference name="SplashShowOnlyFirstTime" value="false" />
    <preference name="SplashScreen" value="screen" />
    <preference name="SplashScreenDelay" value="3000" />
    <platform name="android">
        <edit-config file="app/src/main/AndroidManifest.xml" mode="merge" target="/manifest/application" xmlns:android="http://schemas.android.com/apk/res/android">
            <application android:networkSecurityConfig="@xml/network_security_config" />
        </edit-config>
        <edit-config file="*-Info.plist" mode="merge" target="NSLocationWhenInUseUsageDescription">
            <string>We use your location for full functionality of certain app features.</string>
        </edit-config>
        <resource-file src="resources/android/xml/network_security_config.xml" target="app/src/main/res/xml/network_security_config.xml" />
        <allow-intent href="market:*" />
        <icon density="ldpi" src="resources/android/icon/drawable-ldpi-icon.png" />
        <icon density="mdpi" src="resources/android/icon/drawable-mdpi-icon.png" />
        <icon density="hdpi" src="resources/android/icon/drawable-hdpi-icon.png" />
        <icon density="xhdpi" src="resources/android/icon/drawable-xhdpi-icon.png" />
        <icon density="xxhdpi" src="resources/android/icon/drawable-xxhdpi-icon.png" />
        <icon density="xxxhdpi" src="resources/android/icon/drawable-xxxhdpi-icon.png" />
        <splash density="land-ldpi" src="resources/android/splash/drawable-land-ldpi-screen.png" />
        <splash density="land-mdpi" src="resources/android/splash/drawable-land-mdpi-screen.png" />
        <splash density="land-hdpi" src="resources/android/splash/drawable-land-hdpi-screen.png" />
        <splash density="land-xhdpi" src="resources/android/splash/drawable-land-xhdpi-screen.png" />
        <splash density="land-xxhdpi" src="resources/android/splash/drawable-land-xxhdpi-screen.png" />
        <splash density="land-xxxhdpi" src="resources/android/splash/drawable-land-xxxhdpi-screen.png" />
        <splash density="port-ldpi" src="resources/android/splash/drawable-port-ldpi-screen.png" />
        <splash density="port-mdpi" src="resources/android/splash/drawable-port-mdpi-screen.png" />
        <splash density="port-hdpi" src="resources/android/splash/drawable-port-hdpi-screen.png" />
        <splash density="port-xhdpi" src="resources/android/splash/drawable-port-xhdpi-screen.png" />
        <splash density="port-xxhdpi" src="resources/android/splash/drawable-port-xxhdpi-screen.png" />
        <splash density="port-xxxhdpi" src="resources/android/splash/drawable-port-xxxhdpi-screen.png" />
    </platform>
    <platform name="ios">
        <allow-intent href="itms:*" />
        <allow-intent href="itms-apps:*" />
        <icon height="57" src="resources/ios/icon/icon.png" width="57" />
        <icon height="114" src="resources/ios/icon/[email protected]" width="114" />
        <icon height="29" src="resources/ios/icon/icon-small.png" width="29" />
        <icon height="58" src="resources/ios/icon/[email protected]" width="58" />
        <icon height="87" src="resources/ios/icon/[email protected]" width="87" />
        <icon height="20" src="resources/ios/icon/icon-20.png" width="20" />
        <icon height="40" src="resources/ios/icon/[email protected]" width="40" />
        <icon height="60" src="resources/ios/icon/[email protected]" width="60" />
        <icon height="48" src="resources/ios/icon/[email protected]" width="48" />
        <icon height="55" src="resources/ios/icon/[email protected]" width="55" />
        <icon height="29" src="resources/ios/icon/icon-29.png" width="29" />
        <icon height="58" src="resources/ios/icon/[email protected]" width="58" />
        <icon height="87" src="resources/ios/icon/[email protected]" width="87" />
        <icon height="40" src="resources/ios/icon/icon-40.png" width="40" />
        <icon height="80" src="resources/ios/icon/[email protected]" width="80" />
        <icon height="120" src="resources/ios/icon/[email protected]" width="120" />
        <icon height="88" src="resources/ios/icon/[email protected]" width="88" />
        <icon height="50" src="resources/ios/icon/icon-50.png" width="50" />
        <icon height="100" src="resources/ios/icon/[email protected]" width="100" />
        <icon height="60" src="resources/ios/icon/icon-60.png" width="60" />
        <icon height="120" src="resources/ios/icon/[email protected]" width="120" />
        <icon height="180" src="resources/ios/icon/[email protected]" width="180" />
        <icon height="72" src="resources/ios/icon/icon-72.png" width="72" />
        <icon height="144" src="resources/ios/icon/[email protected]" width="144" />
        <icon height="76" src="resources/ios/icon/icon-76.png" width="76" />
        <icon height="152" src="resources/ios/icon/[email protected]" width="152" />
        <icon height="167" src="resources/ios/icon/[email protected]" width="167" />
        <icon height="172" src="resources/ios/icon/[email protected]" width="172" />
        <icon height="196" src="resources/ios/icon/[email protected]" width="196" />
        <icon height="1024" src="resources/ios/icon/icon-1024.png" width="1024" />
        <splash height="480" src="resources/ios/splash/Default~iphone.png" width="320" />
        <splash height="960" src="resources/ios/splash/Default@2x~iphone.png" width="640" />
        <splash height="1024" src="resources/ios/splash/Default-Portrait~ipad.png" width="768" />
        <splash height="768" src="resources/ios/splash/Default-Landscape~ipad.png" width="1024" />
        <splash height="1125" src="resources/ios/splash/Default-Landscape-2436h.png" width="2436" />
        <splash height="1242" src="resources/ios/splash/Default-Landscape-736h.png" width="2208" />
        <splash height="2048" src="resources/ios/splash/Default-Portrait@2x~ipad.png" width="1536" />
        <splash height="1536" src="resources/ios/splash/Default-Landscape@2x~ipad.png" width="2048" />
        <splash height="2732" src="resources/ios/splash/Default-Portrait@~ipadpro.png" width="2048" />
        <splash height="2048" src="resources/ios/splash/Default-Landscape@~ipadpro.png" width="2732" />
        <splash height="1136" src="resources/ios/splash/Default-568h@2x~iphone.png" width="640" />
        <splash height="1334" src="resources/ios/splash/Default-667h.png" width="750" />
        <splash height="2208" src="resources/ios/splash/Default-736h.png" width="1242" />
        <splash height="2436" src="resources/ios/splash/Default-2436h.png" width="1125" />
        <splash height="2732" src="resources/ios/splash/Default@2x~universal~anyany.png" width="2732" />
    </platform>
    <plugin name="cordova-plugin-whitelist" spec="1.3.3" />
    <plugin name="cordova-plugin-statusbar" spec="2.4.2" />
    <plugin name="cordova-plugin-device" spec="2.0.2" />
    <plugin name="cordova-plugin-splashscreen" spec="5.0.2" />
    <plugin name="cordova-plugin-ionic-webview" spec="^4.0.0" />
    <plugin name="cordova-plugin-ionic-keyboard" spec="^2.0.5" />
</widget>

I am unsure where to go from here how to get it working. As this is an instrumental part of my app I really need this to run.

1
  • Did you add <application android:usesCleartextTraffic="true" /> to config.xml inside edit-config? Apr 11, 2020 at 15:33

5 Answers 5

0

I solved my issue by changing my Config.xml and updating it with this code.

<access origin="*" />
    <edit-config file="app/src/main/AndroidManifest.xml" mode="merge" target="/manifest/application">
        <application android:usesCleartextTraffic="true" />
    </edit-config>
    <allow-navigation href="*" />

And removing from both Config and my AndroidManifest.xml

android:networkSecurityConfig="@xml/network_security_config"
0

Add <application android:usesCleartextTraffic="true" /> to config.xml inside edit-config.

<platform name="android">
    <edit-config file="app/src/main/AndroidManifest.xml" mode="merge" target="/manifest/application" xmlns:android="http://schemas.android.com/apk/res/android">
          <application android:usesCleartextTraffic="true" />
          <application android:networkSecurityConfig="@xml/network_security_config" />
    </edit-config>
    ...
</platform>
0

This issue may be caused when passing plain data to an insecure URL. Before adding <application android:usesCleartextTraffic="true" /> to config.xml, check if you can make the request as https, not http.

0

This is because the clear text is not allowed.

But the solution is simple.

In the folder resorces/android/xml there is a file network_security_config.xml

Please add the local domain o insecurity domain or IP.

for instance:

<?xml version="1.0" encoding="utf-8"?>
<network-security-config>
    <domain-config cleartextTrafficPermitted="true">
        <domain includeSubdomains="true">localhost</domain>
        <domain includeSubdomains="true">192.168.0.7</domain>
        <domain includeSubdomains="true">192.168.0.12</domain>
        <domain includeSubdomains="true">10.10.1.112</domain>
    </domain-config>
</network-security-config>

Then, please, run again... Thats all.

1
0

Following the file path below you will arrive at three possible solutions to solve your problem

first add this in this path resources/android/xml/network_security_config.xml

<?xml version="1.0" encoding="utf-8"?>
<network-security-config>
     <base-config cleartextTrafficPermitted="true">
       <trust-anchors>
           <certificates src="system" />
       </trust-anchors>
   </base-config>
    <domain-config cleartextTrafficPermitted="true">
        <domain>localhost</domain>
        <domain includeSubdomains="true">YOUR DOMAIN/IP</domain>
    </domain-config>
</network-security-config>

Add this<application android:usesCleartextTraffic="true" /> on config.xml in platform android .

<platform name="android">       
    <edit-config file="app/src/main/AndroidManifest.xml" mode="merge" target="/manifest/application" xmlns:android="http://schemas.android.com/apk/res/android">
        <application android:usesCleartextTraffic="true" />
    </edit-config>     
  </platform>

Add this<application android:usesCleartextTraffic="true" /> in this path.
platforms/android/app/src/main/AndroidManifest.xml

<application android:usesCleartextTraffic="true">

Your Answer

Reminder: Answers generated by Artificial Intelligence tools are not allowed on Stack Overflow. Learn more

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.