Přidání ověřování do aplikace .NET MAUI

Článek
01/16/2024

V tomto kurzu přidáte ověřování Microsoftu do projektu TodoApp pomocí ID Microsoft Entra. Před dokončením tohoto kurzu se ujistěte, že jste vytvořili projekt a nasadili back-end.

Tip

I když pro ověřování používáme ID Microsoft Entra, můžete v Azure Mobile Apps použít libovolnou knihovnu ověřování, kterou si přejete.

Přidání ověřování do back-endové služby

Vaše back-endová služba je standardní služba ASP.NET 6. Všechny kurzy, které ukazují, jak povolit ověřování pro službu ASP.NET 6, funguje s Azure Mobile Apps.

Pokud chcete povolit ověřování Microsoft Entra pro vaši back-endovou službu, musíte:

Registrace aplikace pomocí Microsoft Entra ID.
Přidejte kontrolu ověřování do back-endového projektu ASP.NET 6.

Registrace aplikace

Nejprve zaregistrujte webové rozhraní API v tenantovi Microsoft Entra a přidejte rozsah podle následujících kroků:

Přihlaste se k portálu Azure.
Pokud máte přístup k více tenantům, pomocí filtru adresářů a předplatných v horní nabídce přepněte na tenanta, ve kterém chcete aplikaci zaregistrovat.
Vyhledejte a vyberte Microsoft Entra ID.
V části Spravovat vyberte Registrace aplikací> Nová registrace.
- Název: zadejte název vaší aplikace, například Rychlý start aplikace TodoApp. Uživatelé vaší aplikace uvidí tento název. Ten můžete později změnit.
- Podporované typy účtů: Účty v libovolném organizačním adresáři (Jakýkoli adresář Microsoft Entra – Víceklient) a osobní účty Microsoft (např. Skype, Xbox)
Vyberte Zaregistrovat.
V části Spravovat vyberte Zveřejnit rozhraní API>Přidat obor.
U identifikátoru URI ID aplikace přijměte výchozí nastavení výběrem možnosti Uložit a pokračovat.
Zadejte následující údaje:
- Název oboru: access_as_user
- Kdo může souhlasit?: Správa a uživatelé
- zobrazovaný název Správa souhlasu:Access TodoApp
- popis souhlasu Správa:Allows the app to access TodoApp as the signed-in user.
- Zobrazované jméno souhlasu uživatele: Access TodoApp
- Popis souhlasu uživatele: Allow the app to access TodoApp on your behalf.
- Stav: Povoleno
Chcete-li dokončit přidání oboru, vyberte Přidat obor .
Poznamenejte si hodnotu oboru, podobně jako api://<client-id>/access_as_user (označovaný jako obor webového rozhraní API). Při konfiguraci klienta potřebujete obor.
Vyberte Přehled.
Poznamenejte si ID aplikace (klienta) v části Základy (označované jako ID aplikace webového rozhraní API). Tuto hodnotu potřebujete ke konfiguraci back-endové služby.

Otevřete Visual Studio a vyberte TodoAppService.NET6 projekt.

Klikněte pravým tlačítkem myši na TodoAppService.NET6 projekt a pak vyberte Spravovat balíčky NuGet....
Na nové kartě vyberte Procházet a do vyhledávacího pole zadejte Microsoft.Identity.Web .
Microsoft.Identity.Web Vyberte balíček a stiskněte Nainstalovat.
Podle pokynů dokončete instalaci balíčku.
Otevře záznam typu Program.cs. Do seznamu using příkazů přidejte následující položky:

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

Přidejte následující kód přímo nad volání:builder.Services.AddDbContext()

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

Přidejte následující kód přímo nad volání:app.MapControllers()

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

Váš soubor Program.cs by teď měl vypadat takto:

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();

Upravte soubor Controllers\TodoItemController.cs. [Authorize] Přidejte do třídy atribut. Vaše třída by měla vypadat takto:

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))
    {
    }
  }
}

Upravte soubor appsettings.json. Přidejte následující blok:

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

