For different roles with there permissions example admin , moderator , user
All these roles have different permissions for accessing pages and functionalities
How can I implement this in frontend
I am using react redux as my front end
Access and Identity management are typically not features which are solely handled at the front-end.
Your user should authenticate itself against a back-end which then grants a role to your user (which you can then use to show features which are only applicable to this role). However to avoid users from using features they have no rights to, you should validate on the back-end every request they do.
This gives you the flexibility to change a user's role on the fly and invalidate their access to the application when necessary.
Related
I'm using Firebase for a production level project and was wondering how I should write my security rules. I am using session-based authentication with my project, where a cookie is sent from the frontend (after a user has logged in) to the backend, and then the userID in the cookie is used to determine the permissions to the data of that user. The user logs in with a username and password, stored in the Users collection in Firebase (Cloud Firestore).
Because of this, I thought that users could only access data that should be available to them. However, I am not sure what Firebase security rules I should write. I thought that because I am authenticating users on my backend, I can allow anyone to read/write to the database, because permissions will be automatically monitored by the backend routes using the permissions stored based on the userID. However, Firebase docs say that I shouldn't do this because if anyone guesses the project ID, they will have full access to my database. What should I do? What security rules should I write?
Thanks!
We're working on moving some apps from Razor Pages to React, and we'd like to use Microsoft Identity Platform for authentication via MSAL.
Some of these apps are multi-tenant, and we want to be able to validate that a given tenant is set up and authorized when a user logs in. Today, we do that in .NET via the OnTokenValidated event by pulling the email domain or tenant ID from the token claims and comparing it to our app's list of authorized tenants in our databases.
In MSAL, I'm not entirely clear how to accomplish that. The MS docs say, "If you allow multi-tenant authentication, and you do not wish to allow all Microsoft account users to use your application, you must provide your own method of filtering the token issuers to only those tenants who are allowed to login" (in https://github.com/AzureAD/microsoft-authentication-library-for-js/blob/dev/lib/msal-angular/docs/multi-tenant.md#multi-tenant).
Where in the React login or token acquisition process can I inspect the claims in order to perform this filtering? How are others handling these kinds of checks with MSAL on a SPA front-end framework like React?
I am doing login from Azure AD.Client is SPA(angular using MSAL). If user is not Authenticated, it redirect to Microsoft Login Screen (using MSAL). On successful login, it return an access token.
My roles will be stored in a database. I need to add the roles of that user as part of claim in access token. I am not finding the way to do it.
I do not want to make another call from SPA to API to get the DB roles.
Please suggest some good approach.
Any links explaining the approach will also be very helpful.
I am still in design phase but not able to find the best approach.
In one microsoft site, i found that we can fetch the roles from DB but details were not there.
most of the places, it is written that we need to provide roles in Azure AD users menifest file.
In regular Azure AD, the "roles" claim is exclusively sourced from app role assignments for the signed-in user (or groups the user is a member of), to the app roles for the app the user is signing in to.
There's no feature currently in Azure AD which will connect to an arbitrary database, make a database query in the appropriate form, and include the results in the roles claim in the resulting ID Token.
I can think of three options to achieve your scenario:
After sign-in, call an API to retrieve the roles. Though you mention this is not desirable, it's probably the simplest approach, so it's worth listing. As a result of the user's sign-to you app, you app will usually obtain an access token to an API. If you set up your API to be secured with Azure AD (directly, or through Azure API Management), your SPA could simply get the necessary access token as part of sign-in, and at that point it's trivial to make a REST call to retrieve the role details for the user (and possibly other information useful to rendering your app).
Synchronize (or copy) your role information from your database to Azure AD. For each role, create an app role in the Azure AD app registration. For each user-role association, either create an app role assignment to directly assign the user (user -> app role), or assign a group to the app role and add the user to the group (user -> group -> app role. Keeping this in sync is probably not trivial, so if your scenario allow to move the role information to Azure AD app role assignment, you can forget the database entirely (making Azure AD the authoritative location). Of course, this might not work for your specific case.
Use Azure AD B2C and a custom sign-in policy. You could create an Azure AD B2C tenant, set up a custom sign-in policy to use your (regular) Azure AD tenant as the identity provider, and configure the policy to enhance the claims by calling a REST API to retrieve your roles. In this approach, you still need to have a REST API which can provide the role information, so rather than doing the setup and migrating your app, you may prefer simply calling the API from your SPA (option 1, in this list).
I am trying to create a React app where a user with "admin" role can create a new user in firebase.
The workflow would look like that:
normal login -> check userRole -> if admin: show createUserForm.
As far as I have read from the documentation, I would need an Admin SDK, but the problem is - how to implement it on client-side app? Has anyone gone through this process?
The Firebase Admin SDK should only be used in a trusted environment, i.e. a server you control or Cloud Functions. It should not (and cannot) be used in a client-side React app.
If you want to allow certain users of your React app to create accounts for other users, you'll want to move that part of the flow to a trusted environment where you can use the Admin SDK.
So the flow becomes:
Detect in the client-code whether the user is an admin (likely using a custom claim) and only show the form if they are.
Call a Cloud Function from your client with the input from the form.
Ensure the user calling Cloud Functions is authorized.
Create the user account in the Cloud Function using the Admin SDK.
As you can see this is quite involved. I highly recommend considering alternative use-cases, such as what it actually is that you want the admin to control. Once you enable a provider in Firebase Authentication, any user can create an account with that provider. Trying to control that from within your application code is just a recipe for problems. Often what you're actually trying to control is what a specific user account can do: e.g. only approved users can access certain data. Depending on where you store this data, that is much easier to control. For example: if you store the data in the Firebase Database, is is common to create a whitelist of approved users in such a case (or the inverse: a blacklist of banned users).
I am building a native iOS application and want to use AADB2C as identity provider where users login, signup, reset their passwords etc.
I cannot figure out a way to let users signup with AADB2C (or regular AAD for that matter) without redirecting them to a (customizable, but still) microsoft website. To be perfectly clear: I want to let customers create user accounts on AAD from a native iOS form without redirecting them to a website, preferably via REST request. (Like here under "Create consumer user accounts": https://learn.microsoft.com/en-us/azure/active-directory-b2c/active-directory-b2c-devquickstarts-graph-dotnet)
Can you create users from an iOS app?
Yes, using the Graph API as per the article you showed. You can only create local accounts at this time though.
However you need to be very careful about how you do it given that currently, the ability to create users requires Directory.ReadWrite.All permission, which also allows all other sorts of operations. You should NOT put the client ID and client secret for an app with these permissions in your iOS app. Rather, you would need to create a backend service that exposes an API for your iOS app to call for user creation.
However, more importantly, what you WON'T be able to do is SIGN IN the users without a redirect (which is what the B2C sign up policy does). In order to do this from your own UI without redirects, you would need Azure AD B2C to support Resource Owner Password Credentials Flow so that you can, after creating the user, use this flow to sign them in and get a token.
Note: You would also need to disable Email Verification so that you can leverage the user account right after user creation. You can set this in the Sign-up policy or Sign-up/Sign-in policy via Page UI customization > Local account sign-up page > Email Address > Require Verification > No
Lastly, as an FYI, there's a feature in the works in Azure AD B2C: Customer Owned Domains, which, paired up with UI customization, would allow you to have sign-up/sign-in pages that you can look like your own and have a URL of your own, with no trace of Microsoft for your end users to see.