capacitor: Error response external api

You can set usesCleartextTraffic="true" only for debug build like this AndroidManifest.xml

...
    <application
        android:allowBackup="true"
        android:icon="@mipmap/ic_launcher"
        android:label="@string/app_name"
        android:roundIcon="@mipmap/ic_launcher_round"
        android:supportsRtl="true"
        android:theme="@style/AppTheme"
        android:usesCleartextTraffic="${usesCleartextTraffic}
        >
...

build.gradle

...
android {
    compileSdkVersion 28
    defaultConfig {
        applicationId "app.test"
        minSdkVersion 23
        targetSdkVersion 28
        versionCode 1
        versionName "1"
        testInstrumentationRunner "android.support.test.runner.AndroidJUnitRunner"
        manifestPlaceholders = [usesCleartextTraffic:false]
    }
    buildTypes {
        debug {
            applicationIdSuffix ".dev"
            versionNameSuffix "-dev"
            manifestPlaceholders = [usesCleartextTraffic:true]
        }
        release {
            minifyEnabled false
            proguardFiles getDefaultProguardFile('proguard-android.txt'), 'proguard-rules.pro'
        }
    }
}
...

Why don’t you just use http in development or use a good certificate even for development?

because by default the current android version blocks access to http. however as i now learned this can be disabled via android:usesCleartextTraffic="true", which i did now.

Got the problem! Chrome by default doesn’t allow mixed content (ie fetching HTTP from an HTTPS server), and Capacitor serves the app using HTTPS. There’s a configuration in capacitor.config.json that overrides this and allows mixed content fetching, just add this to the file and it’s gonna work:

{
    "android": {
        "allowMixedContent": true
    }
}

(well, at least that was MY problem, because my API is served with HTTP. If that’s the case for you, this is how you fix it.)

I have all cors enabled. My API is in laravel, i use the same post method on Ionic 3 with the same API and It works. This only have with capacitor, not when i compile the app in Cordova. Seems a capacitor problem…

El sáb., 27 oct. 2018 23:15, ydorea notifications@github.com escribió:

I’m having the same problem! It’s not a CORS issue because I’m trying to consume my REST APIs located in an EC2 instance at AWS, I enabled CORS in the Spring mappinng, but whenever I try to GET or POST anything I get:

{“headers”:{“normalizedNames”:{},“lazyUpdate”:null,“headers”:{}},“status”:0,“statusText”:“Unknown Error”,“url”:null,“ok”:false,“name”:“HttpErrorResponse”,“message”:“Http failure response for (unknown url): 0 Unknown Error”,“error”:{“isTrusted”:true}}

I wasn’t having this problem when I was using Ionic 3, but since I had to upgrade to Ionic 4 because of some Angular AoT compiling issue, All my Angular HttpClient requests return that…

My Spring CORS config: @Override public void addCorsMappings(CorsRegistry registry) { registry.addMapping(“/**”) .allowedMethods(“GET”, “POST”, “PUT”, “DELETE”) .allowedOrigins(““) .allowedHeaders(””); }

— You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub https://github.com/ionic-team/capacitor/issues/890#issuecomment-433655801, or mute the thread https://github.com/notifications/unsubscribe-auth/ALkkOUjoE7rlmSH9rTxig4JQnuAVvw4Wks5upMzwgaJpZM4XdKPl .

iI can confirm @Raerten answer works where the mixed content solution did not. Thank you! Is there any capacitor-friendly way of setting this flag through capacitor config?

for me it was a problem with a self signed certificate for my local dev server. apparently it’s not enough for android to install the cert. patching capacitors Bridge.java to accept my cert solved it for me, see https://stackoverflow.com/a/43594572 - waiting for a better solution though

I added allowMixedContent: true to the capacitor.config.json, and it doesn’t help. I got the error

{"headers":
    {
        "normalizedNames":{},
        "lazyUpdate":null,"headers":{}
    },
    "status":0,
    "statusText":"Unknown Error",
    "url":"http://vroom.semnpatrick.com/api/register",
    "ok":false,
    "name":"HttpErrorResponse",
    "message":"Http failure response for http://vroom.semnpatrick.com/api/register: 0 Unknown Error",
    "error":{
        "isTrusted":true
     }
}

Using below: “@capacitor/android”: “^1.1.0”, “@capacitor/core”: “1.1.0”,

I ran “npx cap sync” after added the allowMixedContent.

Am I missing anything?

You could also try setting “Access-Control-Allow-Headers” to a specific value instead of using the wildcard (‘*’).

The wildcard might cause issues as support for it is not fully implemented, yet (see https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Access-Control-Allow-Headers#Compatibility_notes).

So for the Spring config above you could try something like this:

@Override
public void addCorsMappings(CorsRegistry registry) {
	registry.addMapping("/**")
			.allowedMethods("GET", "POST", "PUT", "DELETE")
			.allowedOrigins("*")
			.allowedHeaders("Content-Type, Authorization, Accept, Origin"); /* ADJUST HEADERS */
}