<client-id> Nahraďte ID aplikace webového rozhraní API, které jste si poznamenali dříve. Po dokončení by měl vypadat takto:

{
  "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": "*"
}

Znovu publikujte službu do Azure:

Klikněte pravým tlačítkem myši na TodoAppService.NET6 projekt a pak vyberte Publikovat....
Vyberte tlačítko Publikovat v pravém horním rohu karty.

Otevřete prohlížeč.https://yoursite.azurewebsites.net/tables/todoitem?ZUMO-API-VERSION=3.0.0 Všimněte si, že služba teď vrací 401 odpověď, která indikuje, že se vyžaduje ověřování.

Screenshot of the browser showing an error.

Registrace aplikace ve službě identit

Rozhraní Microsoft Data Sync Framework má integrovanou podporu pro libovolného zprostředkovatele ověřování, který používá webový token JSON (JWT) v hlavičce transakce HTTP. Tato aplikace používá knihovnu MSAL (Microsoft Authentication Library) k vyžádání takového tokenu a autorizaci přihlášeného uživatele do back-endové služby.

Konfigurace nativní klientské aplikace

Můžete registrovat nativní klienty, abyste povolili ověřování webových rozhraní API hostovaných ve vaší aplikaci pomocí klientské knihovny, jako je knihovna Microsoft Identity Library (MSAL).

Na webu Azure Portal vyberte ID> Microsoft Entra Registrace aplikací> New registration.
Na stránce Registrace aplikace :
- zadejte název registrace aplikace. Název můžete použít k odlišení od názvu native-quickstart , který používá vaše back-endová služba.
- Vyberte účty v libovolném organizačním adresáři (libovolný adresář Microsoft Entra – Víceklient) a osobní účty Microsoft (např. Skype, Xbox).
- V identifikátoru URI přesměrování:
  - Výběr veřejného klienta (mobilní a desktopová verze)
  - Zadejte adresu URL. quickstart://auth
Vyberte Zaregistrovat.
Vyberte oprávnění>rozhraní API Přidat oprávnění>Moje rozhraní API.
Vyberte registraci aplikace, kterou jste vytvořili dříve pro vaši back-endovou službu. Pokud registraci aplikace nevidíte, ujistěte se, že jste přidali rozsah access_as_user .
V části Vybrat oprávnění vyberte access_as_user a pak vyberte Přidat oprávnění.
Vyberte Ověřování>mobilních a desktopových aplikací.
Zaškrtněte políčko vedle https://login.microsoftonline.com/common/oauth2/nativeclientpoložky .
Zaškrtněte políčko vedle msal{client-id}://auth položky (nahrazení {client-id} ID vaší aplikace).
Vyberte Přidat identifikátor URI a pak do pole přidejte http://localhost další identifikátory URI.
Vyberte Uložit v dolní části stránky.
Vyberte Přehled. Poznamenejte si ID aplikace (klienta) (označované jako ID nativní klientské aplikace), protože ho potřebujete ke konfiguraci mobilní aplikace.

Definovali jsme tři adresy URL přesměrování:

http://localhost používá aplikace WPF.
https://login.microsoftonline.com/common/oauth2/nativeclient používá aplikace pro UPW.
msal{client-id}://auth používá se mobilními aplikacemi (Android a iOS).

Přidání klienta Microsoft Identity Do aplikace

TodoApp.sln Otevřete řešení v sadě Visual Studio a nastavte projekt jako spouštěný TodoApp.MAUI projekt. Přidejte do projektu knihovnu TodoApp.MAUI Microsoft Identity Library (MSAL):

Přidejte knihovnu Microsoft Identity Library (MSAL) do projektu platformy:

Klikněte pravým tlačítkem myši na projekt a pak vyberte Spravovat balíčky NuGet....
Vyberte kartu Procházet.
Do vyhledávacího pole zadejte Microsoft.Identity.Client a stiskněte Enter.
Microsoft.Identity.Client Vyberte výsledek a klikněte na Nainstalovat.
Přijměte licenční smlouvu a pokračujte v instalaci.

Přidejte do konfigurace nativní ID klienta a back-endový obor.

