Hello!
This is related to https://github.com/ionic-team/ionic-native/issues/1712
I am working to incorporate a custom OAuth2 flow using the In App Browser plugin. The IAB works great on iPhone, and a Samsung Galaxy J3, however, on a Google Pixel I just get a blank white screen with no page loaded.
Ionic Info:
li packages: (/Users/UserName/.nvm/versions/node/v6.11.1/lib/node_modules)
@ionic/cli-utils : 1.19.1
ionic (Ionic CLI) : 3.19.1
global packages:
cordova (Cordova CLI) : 7.1.0
Gulp CLI : CLI version 3.9.1 Local version 3.9.1
local packages:
@ionic/app-scripts : 3.1.5
Cordova Platforms : android 6.3.0 browser 5.0.3 ios 4.5.4
Ionic Framework : ionic-angular 3.7.1
System:
Android SDK Tools : 25.2.5
ios-deploy : 1.9.2
ios-sim : 6.1.2
Node : v6.11.1
npm : 3.10.10
OS : macOS Sierra
Xcode : Xcode 9.2 Build version 9C40b
Environment Variables:
ANDROID_HOME : /Users/UserName/Library/Android/sdk
Misc:
backend : legacy
OAuth Login Code:
login(): Observable<any> {
const authPrvInstance = this;
const redirectRel = 'oauth_return';
let authUrl = pingData.request_uri + "as/authorization.oauth2";
authUrl += "?client_id=" + pingData.client_id;
authUrl += "&redirect_uri=" + pingData.redirect_uri;
authUrl += '&scope=email+openid+profile&response_type=code';
const pingBrowser = authPrvInstance.inAppBrowser.create(authUrl, "_blank", {
location: 'no',
hidden: 'no',
clearcache: 'yes',
clearsessioncache: 'yes'
});
const loggingInLoader = authPrvInstance.loadingCtrl.create({
spinner: 'dots',
content: 'Logging in...',
dismissOnPageChange: true
});
return pingBrowser.on('loadstart').mergeMap((loadEvent: any) => {
let loadEventResult: Observable<any> = Observable.of({});
if (loadEvent.url && !(loadEvent.url.indexOf("/" + redirectRel + "?code") === -1)) {
loadEventResult = Observable.of(loadEvent.url.split('code=')[1]);
}
return loadEventResult;
}).skipWhile((code: any) => typeof code !== 'string')
.take(1)
.mergeMap((authorizationCode: string) => {
loggingInLoader.present();
pingBrowser.close();
return authPrvInstance.http.post(pingData.functions_uri + 'login', {}, { headers: new HttpHeaders().set('authorization', authorizationCode) });
}).mergeMap((tokenObject: any) => {
const firebaseLoginPromise = authPrvInstance.firebaseAuth.auth.signInWithCustomToken(tokenObject.token);
return Observable.fromPromise(firebaseLoginPromise);
}).finally(() => {
loggingInLoader.dismiss();
});
}
package.json
{
"name": "APPNAME",
"version": "0.0.1",
"author": "",
"homepage": "http://ionicframework.com/",
"private": true,
"scripts": {
"clean": "ionic-app-scripts clean",
"build": "ionic-app-scripts build",
"lint": "ionic-app-scripts lint",
"ionic:build": "ionic-app-scripts build",
"ionic:serve": "ionic-app-scripts serve"
},
"dependencies": {
"@angular/common": "4.4.3",
"@angular/compiler": "4.4.3",
"@angular/compiler-cli": "4.4.3",
"@angular/core": "4.4.3",
"@angular/forms": "4.4.3",
"@angular/http": "4.4.3",
"@angular/platform-browser": "4.4.3",
"@angular/platform-browser-dynamic": "4.4.3",
"@ionic-native/app-version": "^4.3.1",
"@ionic-native/camera": "^4.4.2",
"@ionic-native/core": "4.3.0",
"@ionic-native/diagnostic": "^4.3.1",
"@ionic-native/geolocation": "^4.3.0",
"@ionic-native/in-app-browser": "^4.4.2",
"@ionic-native/keyboard": "^4.3.2",
"@ionic-native/native-storage": "^4.5.2",
"@ionic-native/network": "^4.5.2",
"@ionic-native/splash-screen": "4.3.0",
"@ionic-native/status-bar": "4.3.0",
"@ionic/app-scripts": "^3.0.0",
"@types/moment": "^2.13.0",
"angularfire2": "^5.0.0-rc.1",
"com.mirasense.scanditsdk.plugin": "<scandit repo address>",
"com.synconset.imagepicker": "~2.1.8",
"cordova-browser": "~5.0.3",
"cordova-ios": "^4.5.1",
"cordova-plugin-app-version": "^0.1.9",
"cordova-plugin-camera": "^3.0.0",
"cordova-plugin-compat": "^1.2.0",
"cordova-plugin-device": "^1.1.6",
"cordova-plugin-geolocation": "^2.4.3",
"cordova-plugin-inappbrowser": "^1.7.2",
"cordova-plugin-nativestorage": "^2.2.2",
"cordova-plugin-network-information": "^2.0.1",
"cordova-plugin-splashscreen": "^4.0.3",
"cordova-plugin-statusbar": "^2.2.3",
"cordova-plugin-whitelist": "^1.3.2",
"cordova.plugins.diagnostic": "^3.7.2",
"firebase": "^4.5.1",
"firebase-tools": "^3.13.0",
"geofire": "^4.1.2",
"gulp-clean": "^0.3.2",
"haversine": "^1.1.0",
"ionic-angular": "3.7.1",
"ionic-native": "^2.9.0",
"ionic-plugin-deeplinks": "^1.0.15",
"ionic-plugin-keyboard": "^2.2.1",
"ionicons": "3.0.0",
"ios": "0.0.1",
"moment": "^2.20.1",
"promise-polyfill": "^6.0.2",
"rxjs": "5.4.3",
"sw-toolbox": "3.6.0",
"undefined": "^0.1.0",
"update": "^0.7.4",
"zone.js": "0.8.18",
"cordova-android": "~6.3.0"
},
"devDependencies": {
"@ionic/app-scripts": "3.0.0",
"stream": "0.0.2",
"typescript": "2.3.4"
},
"description": "",
"cordova": {
"plugins": {
"cordova-plugin-device": {},
"cordova-plugin-splashscreen": {},
"cordova-plugin-whitelist": {},
"ionic-plugin-keyboard": {},
"cordova-plugin-geolocation": {
"GEOLOCATION_USAGE_DESCRIPTION": " "
},
"cordova-plugin-app-version": {},
"cordova-plugin-statusbar": {},
"cordova-plugin-camera": {},
"com.synconset.imagepicker": {
"PHOTO_LIBRARY_USAGE_DESCRIPTION": ""
},
"com.mirasense.scanditsdk.plugin": {},
"cordova.plugins.diagnostic": {},
"cordova-plugin-network-information": {},
"cordova-plugin-nativestorage": {},
"cordova-plugin-inappbrowser": {}
},
"platforms": [
"ios",
"browser",
"android"
]
}
}