Lägga till autentisering i .NET MAUI-appen

Not

Den här produkten har dragits tillbaka. En ersättning för projekt som använder .NET 8 eller senare finns i Community Toolkit Datasync-biblioteket.

I den här självstudien lägger du till Microsoft-autentisering i TodoApp-projektet med hjälp av Microsoft Entra-ID. Innan du slutför den här självstudien kontrollerar du att du har skapat projektet och distribuerat serverdelen.

Dricks

Även om vi använder Microsoft Entra-ID för autentisering kan du använda valfritt autentiseringsbibliotek som du vill med Azure Mobile Apps.

Lägga till autentisering i serverdelstjänsten

Din serverdelstjänst är en standardtjänst ASP.NET 6. Alla självstudier som visar hur du aktiverar autentisering för en ASP.NET 6-tjänst fungerar med Azure Mobile Apps.

Om du vill aktivera Microsoft Entra-autentisering för din serverdelstjänst måste du:

• Registrera ett program med Microsoft Entra-ID.
• Lägg till autentiseringskontroll i ASP.NET 6-serverdelsprojektet.

Registrera programmet

Registrera först webb-API:et i din Microsoft Entra-klientorganisation och lägg till ett omfång genom att följa dessa steg:

1. Logga in på Azure-portalen.

2. Om du har åtkomst till flera klienter använder du Kataloger + prenumerationer filtrera på den översta menyn för att växla till den klientorganisation där du vill registrera programmet.

3. Sök efter och välj Microsoft Entra ID.

4. Under Hanteraväljer du Appregistreringar>Ny registrering.

   • Namn: ange ett namn för ditt program; till exempel Snabbstart för TodoApp. Användare av din app ser det här namnet. Du kan ändra det senare.
   • Kontotyper som stöds: Konton i valfri organisationskatalog (Alla Microsoft Entra-kataloger – Multitenant) och personliga Microsoft-konton (t.ex. Skype, Xbox)

5. Välj Registrera.

6. Under Hanteraväljer du Exponera ett API>Lägg till ett omfång.

7. För program-ID-URIaccepterar du standardinställningen genom att välja Spara och fortsätta.

8. Ange följande information:

   • Omfångsnamn: access_as_user
   • Vem kan samtycka?: administratörer och användare
   • Visningsnamn för administratörsmedgivande: Access TodoApp
   • Beskrivning av administratörsmedgivande: Allows the app to access TodoApp as the signed-in user.
   • Visningsnamn för användarmedgivande: Access TodoApp
   • Beskrivning av användarmedgivande: Allow the app to access TodoApp on your behalf.
   • state: Enabled

9. Välj Lägg till omfång för att slutföra omfångstillägget.

10. Observera värdet för omfånget, ungefär som api://<client-id>/access_as_user (kallas Web API-omfång). Du behöver omfånget när du konfigurerar klienten.

11. Välj Översikt.

12. Observera application(client) ID i avsnittet Essentials (kallas Web API Application ID). Du behöver det här värdet för att konfigurera serverdelstjänsten.

Öppna Visual Studio och välj det TodoAppService.NET6 projektet.

1. Högerklicka på projektet TodoAppService.NET6 och välj sedan Hantera NuGet-paket....

2. På den nya fliken väljer du Bläddraoch anger sedan Microsoft.Identity.Web i sökrutan.

   

3. Välj Microsoft.Identity.Web-paketet och tryck sedan på Installera.

4. Följ anvisningarna för att slutföra installationen av paketet.

5. Öppna Program.cs. Lägg till följande i listan över using-instruktioner:

using Microsoft.AspNetCore.Authentication.JwtBearer;
using Microsoft.Identity.Web;

6. Lägg till följande kod direkt ovanför anropet till builder.Services.AddDbContext():

builder.Services.AddAuthentication(JwtBearerDefaults.AuthenticationScheme)
  .AddMicrosoftIdentityWebApi(builder.Configuration);
builder.Services.AddAuthorization();

7. Lägg till följande kod direkt ovanför anropet till app.MapControllers():

app.UseAuthentication();
app.UseAuthorization();

Din Program.cs bör nu se ut så här:

using Microsoft.AspNetCore.Datasync;
using Microsoft.EntityFrameworkCore;
using Microsoft.AspNetCore.Authentication.JwtBearer;
using Microsoft.Identity.Web;
using TodoAppService.NET6.Db;
  
var builder = WebApplication.CreateBuilder(args);
var connectionString = builder.Configuration.GetConnectionString("DefaultConnection");
  
if (connectionString == null)
{
  throw new ApplicationException("DefaultConnection is not set");
}
  
builder.Services.AddAuthentication(JwtBearerDefaults.AuthenticationScheme)
  .AddMicrosoftIdentityWebApi(builder.Configuration);
builder.Services.AddAuthorization();
builder.Services.AddDbContext<AppDbContext>(options => options.UseSqlServer(connectionString));
builder.Services.AddDatasyncControllers();
  
var app = builder.Build();
  
// Initialize the database
using (var scope = app.Services.CreateScope())
{
  var context = scope.ServiceProvider.GetRequiredService<AppDbContext>();
  await context.InitializeDatabaseAsync().ConfigureAwait(false);
}
  
// Configure and run the web service.
app.UseAuthentication();
app.UseAuthorization();
app.MapControllers();
app.Run();

8. Redigera Controllers\TodoItemController.cs. Lägg till ett [Authorize] attribut i klassen. Klassen bör se ut så här:

using Microsoft.AspNetCore.Authorization;
using Microsoft.AspNetCore.Datasync;
using Microsoft.AspNetCore.Datasync.EFCore;
using Microsoft.AspNetCore.Mvc;
using TodoAppService.NET6.Db;

namespace TodoAppService.NET6.Controllers
{
  [Authorize]
  [Route("tables/todoitem")]
  public class TodoItemController : TableController<TodoItem>
  {
    public TodoItemController(AppDbContext context)
      : base(new EntityTableRepository<TodoItem>(context))
    {
    }
  }
}

9. Redigera appsettings.json. Lägg till följande block:

  "AzureAd": {
    "Instance": "https://login.microsoftonline.com",
    "ClientId": "<client-id>",
    "TenantId": "common"
  },

Ersätt <client-id> med web-API-program-ID:t som du registrerade tidigare. När det är klart bör det se ut så här:

{
  "AzureAd": {
    "Instance": "https://login.microsoftonline.com",
    "ClientId": "<client-id>",
    "TenantId": "common"
  },
  "ConnectionStrings": {
    "DefaultConnection": "Server=(localdb)\\mssqllocaldb;Database=TodoApp;Trusted_Connection=True"
  },
  "Logging": {
    "LogLevel": {
      "Default": "Information",
      "Microsoft.AspNetCore": "Warning"
    }
  },
  "AllowedHosts": "*"
}

Publicera tjänsten till Azure igen:

1. Högerklicka på projektet TodoAppService.NET6 och välj sedan Publicera....
2. Välj knappen Publicera i det övre högra hörnet på fliken.

Öppna en webbläsare för att https://yoursite.azurewebsites.net/tables/todoitem?ZUMO-API-VERSION=3.0.0. Observera att tjänsten nu returnerar ett 401 svar, vilket indikerar att autentisering krävs.

Registrera din app med identitetstjänsten

Microsoft Data Sync Framework har inbyggt stöd för alla autentiseringsprovider som använder en Json-webbtoken (JWT) i en rubrik i HTTP-transaktionen. Det här programmet använder Microsoft Authentication Library (MSAL) för att begära en sådan token och auktorisera den inloggade användaren till serverdelstjänsten.

Konfigurera ett internt klientprogram

Du kan registrera interna klienter för att tillåta autentisering till webb-API:er som finns i din app med hjälp av ett klientbibliotek, till exempel Microsoft Identity Library (MSAL).

1. I Azure-portalenväljer du Microsoft Entra-ID>Appregistreringar>Ny registrering.

2. På sidan Registrera ett program:

   • ange en Namn för din appregistrering. Du kanske vill använda namnet native-quickstart för att skilja den här från den som används av serverdelstjänsten.
   • Välj Konton i valfri organisationskatalog (Alla Microsoft Entra-kataloger – Multitenant) och personliga Microsoft-konton (t.ex. Skype, Xbox).
   • I omdirigerings-URI:
     • Välj offentlig klient (mobile & desktop)
     • Ange URL-quickstart://auth

3. Välj Registrera.

4. Välj API-behörigheter>Lägg till en behörighet>Mina API:er.

5. Välj den appregistrering som du skapade tidigare för serverdelstjänsten. Om du inte ser appregistreringen kontrollerar du att du har lagt till access_as_user omfång.

   

6. Under Välj behörigheterväljer du access_as_useroch sedan Lägg till behörigheter.

7. Välj autentisering>mobila program och skrivbordsprogram.

8. Markera kryssrutan bredvid https://login.microsoftonline.com/common/oauth2/nativeclient.

9. Markera kryssrutan bredvid msal{client-id}://auth (ersätt {client-id} med ditt program-ID).

10. Välj Lägg till URI-och lägg sedan till http://localhost i fältet för extra URI:er.

11. Välj Spara längst ned på sidan.

