Blazor WASM using Azure AD B2C fails calling Microsoft.Graph api - azure-ad-b2c

Situation:
Hosted Blazor WASM using Azure AD B2C
Graph API registerd
Step 1 is working fine I can login and I get an access token with the correct claims so I can call my backend API.
When I turn on Step 2 so adding the GraphServiceClient then all stops working and login fails with the following error: There was an error trying to log you in: ''. I have the idea that adding the scope https://graph.microsoft.com/User.Read is causing the login to fail. I have the idea it is because that scope is not defined in my SPA app registration in my Azure AD B2C tenant, but I don't see how I can add that scope. Under Api permissions I can't add that scope.
Am I missing something?

I found out it is not possible to use the Graph API directly from Blazor WASM when using Azure AD B2C for authentication. This is only enabled for Azure AD.
To get around this problem you will have to make protected endpoints in your backend controllers and call the MS Graph API from there using clientid+secret credentials and send them back to the webassembly client.
For performance reasons and preventing the extra overhead of querying the MS Graph API you could consider caching the users in your own backend.

Related

Azure B2C Authentication without user

We use an Azure AD B2C Api. The user authentication via Angular Frontend works fine.
Now, we created a separate BackgroundService project (.net core 3.0) that needs to access the api, too. The service runs without a user authentication.
In a standard Azure AD Api I would authenticate the service by using ClientId and Secret.
How can I authenticate the service against the B2C Api without user authentication?
Client credential flow is not currently supported by Azure AD B2C. See Current limitations.
It seems that the article is not very clear and confuses some customers. But the author has provided more details in the answer.

Azure AD B2C issues referencing another AD App: Select API drop down is always empty

I'm using this sample as a starting point: https://github.com/Azure-Samples/active-directory-b2c-javascript-msal-singlepageapp/
But instead of calling an existing API I'm trying to call graph.
The actual issue I'm running into is that when I go to reference any API/APP in my B2C app there are no options under 'Select API'
What I am trying to reference is a AD App I created that has access to Graph.
I tried a number of the suggestions listed here: Azure AD Application not appearing in existing AD App list for an Azure web application
Including adding myself as the owner of the AD App, but I can't make it appear in AD B2C.
I've also tried signin in and out and I've tried a couple different browsers just in case.
My B2C tenant isn't linked to a subscription so that could be the issue but I'm not sure why since both my AD B2C and my AD App live in the same tenant.
Access can only be granted from one Azure AD B2C-registered application, i.e. the client application, to another Azure AD B2C-registered application, i.e. the resource application.
The Graph API is not an Azure AD B2C-registered application.
Alternatively, you'll either have to implement a backend for the frontend, where it's the backend application that integrates with the Graph API or implement a custom policy that interacts with it.
If you want to call you need to register an application in azure ad tenant. And azure b2c cannot find the application which has graph api permissions. Because it is not in your b2c tenant. Regarding how to call graph api, please refer to https://learn.microsoft.com/en-us/azure/active-directory-b2c/active-directory-b2c-devquickstarts-graph-dotnet

Azure B2C setup

I'm trying to set up Azure AD B2C for my web app.
I've already created a tenant. I then created an app. According to articles I'm following, I should then be able to click "API Access" and add scopes. In my case, there's nothing under API drop down:
I already see "Access the user's profile" with the following selected:
Under "Published Scopes", again, I see nothing:
What am I missing here?
UPDATE:
After adding the App ID URI, I was able to move forward a bit but still not sure about published scopes. This is what I currently have:
And under API Access, this is what I have:
Basically, the behavior I'm getting on my frontend app which is built on ReactJs is that I hit the Azure AD B2C login. After entering my credentials, I get redirected to my app. I see id_token in the URL but the MSAL library I'm using doesn't capture the token -- I have a break point in my React code to see if I'm capturing the token. I get sent back to the login screen on Azure, then back to my app. On the third one, I actually see the token being captured but I end up with the following errors:
I'm using this library which is a wrapper for the MSAL.js library: https://github.com/jamesrandall/react-azure-adb2c
I'm pretty certain there are config errors. Just not sure what they are.
API access is used to assign access from a web app to an API app.
Published scopes is used to register the access scopes for the API app.
Before the access scopes can be registered for the API app, an App ID URI must be set as the resource identifier for the API app, as described by the Azure Active Directory B2C: Register your application article.

