Update /web-app-aspnet to Microsoft.Identity.Web v2 (Azure-Samples#61)

* web-app-identity-web-2

* PR-feedback-and-README-clearup

* entra-link

web-app-aspnet/Pages/Index.cshtml.cs

@@ -1,8 +1,7 @@
-using System.Net;
-using System.Text.Json;
-using Microsoft.AspNetCore.Mvc;
+using System.Text.Json;
 using Microsoft.AspNetCore.Mvc.RazorPages;
 using Microsoft.Identity.Web;
+using Microsoft.Identity.Abstractions;
 
 namespace sign_in_webapp.Pages;
 
@@ -11,18 +10,18 @@ public class IndexModel : PageModel
 {
     private readonly ILogger<IndexModel> _logger;
 
-    private readonly IDownstreamWebApi _downstreamWebApi;
+    private readonly IDownstreamApi  _downstreamWebApi;
 
     public IndexModel(ILogger<IndexModel> logger,
-                        IDownstreamWebApi downstreamWebApi)
+                        IDownstreamApi  downstreamWebApi)
     {
         _logger = logger;
         _downstreamWebApi = downstreamWebApi;
     }
 
     public async Task OnGet()
     {
-        using var response = await _downstreamWebApi.CallWebApiForUserAsync("DownstreamApi").ConfigureAwait(false);
+        using var response = await _downstreamWebApi.CallApiForUserAsync("DownstreamApi").ConfigureAwait(false);
         if (response.StatusCode == System.Net.HttpStatusCode.OK)
         {
             var apiResult = await response.Content.ReadFromJsonAsync<JsonDocument>().ConfigureAwait(false);

web-app-aspnet/Program.cs

@@ -9,9 +9,10 @@
 WebApplicationBuilder builder = WebApplication.CreateBuilder(args);
 IEnumerable<string>? initialScopes = builder.Configuration["DownstreamApi:Scopes"]?.Split(' ');
 
+
 builder.Services.AddMicrosoftIdentityWebAppAuthentication(builder.Configuration, "AzureAd")
     .EnableTokenAcquisitionToCallDownstreamApi(initialScopes)
-        .AddDownstreamWebApi("DownstreamApi", builder.Configuration.GetSection("DownstreamApi"))
+        .AddDownstreamApi("DownstreamApi", builder.Configuration.GetSection("DownstreamApi"))
         .AddInMemoryTokenCaches();
 // </ms_docref_add_msal>
 

web-app-aspnet/README.md

@@ -10,51 +10,59 @@ products:
 - azure
 - azure-active-directory
 - ms-graph
-- microsoft-identity-platform
 urlFragment: ms-identity-docs-code-csharp-sign-in
 ---
 
 # ASP.NET Core 6.0 Web App - Sign-in user | Microsoft identity platform
 
-The web app in this scenario has been created using the ASP.NET Core 6.0 Razor template, and slightly modified to add authentication enabling the users sign-in that follows the [Open Id Connect](https://docs.microsoft.com/en-us/azure/active-directory/develop/v2-protocols-oidc) standard protocol. To lite up Open Id, it is using [ASP.NET Core Identity](https://docs.microsoft.com/en-us/aspnet/core/security/authentication/identity?view=aspnetcore-6.0) middlewares.  In other words, a simple web app is secured by adding an authentication layer allowing users to sign-in with their Work and school (Azure AD) accounts, and as a result it can make web API calls to protected resources on behalf of the signed-in user.
+This web app, built with ASP.NET Core 6.0 Razor, has added sign-in features. It uses the [Open Id Connect](https://docs.microsoft.com/en-us/entra/identity-platform/v2-protocols-oidc) and [ASP.NET Core Identity](https://docs.microsoft.com/en-us/aspnet/core/security/authentication/identity?view=aspnetcore-6.0) for authentication. This allows users to sign in with their Microsoft Entra ID accounts. Once signed in, the app can access protected resources on the user’s behalf.
 
-![A screenshot of an ASP.NET Core 6.0 Web App displaying a response from Microsoft Graph.](./app-signedin.png)
+## Quickstart and tutorial guides for this sample
 
-> :page_with_curl: This sample application backs one or more technical articles on docs.microsoft.com. <!-- TODO: Link to first tutorial in series when published. -->
+- For a quickstart experience that gets you started fast, see [Quickstart: Sign in users and call the Microsoft Graph API from an ASP.NET Core web app](https://docs.microsoft.com/entra/identity-platform/tutorial-web-app-dotnet-register-app).
+
+- For a in-depth tutorial that walks you through this sample from start to finish, see [Tutorial: Sign in users and call the Microsoft Graph API from an ASP.NET Core web app](https://docs.microsoft.com/entra/identity-platform/tutorial-web-app-dotnet-register-app).
 
 ## Prerequisites
 
-- An Azure Active Directory (Azure AD) tenant. You can [open an Azure account for free](https://azure.microsoft.com/free) to get an Azure AD instance.
-- [.NET 6.0 SDK](https://dotnet.microsoft.com/download/dotnet/6.0)
+- An Azure account with an active subscription. If you don't already have one, [Create an account for free](https://azure.microsoft.com/free/?WT.mc_id=A261C142F).
+- [.NET SDK 6.0](https://dotnet.microsoft.com/download)
 
 ## Setup
 
 ### 1. Register the web API application in your Azure Active Directory
 
-First, complete the steps in [Register an application with the Microsoft identity platform](https://docs.microsoft.com/azure/active-directory/develop/quickstart-register-app) to register the sample app.
+First, complete the steps in [Register an application with the Microsoft identity platform](https://docs.microsoft.com/entra/identity-platform/tutorial-web-app-dotnet-register-app) to register a web application in the Microsoft identity platform.
 
 Use the following settings for your app registration:
 
 | App registration <br/> setting | Value for this sample app                          | Notes                                                                                                       |
 |:------------------------------:|:---------------------------------------------------|:------------------------------------------------------------------------------------------------------------|
-| **Name**                       | `active-directory-dotnet-webapp-aspnetcore`        | Suggested value for this sample. <br/> You can change the app name at any time.                             |
-| **Supported account types**    | **My organization only**                           | Required for this sample. <br/> Support for the Single tenant.                                              |
-| **Platform type**              | `Web`                                              | Required value for this sample. <br/> Enables the required and optional settings for the app type.          |
-| **Redirect URIs**              | `https://localhost:5001/signin-oidc`               | Required value for this sample. <br/> You can change that later in your own implementation.                 |
-| **Front-channel logout URL**   | `https://localhost:5001/signout-oidc`              | Required value for this sample. <br/> You can change that later in your own implementation.                 |
-| **Client secret**              | _Value shown in Azure portal_                      | :warning: Record this value immediately! <br/> It's shown only _once_ (when you create it).                 |
+| **Name**                      | `identity-client-web-app`                          | Suggested value for this sample. <br/> You can change the app name at any time.                           |
+| **Supported account types**   | **My organization only**                           | Required for this sample. <br/> Support for the Single tenant.                         |
+| **Platform type**             | `Web`                                              | Required value for this sample. <br/> Enables the required and optional settings for the app type.               |
+| **Redirect URIs**             | `https://localhost:5001/signin-oidc`               | Required value for this sample.|
+| **Front-channel logout URL**  | `https://localhost:5001/signout-oidc`              | Required value for this sample.|
+| **CertificateThumbprint**     | _Value shown in Microsoft Entra admin center_      | Required value for this sample.|
 
-> :information_source: **Bold text** in the table matches (or is similar to) a UI element in the Azure portal, while `code formatting` indicates a value you enter into a text box or select in the Azure portal.
+> :information_source: **Bold text** in the table matches (or is similar to) a UI element in the [Microsoft Entra admin center](https://entra.microsoft.com/#home), while `code formatting` indicates a value you enter into a text box or select in the Microsoft Entra admin center.
 
 ### 2. Configure the web app
 
 1. Open the _~/sign-in-webapp/WebApp.csrpoj_ in your code editor.
 1. Open the _appsettings.json_ file and modify the following code:
 
     ```json
-    "TenantId": "[Enter 'common', or 'organizations' or the Tenant ID (Obtained from the Azure portal. Select 'Endpoints' from the 'App registrations' blade and use the GUID in any of the URLs), e.g. da41245a5-11b3-996c-00a8-4d99re19f292]",
-    "ClientId": "[Enter the Client Id (Application ID obtained from the Azure portal), e.g. ba74781c2-53c2-442a-97c2-3d60re42f403]",
-    "ClientSecret": "[Copy the client secret added to the app from the Azure portal]",
+      "Instance": "https://login.microsoftonline.com/",
+      "TenantId": "Enter the tenant ID obtained from the Microsoft Entra Admin Center",
+      "ClientId": "Enter the client ID obtained from the Microsoft Entra Admin Center",
+      "ClientCertificates": [
+        {
+          "SourceType": "StoreWithThumbprint",
+          "CertificateStorePath": "CurrentUser/My",
+          "CertificateThumbprint": "Enter the certificate thumbprint obtained the Microsoft Entra Admin Center"
+        }   
+      ],
     ```
 
 ## Run the application
@@ -67,14 +75,16 @@ Use the following settings for your app registration:
    dotnet run
    ```
 
-### 2. Signin into the web app
+### 2. Sign in to the web app
 
 1. Once the web app is listening, navigate to https://localhost:5001
 1. Sign-in with your user credentials.
 
-### 3. Signout
+![A screenshot of an ASP.NET Core 6.0 Web App displaying a response from Microsoft Graph.](./media/app-signedin.png)
+
+### 3. Sign out
 
-1. Click Sign out
+1. Select Sign out
 
 ![A screenshot of an ASP.NET Core 6.0 Web App indicating the user signed-out and allowing click "Sign in" to signin again.](./app-signedout.png)
 

web-app-aspnet/WebApp.csproj

@@ -9,8 +9,9 @@
   </PropertyGroup>
 
   <ItemGroup>
-    <PackageReference Include="Microsoft.Identity.Web" Version="1.*" />
-    <PackageReference Include="Microsoft.Identity.Web.UI" Version="1.*" />
+    <PackageReference Include="Microsoft.Identity.Web" Version="2.*" />
+    <PackageReference Include="Microsoft.Identity.Web.UI" Version="2.*" />
+    <PackageReference Include="Microsoft.Identity.Web.DownstreamApi" Version="2.16.1" />
   </ItemGroup>
 
 </Project>

web-app-aspnet/appsettings.json

@@ -1,20 +1,23 @@
 {
-  "AzureAd": {
-    "Instance": "https://login.microsoftonline.com/",
-    "TenantId": "Enter the tenant ID obtained from the Azure portal",
-    "ClientId": "Enter the client ID obtained from the Azure portal",
-    "ClientCertificates": [
-      {
-        "SourceType": "StoreWithThumbprint",
-        "CertificateStorePath": "CurrentUser/My",
-        "CertificateThumbprint": "Enter the certificate thumbprint obtained from the Azure portal"
-      }   
-    ],
-    "CallbackPath": "/signin-oidc"
-  },
+"AzureAd": {
+  "Instance": "https://login.microsoftonline.com/",
+  "TenantId": "Enter the tenant ID obtained from the Microsoft Entra Admin Center",
+  "ClientId": "Enter the client ID obtained from the Microsoft Entra Admin Center",
+  "ClientCertificates": [
+    {
+      "SourceType": "StoreWithThumbprint",
+      "CertificateStorePath": "CurrentUser/My",
+      "CertificateThumbprint": "Enter the certificate thumbprint obtained the Microsoft Entra Admin Center"
+    }   
+  ],
+  "CallbackPath": "/signin-oidc"
+},
   "DownstreamApi": {
-    "BaseUrl": "https://graph.microsoft.com/v1.0/me",
-    "Scopes": "user.read"
+    "BaseUrl": "https://graph.microsoft.com/v1.0/",
+    "RelativePath": "me",
+    "Scopes": [ 
+      "user.read" 
+    ]
   },
   "Logging": {
     "LogLevel": {