ionic 3 webview and net::ERR_CONNECTION_REFUSED

Published by iamkarlson on

Having Ionic app is always a challenge. However, sometimes it’s more than JS challenge. You’re getting strange error down from the stream (from the chromium webview itself) and don’t know what to do. One of the strange problems is net::ERR_CONNECTION_REFUSED. You would get it if you run android lower than 5. But if your app suppose to be running above that version things get worse. My case is that this exception was raised by webivew when my OAuth (Azure B2C to be particular) authority redirected webview from the login page back to the app. Urls were right, credentials were right, packages were almost up to date. In webview v4 they get rid of the internal webserver and my iOS app stopped working with a custom scheme. Your service provider cannot work with a custom scheme? Go and fix them.Yeah, instead of one shitty framework you have to deal with one and every service provider on your own. “Report to Google”. I would probably make it work if Android would work on the latest packages but it didn’t. So I’ve downgraded packages and fix the issue with redirect and decided never to use Ionic again. Here’s a solution:

ionic info:

Ionic:

Ionic CLI : 5.4.5 (/usr/local/lib/node_modules/ionic)
Ionic Framework : ionic-angular 3.9.8
@ionic/app-scripts : 3.2.4

Cordova:

Cordova CLI : 9.0.0 (cordova-lib@9.0.1)
Cordova Platforms : android 8.1.0, ios 5.1.1
Cordova Plugins : cordova-plugin-ionic-keyboard 2.1.3, cordova-plugin-ionic-webview 2.5.3, (and 13 other plugins)

Utility:

cordova-res : 0.8.1 (update available: 0.9.0)
native-run : 0.2.8 (update available: 0.3.0)

System:

Android SDK Tools : 26.1.1 (/Users/georgy.grigoryev/Library/Android/sdk)
ios-deploy : 1.9.4
ios-sim : 8.0.2
NodeJS : v10.16.0 (/usr/local/Cellar/node@10/10.16.0/bin/node)
npm : 6.9.0
OS : macOS Mojave
Xcode : Xcode 11.1 Build version 11A1027

Need to mention that package for authentication is angular-oauth2-oidc (v3.1.4).

My problem is that my app receives a valid url with token and all this crap but instead of redirecting by HTTP 302 it just crashes. Error you will get is net::ERR_CONNECTION_REFUSED and in braces a desired URL. So first of all commit your platforms/android code. It must be a flag #1 that this is a bad solution. Then go to /platforms/android/CordovaLib/src/org/apache/cordova/engine/SystemWebViewClient.java. In this file most likely you will find

@Override
@SuppressWarnings("deprecation")
public void onReceivedError(WebView view, int errorCode, String description, String failingUrl)

Suppressed warning must be a flag #2 for you. Here you can trace the error and the method itself already contains a flag #3:

// If this is a "Protocol Not Supported" error, then revert to the previous
// page. If there was no previous page, then punt. The application's config
// is likely incorrect (start page set to sms: or something like that)
if (errorCode == WebViewClient.ERROR_UNSUPPORTED_SCHEME) {
parentEngine.client.clearLoadTimeoutTimer();

if (view.canGoBack()) {
view.goBack();
return;
} else {
super.onReceivedError(view, errorCode, description, failingUrl);
}
}

So we need to add another hack to it (a flag #4):

if (errorCode == ERROR_CONNECT){
  if(failingUrl.contains("access_token=")){
    view.loadUrl(failingUrl);
    return;
  }
}

After launching this url in a such way everything works as expected. Please let me know if there’s any better way to do it.

 

update

Instead of handling error code there’s a better way to hijack redirect when a webview check is it allowed to redirect:

public boolean shouldOverrideUrlLoading(WebView view, String url) {

    if(url.contains("access_token=")){
      view.loadUrl(url);
      return false;
    }
    return parentEngine.client.onNavigationAttempt(url);
}

P.S. Still looking for a better way to handle such a thing.

Categories: mobile
Tags: