Adding new Claims after authentication - identityserver4

I have the following environment
IdentityServer 4 (STS)
ASP.NET (Web API)
Angular (SPA)
My goal is that after authentication in IS4, the user will be returned to the SPA application and also there will be an additional request to the Web API, to provide additional Claims. The values of these Claims will depend on what is currently in the database to which the Web API is connected. I need these Claims in future to allow access to certain APIs
I know that this can be done through ProfileService. But in this case IS4 should be a part of Web API (which I can't do by requirement)
How should I do it right?
I had an idea to create in my Web API a new endopit, which will return a set of Claim. And these Claims I will store on the SPA side of the application in localstorage. But this doesn't seem very safe to me, because anyone can change these Claims

Related

What is the best approach for using OpenID Connect in a mobile app to authenticate the user to a backend?

I'm working on a product with two apps: one a single-page web app, and the other a native mobile app. Both make use of the same backend API. Currently the user authenticates using username/password credentials to establish a session cookie. I'm planning on adding support for authentication using OpenID Connect.
For the web app, I'm looking at following the advice for "JavaScript Applications with a Backend" in "OAuth 2.0 for Browser-Based Apps". In that scenario, the authorization code gets sent to the backend, which obtains the ID token and begins a cookie-based session.
I'm trying to work out how this would work on Mobile. The "go to" implementation of OAuth/OIDC on mobile appears to be AppAuth. From what I can see, AppAuth uses a different approach where you end up doing the auth code exchange on the device to get the ID token.
Should I have the mobile app send the ID token on to the backend to prove the user identity (and then begin the session)? Is there any best practice around doing this? Presumably at least the backend would need to validate the JWT and verify the signature?
Alternatively, can AppAuth be used to do a similar flow as done on the web app as mentioned above?
The mobile case does indeed work differently, and is defined in RFC8252, which defines the AppAuth pattern. Both the web and mobile cases have this in common:
Open a system browser at the Authorization Server URL with a Code Flow request URL
Cookies are not used in mobile views, and mobile apps can store tokens securely, unlike browser based apps. The mobile app will send access tokens to APIs, and also make token refresh requests when needed.
Out of interest there are easy to run versions of each in my online code samples, if you want something to compare against. Both flows are tricky to implement though.

Authentication and Authorization in React app

In a .NET app I can add authentication and authorization using web.config and/or IIS. I can also use [Authorize (Roles = "RoleABC")] in a MVC app's controller or action. And even extend the AuthorizationAttribute
I'm looking into creating a React app for intranet use, and reading these tutorials (ReactJS and MS), but can't find authentication/authorization details.
Even though the app will be Single Page App, I still would like to authenticate and authorize users for certain options within the app, just like I can do in MVC app.
Is the only option to do that way is creating Blazor app instead?
For authentication and authorization, you should use auth tokens (like JWT). Your backend should create an auth token when a client logs in to the system and sends it to the client. Your server also should send the authenticated user information to the client (react app) so that you can render correct pages according to the user type. For example, you can render the admin page for an admin type of user, and the guest page for a guest type of user. You can save this user data as JSON in Redux. Hence you can access the user data from any component of your react. Also, in your backend, you must restrict the endpoints according to the auth token which is sent by the client. In the backend of my app, I follow the below steps:
Authentication check -> Authorization check -> controller (endpoint) -> result
React isn't opinionated on this, so it's up to you to design the implementation. A basic way to do this is:
Log in and obtain an authorized JWT token from the backend and include the account ID when you sign it
Store the JWT token in localStorage, store the account info in Redux
Conditionally limit routes based on account info (ie. admin group) on the front end
Have every auth-required API call include the JWT token in the x-auth-token header, then on the backend use middleware to check if it's still valid. You can then also decode the account ID in order to check its privileges so that you can limit API access
This may be helpful: https://medium.com/#faizanv/authentication-for-your-react-and-express-application-w-json-web-tokens-923515826e0#5f52
Not sure whether you still need this - I personally feel we should have something bridging the authZ gap between server and client to make it easy. So I spent a few days on a github project for this purpose, here it is: authzyin.
What I tried to do is to leverage policy based authorization from asp.net core - which I think it's very cool - and automatically bring the same definition to the client to use in React via hooks.
For authentication I am using msal.js against AAD - so authN is done on the client and jwt bearer token auth is used for all requests.
It has a client lib and a server lib which can be used together or separately. Of course it might still be lacking some features - please feel free to take it as a reference (contribution is also welcome).

How to configure a WebApp & WebApi with different AAD App IDs?

I currently have two app services
Web App (Asp.net core 2 w/ front end in react)
Web Api (Asp.net core 2)
Note: Both are configured with different Azure active directory app id.
user signs into Web App and retrieves a token for it's own appId/ClientId/ClientSecret stored in tokencache.
from the WebApp, the user wants to talk to a WebAPI but needs to get a token since it's protected with AAD as well but it's a different app id/client id/client secret.
Problem:
When I try to do a AcquireTokenSilentAsync() for the web api, I get an error throwing that I the token is not in the cache?
It also seems that with depending if your using AAD v2.0 or v1.0 will determine if the web app and web api can have different app ids. So it seems like i would have to use AAD v1.0. With Asp.net core 2, it's not clear to me what OpenIdConnect is using or configured to use under the covers.
Question:
It's not clear to me why the acquire token silent async didn't work and failed. Does that only look for the token in the cache; otherwise it fails?
Is it possible to configure the token from web app to have permission to access web api resources. I notice that in the azure portal, you can selected resources like microsoft graph, but I don't know how you would associate a custom API. In my case, I want to get it running on my local machine before I move it all to azure.
If the web app token does not have permission to access the web api, do i need to do another login authentication with the user even thou both are within the same tenant?
Any Advice appreciated,
Derek
Yes, AcquireTokenSilentAsync will look into the cache, and see if it can find tokens. If it does, it will check to see if the access token is still valid and return that back. If the token is expired, it will use the refresh token to fetch a new access token and return that back. When this call fails, it's an indicator you need to perform an AcquireTokenAsync (which will likely show UI in the case silent already failed).
Yes, you can associate a web app to get tokens for your own custom web API. I'd recommend using Azure AD v1.0 (register the app in the Azure portal, ADAL library). You'll need to register the two apps (web app and the api), both will be type web app/api. In the API, you can register an App ID URI which will act as the resource identifier for this API. In your web app, you'll want to go into the Required Permissions, and add the Web API you have registered as a permission. Then in your web app, you'll need to use the ADAL library (alongside an OpenID OWIN middleware) to acquire a token for the resource as specified by the App ID URI field. Here's a code sample that implements the exact scenario you're describing (Web App/API in ASP.NET Core).

Use IdentiyServer or not for external login provider only web application with asp.net core

I am building a web application with
Asp.net Core 2.0 Web API
AngularJS 4+
SQL Server
User signup/login only through Google/Facebook/LinkedIn. I will save user info like name and email I receive from them into SQL db table. I do not have a plan to offer manual registration on my website with email and password. I do not want to maintain user credentials, forget the password, securing user passwords and all nitty-gritty around that.
As of now, there is no plan to build a mobile app. I am learning .Net Core and stumble upon IdentityServer4 as a recommended way to provide identity in asp.net core applications. I went through all docs, example and tried out few sample application. I think I am clear how configuration and workflow of identityserver.
My questions are
Is it worth employing IdentityServer4 in my architecture since my identity is external provider only? I was thinking about using default Asp.net Identity with.AddCookie(), .AddGoogle() and .AddJwtBearer() to retrieve the cookie from Google/Facebook/LinkedIn, use AddGoogle AddFacebook AddLinkedIn middleware to handle callback, extract claimprincipal and set Jwt token for Angular JS app to use in its XMLHttp request.
What benefits do I get outsourcing this work to IdentityServer4 besides identity in one place best practice?
I appreciate your tiny or big feedback on this.
IdentityServer is great for handling many clients that access many protected resources. You seem to have one client (the so called AngularJS 4+ app) and one resource, the Asp.net Core 2.0 Web API.
A point of clarity is that you have no need for ASP.NET Identity and all those middlewares for Google, LinkedIn, etc. If your client is truly an Angular javascript application, then it does not need a server side component like ASP.NET Core- it is simply a browser application. You can use a javascript library like oidc-client and configure your external authentication providers according to their own needs. You will receive an id_token and/or access_token to store in browser and utlimately pass to your Api Resource.
Speaking of your Api Resource, this application can validate directly with the token issuer, be it Google or Facebook or whoever.
So with this setup: (a) a browser app (Angular), (b) a server WebApi (ASP.NET CORE), and (c) and an identity/access control service (Google, Facebook, etc.) you certainly do not need any additional applications that run ASP.NET Identity or IdentityServer4. Seems like it would be easier without them.
If your Angular app is actually in an ASP.NET MVC, then the same is true.
If your Angular app and your WebApi are all part on one ASP.NET project then the same is true and all you need is an identity provider to return an id_token.

Forms authentication with hybrid mobile apps

We are the process of developing a android phone app using IONIC framework and Web Api as the backend.
My question is ,is it sufficient to use Forms Authentication along with SSL to keep the phone app secure.
Our background is in Asp.Net web development and we could not see any examples that uses Hybrid mobile app development along with forms authentication,that makes me wonder if we are in the wrong track.
We implemented CORS along with WithCredentials both on Angular and Web API side, and the authentication piece seems to work fine for all subsequent calls in debug mode.
Do we need to take additional steps for security ,since its a phone app ?
Edit: I was reading about bearer token authentication with Web Api, is this a recommended way to go with phone apps ?
Thanks !
Yes my recommendation is to go with bearer tokens not with forms authentication.
You need to use OAuth 2.0 Resource Owner Credentials Flow which means that end-user provides the username/password only once for a specific endpoint i.e(/token) and then if the username/password valid you obtain something called Bearer Access Token.
This token is valid for specified period and you can configure this in your Web API. Once you obtain the access token, you need to store it securely in your android/hybrid app, then you keep sending it with each request to your web api protected end points using the Authorization header (Bearer scheme). I've written very detailed post which covers your scenario 100%. Please check the post Token Based Authentication and another one for authentication with AngularJS authentication which should work with your case. Let me know if you need further help.

Resources