TodoApp.Data Otevřete projekt a upravte Constants.cs soubor. Přidat konstanty pro ApplicationId a 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>"
      };
  }

<client-id> Nahraďte IDnativní klientské aplikace, které jste obdrželi při registraci klientské aplikace v Microsoft Entra ID, a <scope> obor webového rozhraní API, který jste zkopírovali při použití Vystavit rozhraní API při registraci aplikace služby.

Otevřete třídu MainPage.xaml.cs v projektu TodoApp.MAUI. Přidejte následující příkazy using:

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

MainPage Do třídy přidejte novou vlastnost:

public IPublicClientApplication IdentityClient { get; set; }

Upravte konstruktor tak, aby četl:

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

Přidejte metodu GetAuthenticationToken do třídy:

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 ?? ""
    };
}

Metoda GetAuthenticationToken() pracuje s knihovnou Microsoft Identity Library (MSAL) a získá přístupový token vhodný pro autorizaci přihlášeného uživatele do back-endové služby. Tato funkce se pak předá do objektu RemoteTodoService pro vytvoření klienta. Pokud je ověřování úspěšné, vytvoří AuthenticationToken se s daty potřebnými k autorizaci jednotlivých požadavků. Pokud ne, vytvoří se místo toho chybný token s vypršenou platností.

Pomocí oblastí se specifikátorem platformy můžeme přidat jakékoli možnosti #if specifické pro platformu. Android například vyžaduje, abychom zadali nadřazenou aktivitu, která se předává z volající stránky.

Konfigurace aplikace pro Android pro ověřování

Vytvořte novou třídu Platforms\Android\MsalActivity.cs s následujícím kódem:

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
    {
    }
}

Nahraďte {client-id} ID aplikace nativního klienta (což je stejné jako Constants.ApplicationId).

Pokud váš projekt cílí na Android verze 11 (rozhraní API verze 30) nebo novější, musíte aktualizovatAndroidManifest.xml, aby splňoval požadavky na viditelnost balíčku Pro Android. Otevřete Platforms/Android/AndroidManifest.xml a přidejte do manifest uzlu následující queries/intent uzly:

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

Otevře záznam typu MauiProgram.cs. Do horní části souboru zahrňte následující using příkazy:

using Microsoft.Identity.Client;

Aktualizujte tvůrce na následující kód:

    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");
        });

Pokud tento krok provádíte po aktualizaci aplikace pro iOS, přidejte kód určený znakem #if ANDROID (včetně #if a #endif). Kompilátor vybere správnou část kódu na základě platformy, která se kompiluje. Tento kód lze umístit před nebo za existující blok pro iOS.

Když Android vyžaduje ověření, získá klienta identity a pak přepne na interní aktivitu, která otevře systémový prohlížeč. Po dokončení ověřování se systémový prohlížeč přesměruje na definovanou adresu URL přesměrování (msal{client-id}://auth). Přesměrovává MsalActivity adresu URL, která se pak přepne zpět na hlavní aktivitu voláním OnActivityResult(). OnActivityResult() Metoda volá pomocníka pro ověřování MSAL k dokončení transakce.

Testování aplikace pro Android

Nastavte TodoApp.MAUI jako spouštěný projekt, vyberte emulátor androidu jako cíl a stisknutím klávesy F5 sestavte a spusťte aplikaci. Po spuštění aplikace se zobrazí výzva k přihlášení k aplikaci. Při prvním spuštění se zobrazí výzva k vyjádření souhlasu s aplikací. Po dokončení ověřování se aplikace spustí normálně.

Testování aplikace pro Windows

Nastavte TodoApp.MAUI jako spouštěný projekt, vyberte jako cíl počítač s Windows a stisknutím klávesy F5 sestavte a spusťte aplikaci. Po spuštění aplikace se zobrazí výzva k přihlášení k aplikaci. Při prvním spuštění se zobrazí výzva k vyjádření souhlasu s aplikací. Po dokončení ověřování se aplikace spustí normálně.

Další kroky

Dále nakonfigurujte aplikaci tak, aby fungovala offline implementací offline úložiště.