How to handle single sign out from identity server4 with frontchannel? - javascript

We have a solution which using multiple SPAs written in Angular and AngularJS. These application implement the oidc-client-js library and authenticate in Identity Server 4. Due to limitation of AngularJS we need to render our legacy AngularJS apps in iframe. There is one main application that allows to login through IdentityServer4 and then we can open different SPA inside that main application. This is working fine until we logout and then login on different user. On the main app and apps that are written in Angular7 the user is correct but when we enter on application that is rendered in iframe the user stays from previous session.
According to the IdentityServer docs I was trying to add
FrontChannelLogoutUri to notify all logged in clients and end all sessions.
But I haven't found what this logout page supposed to do.
Also I was trying to clear all grants when logging out but there is no grants to be cleared. To acheive this I used following method:
await _persistedGrantService.RemoveAllGrantsAsync(subjectId, clientId);
This method from IdentityServer returns empty list.
var grants = await _interaction.GetAllUserConsentsAsync();
I believe after FrontChannelLogoutUri is rendered the session should be ended but I have no idea how to achieve this.

After redirect to FrontChannelLogoutUri probably need to clear session storage in iframe. For now this is working fine.

Related

How to allow multiple login from one platform

I hope you are doing well!
We are working on a project that consists of 3 projects/websites. It's basically something like a Management Platform for the resources, a Platform to display information and updates, and a Platform to manage both those platforms. (Something like Office365 and PowerPoint, Word, Excel where Office365 is the main application between them).
In our project, we want to integrate a navigation drawer in which the user can navigate to the different application from our 3 websites without having to re-login. In this case it would be easy. However, would there be a way that if the user access the other website from the browser (ex:"www.exameplwebsite.website2.com") we login the user directly if he was already logged in to a previous application from ours?
We thought about local storage however the local storage and cookies accessible depend on the domain we are accessing.
Is there a way to make this happen? Or would using a navigation drawer the only way possible?
(For context we will be using ReactJS)
I think it wouldn't be that hard with JSON Web Token (JWT) for authentication. When you redirect the user from one site to the other do it with a post request and include a JWT token in it. The new site can capture that token and send the token to the browser and the browser can catch it and saves it into its own localstorage.
I can think of two solutions ->
Use micro frontends (Recommended)
If all three apps have different domain names (app1.com, app2.com, app3.com) then you're right you cannot share any token using cookies and local storage.
Here, You can take the login/signup pages and the navigation drawer into one parent app and load all your other apps using micro frontends.
Use SSO
SAML and OIDC are made for this specific purpose but this is a very complex topic. Basically, your users will need to log in once(at someplace like google or OneLogin or your own identity server)

Creating a common Login App using FirebaseUI

I have developed several web applications with the own login forms/logic etc. I would like to simplify these by creating a single dedicated web app to handle all the login logic using FirebaseUI. The way I imagine this working is when the user needs to login with one of my apps they are redirected to my login web app. The user supplies their credentials and if successful the login app redirects back to the original app with data to confirm whether the login was successful.
If this is possible I shouldn't have to repeat the login logic in my other web applications and any changes to login code are only required in my login app. I'm not sure if such an approach is possible, however, or how I could securely and safely let each web app determine that the user has successfully logged in. Can anyone offer advice on how to implement this or point to examples where this has been done already?
You might be looking for single sign-on.
Google does something similar. Every time you login you're redirected to accounts.google.com, and after that you're redirected to your app.
You're right in saying that it's trickier than it appears on first sight though. Most web login systems are based around cookies and the whole client-server process around them. Cookies are set per domain. If all your webapps are on the same domain or subdomains of a single domain, you should be OK to go with this approach and get the results you want. If not, you're going to need some extra work to get code from different domains to speak with each other and make everything possible.
In general, if designing a login system from scratch is considered a big endevour, designing a single sign-on system is an order of magnitude harder. OWASP had this to say about them in 2011.

How to authenticate a react-native app offline

Am trying to make an app that runs both online and offline but i want my user to be authenticated or to be logged in once. So after the initial login i want them not to be able to see the login form again, i want to show them a new part of the app. They should be only to see the login form only when they decide to logout. My problem is that it would have been easier for me to do this if they are always online but they might be offline too so i just need them to login once and next time they boot up the app they wont see the login form again rather they would see something else.
There is no authentication offline. Authentication is made so that the server-side makes sure it is used by a given identity because you can never trust the client-side. If there is no server-side, there is no authentication process.
If you just want to let the user use your application, even though he is online, why don't you store a local copy of the user profile within the local storage after a successful authentication? (with only non critical data of course).
This way, your application can rely on its memory to fetch the user profile and not the server while it is offline.
You could save an kind of "userIsAuthenticated"-Flag to local storage (see https://facebook.github.io/react-native/docs/asyncstorage.html).
Based on this flag you could decide which screen the user see on startup.
But be aware, it could drive your Users crazy, if they have allways to relogin, if the network-connection (maybe cause of bad 3g/4g) was Interrupted.
You also give a notice if a user is offline, that they have to be online to use this app.
BTW: To request if a user has Network-Connection you can use: http://facebook.github.io/react-native/releases/0.48/docs/netinfo.html#netinfo.
Don't forget to set permissions in AndroidManifest.xml to be allowed to use the request.

Facebook's PHP SDK with custom login page instead of redirecting?

Is it possible to create a custom login page to use with facebook's PHP/JavaScript SDK? I'm developing a web app and it doesn't seem very user-friendly to redirect the user to the facebook page to login. For example, once you hit login it doesn't even let the user know its loading, just sits there until it logs in.
I was wondering if it's possible to use ajax or cURL to log the user into facebook through a form within my app.
No this is not possible, you have to use Facebook's OAuth protocol.
Have you tried their javascript solution? This does not take the user away from the page, but instead opens a popup which is less of an intrusion on the page.
The facebook api is just for you to obtain access credentials from their system. I do not know and until then I never saw no way to get credentials and log into facebook without the facebook api.

Integrating Facebook iOS SDK with Comments using Connect

On an iOS application, I plan to host Facebook Comments using Facebook Connect within an UIWebView, have already done some tests and read articles where I think that it shall work fine.
My question regards authentication: I wanted to use Facebook iOS sdk to have and store the proper tokens within Objective C, so that the user doesn't have to do it every time. I know how to inject any data in the UIWebView if needed, but my question is WHAT do I need to inject so that the facebook scripts already see the user as authenticated every time ?
Thanks
See https://developers.facebook.com/docs/authentication/. You will get an access token when you authenticate the user which you can then use throughout your application to request information on the users behalf.
Download the latest Facebook iOS SDK.
Create the Facebook object:
Facebook *myFacebook;
[self myMethodToDoSomeAuthenticatedStuffsWithAccessToken:myFacebook.accessToken];
Also, you can see the sample "Hackbook" project to see how the access token is setup for the Facebook object within the application and how it is auto refreshed.
This keeps the user authenticated on the iOS Device and you can use this access token a NSString* type to do your stuffs.

Categories