Přidání ověřování do aplikace Avalonia

Poznámka

Tento produkt je vyřazený. Náhradu za projekty používající .NET 8 nebo novější najdete v knihovně Community Toolkit Datasync.

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-endový.

Spropitné

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:

• Zaregistrujte aplikaci 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ů:

1. Přihlaste se k webu azure Portal.

2. Pokud máte přístup k více tenantům, pomocí adresářů a předplatných v horní nabídce přepněte do tenanta, ve kterém chcete aplikaci zaregistrovat.

3. Vyhledejte a vyberte MICROSOFT Entra ID .

4. V části Spravovatvyberte Registrace aplikací>Nová registrace.

   • Název: zadejte název aplikace; Například Rychlé zprovoznění TodoAppu . Uživatelé vaší aplikace uvidí tento název. Můžete ho později změnit.
   • podporované typy účtů: Účty v libovolném adresáři organizace (jakýkoli adresář Microsoft Entra – Víceklient) a osobní účty Microsoft (např. Skype, Xbox)

5. Vyberte Zaregistrovat.

6. V části Spravovatvyberte Zveřejnit rozhraní API>Přidat obor.

7. U identifikátoru URI ID aplikacepřijměte výchozí nastavení tak, že vyberete Uložit a pokračovat.

8. Zadejte následující podrobnosti:

   • Název oboru: access_as_user
   • Kdo může souhlasit?: správci a uživatelé
   • zobrazovaný názevsouhlasu správce :
   • popis souhlasu správce : 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.
   • stavu : Povoleno

9. Výběrem Přidat obor dokončete přidání oboru.

10. Všimněte si hodnoty oboru, podobně jako api://<client-id>/access_as_user (označované jako obor webového rozhraní API). Při konfiguraci klienta potřebujete obor.

11. VybertePřehled .

12. Poznamenejte si ID aplikace (klienta) v části Essentials (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.

1. Klikněte pravým tlačítkem na projekt TodoAppService.NET6 a vyberte Spravovat balíčky NuGet....

2. Na nové kartě vyberte Procházeta do vyhledávacího pole zadejte Microsoft.Identity.Web.

   

3. Vyberte balíček Microsoft.Identity.Web a stiskněte Nainstalovat.

4. Podle pokynů dokončete instalaci balíčku.

5. Otevřete Program.cs. Do seznamu příkazů using přidejte následující:

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

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

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

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

Váš 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();

8. Upravte Controllers\TodoItemController.cs. Přidejte do třídy atribut [Authorize]. 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))
    {
    }
  }
}

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

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

Nahraďte <client-id> 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:

1. Klikněte pravým tlačítkem na projekt TodoAppService.NET6 a vyberte Publikovat....
2. V pravém horním rohu karty vyberte tlačítko Publikovat.

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

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á Microsoft Authentication Library (MSAL) 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).

1. Na webu Azure Portalvyberte registrace>registrace aplikací Microsoft Entra>Nová registrace.

2. Na stránce Zaregistrovat aplikaci:

   • Zadejte název pro registraci aplikace. Možná budete chtít použít název native-quickstart k odlišení od názvu, který používá vaše back-endová služba.
   • Vyberte Účty v libovolném adresáři organizace (libovolný adresář Microsoft Entra – Víceklient) a osobní účty Microsoft (např. Skype, Xbox).
   • V identifikátoru URI přesměrování:
     • Vyberte veřejného klienta (mobilní & desktop)
     • Zadejte quickstart://auth adresy URL.

3. Vyberte Zaregistrovat.

4. Vyberte oprávnění rozhraní API>Přidat oprávnění>Rozhraní API.

5. 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.

   

6. V části Vyberte oprávnění, vyberte access_as_usera pak vyberte Přidat oprávnění.

7. Vyberte ověřování>mobilní a desktopové aplikace.

8. Zaškrtněte políčko vedle https://login.microsoftonline.com/common/oauth2/nativeclient.

9. Zaškrtněte políčko vedle msal{client-id}://auth (nahrazení {client-id} ID vaší aplikace).

10. Vyberte Přidat identifikátor URIa pak do pole přidejte http://localhost pro další identifikátory URI.

11. V dolní části stránky vyberte Uložit.

12. VybertePř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žívají aplikace WPF.
• https://login.microsoftonline.com/common/oauth2/nativeclient používají aplikace UPW.
• msal{client-id}://auth používají mobilní aplikace (Android a iOS).

Přidání klienta Microsoft Identity Do aplikace

Otevřete řešení TodoApp.sln v sadě Visual Studio a nastavte projekt TodoApp.Avaloniajako spouštěný projekt. Do projektu přidejte knihovny microsoft Identity Library (MSAL) :

Do projektu platformy přidejte Microsoft Identity Library (MSAL):

1. Klikněte pravým tlačítkem myši na projekt a pak vyberte Spravovat balíčky NuGet....

2. Vyberte kartu Procházet.

3. Do vyhledávacího pole zadejte Microsoft.Identity.Client a stiskněte Enter.

4. Vyberte výsledek Microsoft.Identity.Client a potom klikněte na Nainstalovat.

   

5. Přijměte licenční smlouvu a pokračujte v instalaci.

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

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

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

Otevřete soubor MainWindowViewModel.cs ve složce ViewModels projektu TodoApp.Avalonia.

Na začátek souboru přidejte následující příkazy using:

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

Odeberte vlastnost TodoService a nahraďte ji následujícím kódem:

public MainWindowViewModel()
{
    IdentityClient = PublicClientApplicationBuilder.Create(Constants.ApplicationId)
        .WithAuthority(AzureCloudInstance.AzurePublic, "common")
        .WithRedirectUri("http://localhost")
        .Build();
    TodoService = new RemoteTodoService(GetAuthenticationToken);
    TodoList = new TodoListViewModel(TodoService);
}

public IPublicClientApplication IdentityClient { get; }

public ITodoService TodoService { get; }

public TodoListViewModel TodoList { get; }

public async Task<AuthenticationToken> GetAuthenticationToken()
{
    var accounts = await IdentityClient.GetAccountsAsync();
    AuthenticationResult? result = null;
    try
    {
        result = await IdentityClient
            .AcquireTokenSilent(Constants.Scopes, accounts.FirstOrDefault())
            .ExecuteAsync();
    }
    catch (MsalUiRequiredException)
    {
        result = await IdentityClient
            .AcquireTokenInteractive(Constants.Scopes)
            .ExecuteAsync();
    }
    catch (Exception ex)
    {
        // Display the error text - probably as a pop-up
        Debug.WriteLine($"Error: Authentication failed: {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á RemoteTodoService pro vytvoření klienta. Pokud je ověřování úspěšné, vytvoří se AuthenticationToken s daty potřebnými k autorizaci jednotlivých požadavků. Pokud ne, vytvoří se místo toho chybný token s vypršenou platností.

Otestování aplikace

Aplikaci spusťte stisknutím klávesy F5. Po spuštění aplikace se otevře prohlížeč s žádostí o ověření. Při prvním spuštění aplikace se zobrazí výzva k vyjádření souhlasu s přístupem:

Stisknutím Ano pokračujte v aplikaci. Aplikace pokračuje stejně jako předtím.

Další kroky

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

Další čtení

• rychlý start : Ochrana webového rozhraní API pomocí platformy Microsoft Identity Platform
• rychlý start : Získání tokenu a volání rozhraní Microsoft Graph API z desktopové aplikace