Request Access Token in Postman for Azure Function App protected by Azure AD B2C

I have an AspNetCore 2.0 MVC web API secured by an Azure Active Directory B2C tenant. I have been able to use Postman to test the API end points by following this SO posting: Request Access Token in Postman for Azure AD B2C (in particular, the Microsoft documented steps referenced in SpottedMahn's comments:
https://learn.microsoft.com/en-us/aspnet/core/security/authentication/azure-ad-b2c-webapi#use-postman-to-get-a-token-and-test-the-api )
Now, I am working on a serverless version of the above - the app is pretty much identical expect that the endpoints have been implemented by Azure functions in an Azure Functions App
The Functions App has Authentication on, Log in with Azure Active Directory and the following settings:
This is how i have set up the Application in the Azure B2C tenant:
If I access the functions endpoint via a browser, I get successfully routed to the Azure AD B2C login page and can log in, then see the results from the API endpoint. So I'm pretty confident all is good w.r.t. the Azure AD B2C <-> Function App configuration.
However, I can't use the Request Access Token technique linked above to get a token and inspect the endpoint in Postman
If I take the token obtained after authentication (for example by using fiddler and observing the id_token being returned), and in Postman I choose Bearer authentication and supply that id_token, then Postman successfully hits my endpoint. However, if I follow the steps in the linked document above, I do get the "login" popup and then do get a valid [looking] token, but when I click Use Token and run the request, I get
You do not have permission to view this directory or page.
I'd really like to be able to request an access token from postman just like I can with my aspnetcore 2.0 app (really just for the consistency so I don't have to remember lots of different techniques). Is that possible for Azure Function Apps and if so, any clues what I'm doing wrong in the above?
Ah I stumbled upon it. I fixed it by adding the Postman API client id (note: the postman API client id, not the postman App client id) [those references will make sense in the context of the Microsoft how-to linked above], under "ALLOWED TOKEN AUDIENCES" (visible in screenshot in question above).

Manage user from Azure AD B2C using AD Graph API - secure access

We are building a Xamarin Native mobile apps and using Azure AD B2C for authenticating users using their social logins.
We decided use MSAL native library (Xamarin) for authenticating using B2C. And our mobile app required to manage(full access) the signed-in user profile. Since this feature isn't available in MSAL we have decided to go with ADAL for the time being. Followed the instruction provided in the link below and the sample works. But I started experimenting by deleting the API access provided in the application (created in b2c tenant) and the ran the application with "Get-user" parameter. And the application is still able to get the users from AD. Not sure how secure is this thing?
Then deleted the application key from the B2c tenant application and ran the console application sample. And received an error AADSTS70002: Error validating credentials. AADSTS50012: Invalid client secret is provided.
Trace ID: cef09957-06bf-462e-a0c3-4ed6bae11e00
Correlation ID: afab126d-8694-479a-8a21-c12eb7cb176c
https://learn.microsoft.com/en-us/azure/active-directory-b2c/active-directory-b2c-devquickstarts-graph-dotnet
Any Idea why this is happening. I would like to implement this on a xamarin.ios app and any guidance much appreciated.
The answer to this is very similar to the answer to your other question: Exception access Azure AD B2C using ADAL library for user management, which can be summarized as:
Azure AD B2C does not yet support delegated permissions to the Azure AD or Microsoft Graph. The correct way to work around this limitation at this time is to have your native client application call a web API (using MSAL) which would in turn call the Graph API (using ADAL). This web API is an API you build which has authorization logic to scope the user management operations.
Once user management in Azure AD B2C is supported via the Microsoft Graph, you won't need this API and will be able to use delegated permissions (vs application permissions using client credentials) to have your native client application talk directly to the Microsoft Graph. In the interim, you'll have to stand up your own Web API as per the guidance above.
UPDATE: the Azure AD v2.0 endpoint and Microsoft Graph API now support client credentials flow, so you can also use MSAL for your Microsoft Graph API calls. However if you need to call the Azure AD Graph, then you will still need to use ADAL.

Resources