Clarify and enhance B2C client side + web API set-up documentation

[plettb]

This is an excellent example, and works exactly the way I want my application to work. However, try as I might I simply can't get my configuration to work the same way. Is there any chance there the configuration of the "fabrikamb2c" could be documented?

There is a similar request on another sample project here, but it was eventually closed, still without sufficient detail.

Any help on this would be MUCH appreciated!

Thanks!
Brad.

[jennyf19]

@plettb thanks for the feedback. Does this documentation help get you started? It walks you through how to set up your own b2c tenant.

[plettb]

Does this documentation help get you started?

No, sadly, it doesn't. I'm having no trouble setting up the B2C tenant, and it mostly works, but there is clearly somethings subtly different. For example when I use my own tenant and run on
Android, login appears to work, but then it never returns to the app. I know I'm close because it does return when running the UWP version.

I think it's likely screenshots of some of the important screens (e.g. the app registration's "Authentication" page might show the minor difference that I can't seem to find.

[jennyf19]

@plettb i see. so it's just with getting the sample working with your specific b2c tenant. Thanks for clarifying that.
Are you running the sample as-is...meaning you are just replacing the variable values with your own?

[plettb]

Are you running the sample as-is...meaning you are just replacing the variable values with your own?

Yes, the only thing I'm changing is "B2CConstants". That way, in theory, if I've set up my B2C tenant, together with the app registrations, etc., correctly mine should run identically.

(Well, when trying to get the API call working, I'm also having to change the endpoint URL in "App.xaml.cs". That endpoint should be moved into "B2CConstants", in my opinion, but that's very minor. If/when I get this working, I'll gladly create a pull request for that.)

[jennyf19]

@plettb Yes, a PR to fix that would be great. thanks!

For Android, in the AndroidManifest.xml, you'll need to change the scheme value to be your clientId:
<data android:scheme="msal[your_client_id]" android:host="auth" />

this should work now for Android.

[plettb]

@plettb Yes, a PR to fix that would be great. thanks!

The problem is that I'd find it difficult to fix only that issue. If/when I get time I'll do that, but also address one of the other issues in this branch: attempt to implement MVVM.

For Android, in the AndroidManifest.xml, you'll need to change the scheme value to be your clientId:
<data android:scheme="msal[your_client_id]" android:host="auth" />

In the infamous words of Homer Simpson... D'oh!!! Well, I was sure it was something simple, and at least on that score I was right. Still... that feels like a rookie mistake on my part. Thanks a LOT, @jennyf19!!!

On an unrelated note, but I don't think I should raise this as an "issue", per se... Any idea why debugging the UWP app doesn't work properly for me? This works for the Android version, but with the UWP version I can debug the code in the UWP project, but it won't jump to the code in the core project.

[jennyf19]

@plettb glad you got it sorted out! thanks for the quick reply.

@bgavrilMS can you assist on the debugging in UWP issue @plettb mentions above?

[jennyf19]

@plettb also, take your time on the PR(s), we appreciate any outside contribution.

[plettb]

Apparently I wasn't quite as close as I thought. Whereas the authentication against my own B2C tenant appears to be working, it's not actually providing an access token that can be used for subsequent calls. Once again I'm curious how "fabrikamb2c" is different from my configuration. Why does it return a token and mine doesn't?!?

[jennyf19]

@plettb In the sample, we have a mobile client, which is calling the node js web api (protected resource).

Because we follow the OAuth2.0 protocol, which is to gain access to protected resources through scoped access tokens, the node js web api exposes some scopes:

Then with the mobile client, in the portal, we've given it permission to the node js web api by configuring the API permissions:

Then in the code, you set the API endpoint:
public static string ApiEndpoint = "https://fabrikamb2chello.azurewebsites.net/hello";
and scopes:
public static string[] Scopes = { "https://fabrikamb2c.onmicrosoft.com/helloapi/demo.read" };
Then, when you acquire a token interactively you tell MSAL, "I want an access token for these scopes to this resource". Then the user will get a sign-in dialogue and he/she will consent for those scopes. The B2C authorization server will then issue you an Access Token for the protected resource. But the trust relationship between the protected resource (web api) and the mobile app happens in the portal. That's why you have both registered in the portal.

So if you're not getting an Access Token back, it usually because the web api is not registered correctly, or it's not exposing scopes, or the mobile client is sending the wrong value for the scopes, so the authorization server will not issue a token.

Sorry for the long answer, but hopefully that helps.

[plettb]

@jennyf19 Thank-you SO MUCH!!! It was, indeed, a "scope" thing, and I was able to get it working!

I find this a bit strange, but it didn't prevent me from getting it working. In the "fabrikamb2c" configuration page you show above, notice this:

In my test environment, I get this:

I've found no way of changing "Admins only" to "Admins and users", but fortunately it doesn't seem to matter.

Now my intentions are to document all of this. What I'm not sure about is whether this issue should be closed now, or only after I provide a document from the wiki. Thoughts?

Thanks again!!!