sahat/satellizer

Cordova + Angular - Social Login receiving tokens after auth, but not logging in my app

martin104 opened this issue · 2 comments

Hello all!

I've been struggling for the past week about the integration of Satellizer with Cordova and I've barely made any progress.

In general my cordova app is just a webview, so I get all the code from my webapp, where the social login buttons are connected to Satellizer and everything works fine. However when I click the buttons from the app I'm sent to the facebook or google auth page where I log my details, then I'm redirected back to my app, but I'm not authenticated. In the url I receive the tokens, but obviously the frontend client cannot do its magic to authenticate me within my app.

If I do the same from Chrome everything works fine.

Here is my provider setup for Satellizer buttons, version 0.14.1 :

$authProvider.facebook({ clientId: 'xxxxxxxxxxxxxxxx', url: configProvider.data.api.url + '/auth/facebook' });
Inappbrowser seems not to open a popup, however..

Any help would be greatly appriciated!
Thank you!

Another day spent, here's what I've found:

InappBrowser seems to be installed correctly as I put a test window open with it opens my test link in a popup.

InappBrowser doesnt work for Satellizer as no matter what I do, when I click on the social button it just goes to social login form location and never opens it in a new tab or a popup.

Here's my cordova init.js if it helps:

document.addEventListener('deviceready', function() {
if (window.plugins && window.plugins.OneSignal) {
window.plugins.OneSignal
.startInit('xxxxxxxxxxxxxxxxxxxxxxxxxxxx', 'xxxxxxxxxxxx')
.inFocusDisplaying(window.plugins.OneSignal.OSInFocusDisplayOption.Notification)
.handleNotificationOpened(function() {})
.endInit();

	window.plugins.OneSignal.setSubscription(true);

	window.plugins.OneSignal.getIds(function(ids) {
		window.location.href = 'https://mydomain.com/?uid=' + ids.userId;
		var ref = window.plugins.InAppBrowser.open('https://google.com/', '_blank');
                    // None of these seems to work...
		$window.open = window.plugins.InAppBrowser.open;
		window.open = window.plugins.InAppBrowser.open;
                    window.open = cordova.InAppBrowser.open;
	});
	
} else {
	alert('Something went wrong, try again later.')
}

}, false);

So, I finally found the issue and its more than one.

  1. As the webapp is build the code is mified with uglifyjs and the mangle changes the names for vars - window.cordova was a.c (or something similar). So I added exception for window and cordova. For everybody who's interested heres the link mishoo/UglifyJS#671

  2. As my cordova app is just a wrapper for an webapp and I was just using window.location.href in the init.js (see previous comment) the cordova.js and other plugins were NOT available and thus checking for window.cordova anywhere on my webapp (& satellizer.js) returned an error. What I did - I injected the cordova and the plugins with this plugin : https://github.com/TruckMovers/cordova-plugin-remote-injection . With it everything works fine.

@sahat You may want to add this note (2) to the docs for users who's apps are just wrappers for their webapp/sites. Installing the plugin is a must in order for satellizer to work for them out of the box. It will save them a lot of trouble and time.

Everything good, but here's the catch - Google dropped the support for webview auth and it still wont work this way - the popup is opened but you see the disallowed_useragent error. Facebook works for now, not sure about the other socials.

As a conclusion, I'm looking for a way to manually parse the ?code - bypassing the satellizer popup function so I can just pass it to my backend and get a token which satellizer will hande. Any ideas on that?