I'm working on authentication for an Ionic 4 app. I'm using the in app browser plugin to login. After successful login an access token is sent back to the client. I can't figure out how to get the token from the In-App Browser to the app.
You can use an event listener such as :
this.browser.on('loadstart').subscribe(event => { this.checkForToken(event); })
Where checkForToken can look at your "event.url" and parse the token to be stored to localStorage or some other method to be used to login with once the in-app browser is closed.
Using events to listen for load start and stop was an awesome idea. I was, however, facing another issue. Google doesn't allow sign in using the In-App Browser and I really needed that. After asking around and looking at similar past issues I came across a Cordova plugin called BrowserTab. This was awesome as it's an instance/Custom Tab from chrome so it worked fine with google sign in. Another problem came up. You can't inject Javascript into BrowserTab and there was no way to programmatically close it once done. I looked around some more and that's when Deeplinks came to mind. I used the Deeplinks plugin and passed my access token as a parameter. When the user logs in, the BrowserTab redirects to a Custom URL scheme link for my app with the access token in the URL. Now it works perfectly. I've read somewhere that IOS is getting rid of Custom URL Scheme links. Luckily, it still has support for Universal App Links
Related
I am struggling to utlise the angular-auth-oidc-client to add OIDC workflows into my Ionic app (android), although I feel the issues are more Capacitor so not sure that the library is the issue. There are numerous (old) posts on Google of people who have had similar problems, so I'm trying to ascertain the current state of play. I can:
By utilising a custom android scheme in my AndroidManifest, and an 'appUrlOpen' listener in app.component my OIDC login page loads in the Chrome browser on the device, and then returns to the Ionic app and opens the correct app page. Unfortunately because I've opened the login in Chrome it hangs around in the background with the username and password populated. I've no handle to it to close it, and the Capacitor plugins don't help me here.
Alternatively, I can add my ID Provider domain into 'AllowNavigation' in capacitor.config.json. This opens my login page in the app's webview, begins the redirect on successful login but fails (hangs) because Capacitor is not loaded when it attempts Window.Capacitor.triggerevent calls.
This is probably classed as a poor question, and I appreciate that it is light on code, but I'm interested in whether anyone has actually managed to do this successfully, as there are so many dead ends on google and github of people who've given up!
Yes it is possible to complete an Open ID Flow on ionic with capacitor.
You need a capacitor plugin to do so, ionic provides an own payed plugin (https://ionic.io/docs/auth-connect), other alternatives exist.
angular-auth-oidc-client out of the box works only on browser, not on iOS or Android. It seems that some adoption can be made, see https://github.com/damienbod/angular-auth-oidc-client/issues/807.
I'm making a twitter app on iOS using their api. But they just recently upgraded everything dealing with authentication. Therefore breaking The Swifter library that I am using. My app was working fine before this update. In my apps.twitter.com In the setting section, the first callback url I have is http://MyTweeter ...It wants to me to add another callback, idk why/what so I just added http://google.com. In my app when I call the authentication function, it starts to authenticate and goes to the twitter login page and right after I click the login button it shows me the error in the pic attached below "Safari cannot open the page because the server cannot be found". Does any one have a solution?
So i found the solution. In you app, in the authentication function, your callback url should be something like MyTwitter://success but in apps.twitter.com you have to make it MyTwitter:// without the second part
I spent a while already to fix annoying issue with Facebook in PhoneGap app. And still a lot of things goes wrong with that. The thing is that I use Appery.io and Facebook plugin.
This is how my Facebook console looks now:
I suggest that localhost might be a reason of the issue. However, I got it into Facebook_Helper.js:
Everytime I try to sign in with FB account, I get the same error at the child window:
So what I've got is that app is authorized at this moment indeed, because there's a menu button at the navbar that allows me to navigate through FB profile:
The first issue lies in that the child window never gets closed automatically once user submitted Sign In form. And the second one is that I can't get the access token to the app directly. I know I'm doing something wrong, but I spend more than a week on that and nothing was clarified.
Honestly, I've no idea why it's not working. I saw a lot of apps written in PhoneGap that use the same authorization too, and they work as it should. Will be appreciate if you take a look into that and, maybe, advice something.
First, I don't see iOS or Android in your developer.facebook screenshot.
Second, you should implement native facebook integration if you are developing an app, if I understand correctly from your code, you are trying to handle only web browser version of authentication. Native integration is both the suggested way by facebook and platforms and better experience for end users. If users have facebook app installed, authenticating over fb app is more secure after all..
You can use a cordova plugin for facebook integration, here is one of the plugins (I am one of the authors): cordova-facebook plugin
Building first firebase app using phonegap and angularjs. It authenticates fine in Chrome and I get back the fb user id.
My problem is when I build it with phonegap 2.9 and login with facebook I get nothing but a white screen after login.
My limited understanding is that I'm probably not handling the callback correctly.
In my console logs I see:
Finished load of: https://auth.firebase.com/auth/facebook/callback/?firebase=mementomori
&internalRedirect=false&code=AQDLp_n5_JCnC4yc1OXcXhd2Xfty_UHy_2bmOpR
-JIbyeEZQfh9LCf02deQkXbtXQknxYpTf_XHGFiy4DB1S4Do6fILTmFZ2_z
-S_N872VhwtlWkkOam4I9iMKoqa8PF43jIIdfvTpg8CwPZMs3YrVwqwuJRKzkovBL6nWI8vtdSa
_CFnEhHanXHoaJ3mH7d2vmbhmNGusBkfRdqXnd3LEC1rUyY7hrEr4pfN3BCRAzzgY_
YTot0CUoqRImLPAI76qc18KWaCytZ0ueaMnH7zavkvNExpVSiKlPQBdLUQmFmZQa
FQc6gNWm3dfZTAJw9hLg#_=_
Can anyone offer any information on how I should handle this callback properly?
Solution
I got around my issue by logging in with the native phonegap fb plugin and then passing the auth tocken to firebase for authentication.
If you're using Firebase Simple Login with Phonegap, there are a few prerequisites:
You've included phonegap.js or cordova.js in your application.
Enabled the InAppBrowser plugin in your application.
With both of the above configured, Firebase Simple Login will behave equivalently in PhoneGap as in on desktop / web, where the callback you passed to the Simple Login constructor is invoked with login error or user object. Hope that helps!
I have created an iPhone application using PhoneGap. I have followed code from this tutorial:
Building PhoneGap Mobile Applications Powered by Database.com
I have logged in successfully and got struck in this screen:
I am unable to move to other screens to access data. Here is the url that got generated after successful login:
https://login.salesforce.com/services/oauth2/success#access_token=0000&refresh_token=0000&instance_url=https%3A%2F%2Fna12.salesforce.com&id=https%3A%2F%2Flogin.salesforce.com%2Fid%000C&issued_at=0000&signature=qqqq&scope=id+api+refresh_token
Do I need to add cosumer key to this url? Here is my callbackurl:
https://login.salesforce.com/services/oauth2/success
What would be the problem? Did I miss anything?
So https://login.salesforce.com/services/oauth2/success is a stub URL for callbacks - and that is the screen you are seeing there, and the access_token variable is your session ID for the user. So the OAuth flow is working correctly.
In the code, you might check to see if:
oauthResponse.access_token
Is getting set correctly. If so it looks like:
sfw.login( setupHomeView );
Is what should tell it to move from that page to the next UI page.
You might also check out the Force.com Mobile SDK:
http://developer.force.com/MobileSDK
It also includes PhoneGap and has a great OAuth wrapper built in.