Web Authentication (like firebase auth) that supports a11y and i18n - facebook

I am building a web app using the MEAN stack and I want to enable user sign-in with Facebook, Google, Twitter, etc. The caveat is that I also want to support accessibility and internationalization.
The Auth solutions that I've looked at usually popup a new window - which is not ideal for my app; I want the login to be part of the normal page flow.
I can write my own UI markup that does the authentication on the server side using JWT and exposed APIs (like Facebook API) but I was hoping that there is already a solution like Firebase Auth that meets my needs. Any suggestions?

Related

How can I implement SSO between a web app and native app using IdentityServer?

I’ve got a set of APIs written in ASP.NET. These are to be accessed by a web app and native mobile app, and should be protected by the SSO.
I would like to be able have a SSO, where the user can login online and access the web app, and can also login on the native app (via the browser), and it’ll remember their login details (ie with an authorization_token).
I’ve been looking into IdentityServer4 but I’m a bit stuck on which authorization flows I would need for this.
Any help is appreciated, as it’s starting to hurt my brain! Do let me know if I need to explain it better.
For flows, there are today only two flows you should consider.
Authorization code flow, this flow is for clients where you want a user to login/signup, like a mobile app or web-application. Meaning, you have a user and a browser involved here.
Client credentials flow, is all about machine to machine communication, where you have no user involved.

Flutter with Native Webview using OpenID Connect and Okta

I am currently trying to implement OpenID Connect using Okta as my identity provider.
The only plugin I found that was capable of handling OpenID Connect was the Flutter AppAuth Plugin .
Unfortunately I was not able to use it with a Native Webview in order to have a seamless experience for the end user or more especially to not have any navbar cf. image below:
Anyone was able to implement this flow as a native Webview ?
I don't believe you'll be able to do this in a native Webview. OAuth and OIDC are designed so the application never knows about the user's credentials - the application just receives an ID token and access token. If you tried to embed Okta (or any OAuth flow) in a native login, the application could get at the user's credentials, and possibly harvest them. Popping a browser is a more secure way of doing things.
To add to Matt's answer, AppAuth is the standard pattern here, which involves use of special InApp / system browsers:
Chrome Custom Tabs
ASWebAuthenticationSession
My blog has some details on this. I always recommend people to start with AppAuth samples. A couple of posts:
AppAuth Setup with Private URI Schemes
Advanced Sample with Claimed HTTPS Schemes

Keycloak OpenID Client without browser

Problematic
I have a working Keycloak in production and I need my users to log into a mobile app, developed using react native using that Keycloak. Till now I was using the normal login flow through the in-app browser as AppAtuh, but now I received a request from users, to say in the app while logging in.
What I've tried
I made the Keycloak theme for the mobile login ressemble the Mobile App UI so much, that it could be just opened using react WebView as a normal screen.
On the paper, this idea works, but in real life, I cannot take advantage of the Keycloak ID cookie placed. So whenever the WebView open, a new session with cookies are generated. It's not useful.
I started calling keycloak endpoints myself from inside the mobile app. It's not an easy job, because some endpoints doesn't works because of OTP configurations that I've done.
Secondly, this Idea works for simple process like login, but does not work very well for registration or reset-password. And it's just an example. My Kecloak does have a list of Authenticators which uses phoneNumber and some cookies to login.
Specifications
I'm using Keycloak 10 (started with keycloak 6 a year ago)
The mobile app is developed using React Native and Expo. Tthe first login flow was using the library Expo AppAuth and the second, React native WebView
Have you read that? I think you should consider using Custom URI scheme for your Keycloak OpenID Connect client and use default phone browser. This might be helpful as well.

How to authenticate with Foursquare OAuth2 within a jQueryMobile app (no useragent flow)

I am building a mobile app with jQueryMobile and I intend to deploy it onto iPhone thanks to PhoneGap.
My question is : how can I authenticate myself with Foursquare using the OAuth2 protocol in my jQueryMobile app ? One solution would be to use the useragent flow of OAuth2 but this would force the iPhone to launch Safari and thus not stay within the app. Are there any better solutions than this ?
For an iPhone-based or client-side application like you would have in PhoneGap,
Foursquare recommends one of these methods.
If you have no substantive server code, you can embed a web browser and use the token flow, redirecting the user to a dummy page on your domain. You can then grab the token off of the URL and close the browser. We have sample Android and iOS code for your reference.
If you have a server as part of your application, you can use the server flow above, possibly in an embedded browser. Similar to the Facebook API, you can add display=touch to your authorize or authenticate URLs to get a mobile optimized interface.
An alternative to the above is to use the server flow and an external browser, but redirect to a custom URI handler that brings the user back to our application. You can embed the secret in your application and exchange the provided code for an access token. PLEASE take steps to obfuscate your client secret if you include it in released code, and be prepared to rotate it if needed.
https://developer.foursquare.com/docs/oauth.html
This could probably be handled with the ClientBrowser plugin for PhoneGap or just adapting the sample code they have provided into PhoneGap plugins.
One of the core intentions of OAuth2 is to not allow browserless authentication flow like we did with XAuth in the past. Service providers want consumers to see what permissions they are signing off on, and want control of that process.
I'm not very experienced with Phonegap, as I'm a native developer, but if there's a way of instantiating a UIWebView and showing it to the user, you could at least keep the web interaction 'inside' of the application. Given phonegap is basically showing a UIWebView this should be possible. It is possible to examine the source of the html within a UIWebView using
- (NSString *)stringByEvaluatingJavaScriptFromString:(NSString *)script

Can you use openID as a single sign-on for an iphone app?

I'm looking to implement Single Sign On for a native iOS app whereby logging in with this single sign on gives the mobile device authenticated access to our private service in a fashion that is somewhat similar to oauth.
The marketing text on openid.net suggests that "OpenID is a safe, faster, and easier way to log in to web sites.". Emphasis on web sites.
So the question is: Is it reasonable to implement openID on a native mobile app, or is openID only for web sites.
I've been scouring the web and I'm not finding a way to fit openID in as my login option.
The best way to do this seems to be to use a UIWebView and render a log in page from your site in it. Once the user logs in, they'll be redirected back to your site and have an auth cookie, which you can extract, store, and send on subsequent HTTP requests to the server.
See this, which has a sample code link at the bottom.
OpenID sends its messages as a series of HTTP requests and responses. Your app and the openid provider must communicate to each other via HTTP post, and you will need to redirect the user to corresponding URLs, and have a URL for the user to be redirected back to. As such, you will probably find it difficult to integrate with your app.
Derek Knight claims to have been experimenting with iOS and OpenID using the Janrain Engage iOS SDK. Although the github link he references no longer exists and he doesnt provide a complete and verified solution, he does offer an idea for how it might work.
OpenID and iOS development - gordonknight.co.uk
Janrain Engage for your iPad Apps
The accepted answer diminish the OpenID protocol. OpenID is a federated authentication protocol aiming simple SSO experience, its a web based protocol but it can be implemented if you design an authentication broker.
APPs share nothing, apps should never access anything but identity token and access token (if allow). here is a link to get you starter in the right path to build seems-less SSO in the mobile between apps regardless the app isolation level.
https://www.pingidentity.com/developer/en/resources/napps-native-app-sso.html
Libraries:
https://github.com/openid/AppAuth-iOS
https://github.com/openid/AppAuth-Android