12. Välj Översikt. Anteckna program-ID(klient)-ID:t (kallas internt klientprogram-ID) eftersom du behöver det för att konfigurera mobilappen.

Vi har definierat tre omdirigerings-URL:er:

• http://localhost används av WPF-program.
• https://login.microsoftonline.com/common/oauth2/nativeclient används av UWP-program.
• msal{client-id}://auth används av mobila program (Android och iOS).

Lägga till Microsoft Identity Client i din app

Öppna den TodoApp.sln lösningen i Visual Studio och ange TodoApp.MAUI projektet som startprojekt. Lägg till Microsoft Identity Library (MSAL) i projektet TodoApp.MAUI:

Lägg till Microsoft Identity Library (MSAL) till plattformsprojektet:

1. Högerklicka på projektet och välj sedan Hantera NuGet-paket....

2. Välj fliken Bläddra.

3. Ange Microsoft.Identity.Client i sökrutan och tryck sedan på Retur.

4. Välj resultatet Microsoft.Identity.Client och klicka sedan på Installera.

   

5. Godkänn licensavtalet för att fortsätta installationen.

Lägg till det interna klient-ID:t och serverdelsomfånget i konfigurationen.

Öppna TodoApp.Data-projektet och redigera filen Constants.cs. Lägg till konstanter för ApplicationId och Scopes:

  public static class Constants
  {
      /// <summary>
      /// The base URI for the Datasync service.
      /// </summary>
      public static string ServiceUri = "https://demo-datasync-quickstart.azurewebsites.net";

      /// <summary>
      /// The application (client) ID for the native app within Microsoft Entra ID
      /// </summary>
      public static string ApplicationId = "<client-id>";

      /// <summary>
      /// The list of scopes to request
      /// </summary>
      public static string[] Scopes = new[]
      {
          "<scope>"
      };
  }

Ersätt <client-id> med det interna klientprogram-ID:t du fick när du registrerade klientprogrammet i Microsoft Entra-ID och <scope> med web-API-omfånget du kopierade när du använde Exponera ett API- när du registrerade tjänstprogrammet.

Öppna klassen MainPage.xaml.cs i projektet TodoApp.MAUI. Lägg till följande using-instruktioner:

using Microsoft.Datasync.Client;
using Microsoft.Identity.Client;
using System.Diagnostics;

Lägg till en ny egenskap i klassen MainPage:

public IPublicClientApplication IdentityClient { get; set; }

Justera konstruktorn så att den läser:

public MainPage()
{
    InitializeComponent();
    TodoService = new RemoteTodoService(GetAuthenticationToken);
    viewModel = new MainViewModel(this, TodoService);
    BindingContext = viewModel;
}

Lägg till metoden GetAuthenticationToken i klassen:

public async Task<AuthenticationToken> GetAuthenticationToken()
{
    if (IdentityClient == null)
    {
#if ANDROID
        IdentityClient = PublicClientApplicationBuilder
            .Create(Constants.ApplicationId)
            .WithAuthority(AzureCloudInstance.AzurePublic, "common")
            .WithRedirectUri($"msal{Constants.ApplicationId}://auth")
            .WithParentActivityOrWindow(() => Platform.CurrentActivity)
            .Build();
#elif IOS
        IdentityClient = PublicClientApplicationBuilder
            .Create(Constants.ApplicationId)
            .WithAuthority(AzureCloudInstance.AzurePublic, "common")
            .WithIosKeychainSecurityGroup("com.microsoft.adalcache")
            .WithRedirectUri($"msal{Constants.ApplicationId}://auth")
            .Build();
#else
        IdentityClient = PublicClientApplicationBuilder
            .Create(Constants.ApplicationId)
            .WithAuthority(AzureCloudInstance.AzurePublic, "common")
            .WithRedirectUri("https://login.microsoftonline.com/common/oauth2/nativeclient")
            .Build();
#endif
    }

    var accounts = await IdentityClient.GetAccountsAsync();
    AuthenticationResult result = null;
    bool tryInteractiveLogin = false;

    try
    {
        result = await IdentityClient
            .AcquireTokenSilent(Constants.Scopes, accounts.FirstOrDefault())
            .ExecuteAsync();
    }
    catch (MsalUiRequiredException)
    {
        tryInteractiveLogin = true;
    }
    catch (Exception ex)
    {
        Debug.WriteLine($"MSAL Silent Error: {ex.Message}");
    }

    if (tryInteractiveLogin)
    {
        try
        {
            result = await IdentityClient
                .AcquireTokenInteractive(Constants.Scopes)
                .ExecuteAsync();
        }
        catch (Exception ex)
        {
            Debug.WriteLine($"MSAL Interactive Error: {ex.Message}");
        }
    }

    return new AuthenticationToken
    {
        DisplayName = result?.Account?.Username ?? "",
        ExpiresOn = result?.ExpiresOn ?? DateTimeOffset.MinValue,
        Token = result?.AccessToken ?? "",
        UserId = result?.Account?.Username ?? ""
    };
}

