Given an Azure Function based API, setup to use App Service Authentication (Easy Auth)...
Authorization works as expected when using the browser because auth cookies are present e.g.
https://example.com/.auth/login/aad
then
Https://example.com/.auth/me
to prove and get the authenticated user json.
However, when programmatically trying to access the latter, e.g. using fetch a 401 (Unauthorised) as configured is returned.
It appears that when using the browser to navigate the authentication cookies are intrinsically used to establish authentication and the user data is returned.
What is the process for using that authentication programmatically in JS/TS from an application e.g. Svelte/React/Vue SPA?
Related
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).
I am currently following this user guide for adding a custom policy to my B2C sign up process
I have created the API and configured the various XML files. I can generate a token to access the API via the implict flow.
The API is secured under the app service with Azure Active Directory authentication.
The page linked to describes how to add basic authentication and a client ID / secret, which is a Client Credentials flow, so I was trying to test this in postman
However, having failed to get it to work I went looking and found a variety of posts stating implict credentials are not supported by Azure B2C?
If that is the case I'm puzzled how it is I'm supposed to ensure the claims of the API I am calling to carry out the business logic can be accessed by the custom policy?
My API is hosted on Azure in the same subscription. I can generate tokens for this API fine to use within my native / client app.
Please could someone advise how I should go about testing access to this API from a B2C context via Postman?
The page linked to describes how to add basic authentication and a client ID / secret, which is a Client Credentials flow, so I was trying to test this in postman
To be exact, it should not be called Client Credentials, because it isn't it.
It's just HTTP Basic authentication.
You are adding an alternative authentication method to your API in that case.
The fact that B2C does not support client credentials auth does not matter here.
What matters is that you have enabled AAD authentication on App Service.
This will block the calls that try to use Basic auth against your API.
Here are a couple options that you can do:
Disable authentication on the App Service and implement the two alternative authentication methods in your API code
Allow anonymous calls through from App Service auth and implement Basic auth for unauthenticated requests in your API code
As for testing from Postman, it should then be the same as testing any API supporting Basic authentication.
You don't authenticate against B2C, so there is nothing special about it.
I'm writing an AngularJS SPA application which calls Rest full web service. Back-end is being written on JAX-RS, deployed on Tomcat 7. I'm using HTTPS, SSL for transferring data from SPA to JAX-RS
requirements
I have to make LDAP authentication. (I will send username & password to web service and it should make authentication)
I have to do user's session management (because, when authenticated user sends request to web service, user doesn't have to authenticate again)
problems
I think there are two options for doing LDAP authentication:
Make LDAP authentication using core java http://docs.oracle.com/javase/jndi/tutorial/ldap/security/ldap.html
Use Spring security (I'm not familiar with it and not sure if it's possible. I think I should send username & password to rest service. Rest service will have spring security library injected and it'll be possible to use authentication functionality. Am I right?)
Manage user sessions. Once user is authenticated, it should be saved somewhere, so that user can do operations until its logon is not expired.
How can I do it?
Which way should I choose? How should I make LDAP authenticating and session management?
Can anyone give any suggestion or example links?
So,
LDAP Authentication using JNDI works just fine, you could also use the neat UnboundID LDAP Java API. A simple LDAP Bind example can be found here: https://code.google.com/p/ldap-sample-code/source/browse/trunk/src/main/java/samplecode/bind/SimpleBindExample.java .
Note also that you could use a Node.JS module as your backend, the Passport.JS Authentication framework for example, provides lots of features/capabilities relative to authentication and Federation (i.e., do things like 'Login with Google', etc...). See: passportjs.org.
On the Angular/frontend side,your best bet is to use a JWT token. It's all explained in detail with examples here: http://code.tutsplus.com/tutorials/token-based-authentication-with-angularjs-nodejs--cms-22543.
In essence:
your backend Authentication REST should return a JWT Token in the response, once the user successfully binds to LDAP. This Token would contain some user data, and should be encrypted (see link above).
Your Angular App should set that token as a cookie on the client Browser ("set-cookie" response header) upon successful login (so in the Controller of your Login view).
The Client will then present that cookie/JWT Token on every request it makes to your app.
Your app will then need to validate the token presented on every request (in the controller of your SPA). You may also want to add the user authentication data to your $scope so you can use it in your view.
Hope it helps...
I have tried following several ADAL (Azure AD Authentication Library) examples to get my WPF application to call an Azure secured Web API. Everything appears to work fine. I receive the login prompt, it accepts my credentials, I'm able to acquire a token. I attach the token to my request but the request always returns the HTML for the Azure login page as if I'm not authenticated.
Has anyone else experienced this type of issue? Are there certain things I should be checking for?
I think you are securing your API using a redirect based protocol instead of the oauth bearer. For a discussion on the differences between the two see http://www.cloudidentity.com/blog/2014/04/22/authentication-protocols-web-ux-and-web-api/.
The canonical WPF sample is in https://github.com/AzureADSamples/NativeClient-DotNet. See how the web API is secured.
What do you think about this approach?
1. A single server for OAuth authentication and resource server, based on dotnetopenauth.
2. Silverlight and javasrcipt interaction to access the OAuth Authorization endpoint.
e.g
Login button in silverlight page calls a javascript function to access the Authorization endpoint in server using implicit grant.
Server redirects to login page.
User selects open id provider, login, and approve application request to access user's openid.
User access the OAuth Authorization endpoint.
Server redirect user to silverlight page again with access token in url fragment.
javascript parses the url fragment to get the access token
when silverlight page is loaded, silverlight app calls javascript function to get the accesstoken.
Silverlight uses the access token to access the resources.
Seems reasonable to me. :)
DotNetOpenAuth won't run in Silverlight, but OAuth2 clients are very simple anyway, so I don't think that should hold you back.