Metoden GetAuthenticationToken() fungerar med Microsoft Identity Library (MSAL) för att få en åtkomsttoken som lämpar sig för att auktorisera den inloggade användaren till serverdelstjänsten. Den här funktionen skickas sedan till RemoteTodoService för att skapa klienten. Om autentiseringen lyckas skapas AuthenticationToken med data som krävs för att auktorisera varje begäran. Annars skapas en felaktig token som har upphört att gälla i stället.

Vi kan lägga till alla plattformsspecifika alternativ med hjälp av #if områden med en plattformsspecificerare. Android kräver till exempel att vi anger den överordnade aktiviteten, som skickas från samtalssidan.

Konfigurera Android-appen för autentisering

Skapa en ny klass Platforms\Android\MsalActivity.cs med följande kod:

using Android.App;
using Android.Content;
using Microsoft.Identity.Client;

namespace TodoApp.MAUI
{
    [Activity(Exported = true)]
    [IntentFilter(new[] { Intent.ActionView },
        Categories = new[] { Intent.CategoryBrowsable, Intent.CategoryDefault },
        DataHost = "auth",
        DataScheme = "msal{client-id}")]
    public class MsalActivity : BrowserTabActivity
    {
    }
}

Ersätt {client-id} med program-ID för den interna klienten (som är samma som Constants.ApplicationId).

Om ditt projekt är avsett för Android version 11 (API version 30) eller senare måste du uppdatera din AndroidManifest.xml för att uppfylla kraven på Android-paketsynlighet. Öppna Platforms/Android/AndroidManifest.xml och lägg till följande queries/intent noder i noden manifest:

<manifest>
  ...
  <queries>
    <intent>
      <action android:name="android.support.customtabs.action.CustomTabsService" />
    </intent>
  </queries>
</manifest>

Öppna MauiProgram.cs. Ta med följande using-instruktioner överst i filen:

using Microsoft.Identity.Client;

Uppdatera byggaren till följande kod:

    builder
        .UseMauiApp<App>()
        .ConfigureLifecycleEvents(events =>
        {
#if ANDROID
            events.AddAndroid(platform =>
            {
                platform.OnActivityResult((activity, rc, result, data) =>
                {
                    AuthenticationContinuationHelper.SetAuthenticationContinuationEventArgs(rc, result, data);
                });
            });
#endif
        })
        .ConfigureFonts(fonts =>
        {
            fonts.AddFont("OpenSans-Regular.ttf", "OpenSansRegular");
            fonts.AddFont("OpenSans-Semibold.ttf", "OpenSansSemibold");
        });

Om du gör det här steget när du har uppdaterat programmet för iOS lägger du till koden som anges av #if ANDROID (inklusive #if och #endif). Kompilatorn väljer rätt kod baserat på den plattform som kompileras. Den här koden kan placeras före eller efter det befintliga blocket för iOS.

När Android kräver autentisering hämtar den en identitetsklient och växlar sedan till en intern aktivitet som öppnar systemwebbläsaren. När autentiseringen är klar omdirigeras systemwebbläsaren till den definierade omdirigerings-URL:en (msal{client-id}://auth). MsalActivity hämtar omdirigerings-URL:en, som sedan växlar tillbaka till huvudaktiviteten genom att anropa OnActivityResult(). Metoden OnActivityResult() anropar MSAL-autentiseringshjälpen för att slutföra transaktionen.

Testa Android-appen

Ange TodoApp.MAUI som startprojekt, välj en Android-emulator som mål och tryck sedan på F5 för att skapa och köra appen. När appen startar uppmanas du att logga in på appen. Vid den första körningen uppmanas du att godkänna appen. När autentiseringen är klar körs appen som vanligt.

Testa Windows-appen

Ange TodoApp.MAUI som startprojekt, välj Windows Machine som mål och tryck sedan på F5 för att skapa och köra appen. När appen startar uppmanas du att logga in på appen. Vid den första körningen uppmanas du att godkänna appen. När autentiseringen är klar körs appen som vanligt.

Nästa steg

Konfigurera sedan programmet så att det fungerar offline genom att implementera ett offlinearkiv.

Ytterligare läsning

• snabbstart: Skydda ett webb-API med Microsofts identitetsplattform
• Konfigurationskrav och felsökningstips för Xamarin Android med MSAL.NET
• scenario: Mobilprogram som anropar webb-API:er