Udostępnij za pośrednictwem


Samouczek: logowanie użytkowników w aplikacji w powłoce MAUI platformy .NET przy użyciu zewnętrznego dzierżawcy

Dotyczy: Biały okrąg z szarym symbolem X. Najemcy usługi Workforce Zielony okrąg z białym symbolem haczyka. Zewnętrzni najemcy (dowiedzieć się więcej)

Ten samouczek jest ostatnią częścią serii, która pokazuje, jak utworzyć aplikację powłoki interfejsu użytkownika (.NET MAUI) dla aplikacji wieloplatformowej i przygotować ją do uwierzytelniania przy użyciu centrum administracyjnego Microsoft Entra. W część 2 tej serii dodano niestandardowy pomocnik klienta biblioteki Microsoft Authentication Library (MSAL), aby zainicjować zestaw SDK bibliotek MSAL, zainstalować wymagane biblioteki i dołączyć zasób obrazu. W tym ostatnim kroku pokazano, jak dodać kod logowania i wylogowania w frameworku .NET MAUI i uruchomić aplikację typu shell na platformie Android.

W tym samouczku nauczysz się:

  • Dodaj kod logowania i wylogowania.
  • Zmodyfikuj powłokę aplikacji.
  • Dodaj kod specyficzny dla platformy.
  • Dodaj ustawienia aplikacji.
  • Uruchom i przetestuj aplikację shell .NET MAUI.

Warunki wstępne

Dodawanie kodu logowania i wylogowania

Interfejs użytkownika aplikacji .NET MAUI jest skonstruowany z obiektów odpowiadających natywnym kontrolkom każdej platformy docelowej. Główne grupy kontrolek używane do tworzenia interfejsu użytkownika aplikacji .NET MAUI to strony, układy i widoki.

Dodawanie strony widoku głównego

Następne kroki spowodują zorganizowanie kodu w taki sposób, aby main view został zdefiniowany.

  1. Usuń MainPage.xaml i MainPage.xaml.cs z projektu, nie są już potrzebne. W okienku Eksploratora rozwiązań znajdź wpis MainPage.xaml, kliknij go prawym przyciskiem myszy i wybierz Usuń.

  2. Kliknij prawym przyciskiem myszy projekt SignInMaui i wybierz Dodaj>Nowy folder. Nadaj folderowi nazwę Views.

  3. Kliknij prawym przyciskiem myszy Views.

  4. Wybierz pozycję Dodaj nowy element>....

  5. Na liście szablonów wybierz pozycję .NET MAUI.

  6. Wybierz szablon .NET MAUI ContentPage (XAML). Nadaj plikowi nazwę MainView.xaml.

  7. Wybierz pozycję Dodaj.

  8. Plik MainView.xaml zostanie otwarty na nowej karcie dokumentu, wyświetlając wszystkie znaczniki XAML reprezentujące interfejs użytkownika strony. Zastąp znacznik XAML następującym znacznikiem:

    <?xml version="1.0" encoding="utf-8" ?>
    <ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
                 xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
                 x:Class="SignInMaui.Views.MainView"
                 Title="Microsoft Entra External ID"
                 >
        <Shell.BackButtonBehavior>
            <BackButtonBehavior IsVisible="False" IsEnabled="False" />
        </Shell.BackButtonBehavior>
    
        <ScrollView>
            <VerticalStackLayout 
                Spacing="25" 
                Padding="30,0" 
                VerticalOptions="Center">
    
                <Image
                    Source="external_id.png"
                    SemanticProperties.Description="External ID"
                    HeightRequest="200"
                    HorizontalOptions="Center" />
    
                <Label 
                    Text="CIAM"
                    SemanticProperties.HeadingLevel="Level1"
                    FontSize="26"
                    HorizontalOptions="Center" />
    
                <Label 
                    Text="MAUI sample"
                    SemanticProperties.HeadingLevel="Level1"
                    FontSize="26"
                    HorizontalOptions="Center" />
    
                <Button 
                    x:Name="SignInButton"
                    Text="Sign In"
                    SemanticProperties.Hint="Sign In"
                    Clicked="OnSignInClicked"
                    HorizontalOptions="Center"
                    IsEnabled="False"/>
    
            </VerticalStackLayout>
        </ScrollView>
     
    </ContentPage>
    
  9. Zapisz plik.

    Podzielmy kluczowe części kontrolek XAML umieszczonych na stronie:

    • <ContentPage> jest obiektem głównym klasy MainView.
    • <VerticalStackLayout> jest obiektem podrzędnym strony ContentPage. Ta kontrolka układu rozmieszcza elementy podrzędne w pionie, jeden po drugim.
    • <Image> wyświetla obraz, w tym przypadku używa azureactive_directory.png_, który został pobrany wcześniej.
    • <Label> kontroluje wyświetlanie tekstu.
    • <Button> użytkownik może nacisnąć, co wywołuje zdarzenie Clicked. Kod można uruchomić w odpowiedzi na zdarzenie Clicked.
    • Clicked="OnSignInClicked" zdarzenie Clicked przycisku jest przypisane do programu obsługi zdarzeń OnSignInClicked, który zostanie zdefiniowany w pliku code-behind. Ten kod zostanie utworzony w następnym kroku.

Obsługa zdarzenia OnSignInClicked

Następnym krokiem jest dodanie kodu dla zdarzenia przycisku Clicked.

  1. W okienku Eksploratora Rozwiązań programu Visual Studio rozwiń plik MainView.xaml, aby ujawnić jego plik zaplecza kodu MainView.xaml.cs. Otwórz MainView.xaml.cs i zastąp zawartość pliku następującym kodem:

    // Copyright (c) Microsoft Corporation. All rights reserved.
    // Licensed under the MIT License.
    
    using SignInMaui.MSALClient;
    using Microsoft.Identity.Client;
    
    namespace SignInMaui.Views
    {
        public partial class MainView : ContentPage
        {
            public MainView()
            {
                InitializeComponent();
    
                IAccount cachedUserAccount = PublicClientSingleton.Instance.MSALClientHelper.FetchSignedInUserFromCache().Result;
    
                _ = Dispatcher.DispatchAsync(async () =>
                {
                    if (cachedUserAccount == null)
                    {
                        SignInButton.IsEnabled = true;
                    }
                    else
                    {
                        await Shell.Current.GoToAsync("claimsview");
                    }
                });
            }
    
            private async void OnSignInClicked(object sender, EventArgs e)
            {
                await PublicClientSingleton.Instance.AcquireTokenSilentAsync();
                await Shell.Current.GoToAsync("claimsview");
            }
            protected override bool OnBackButtonPressed() { return true; }
    
        }
    }
    

    Klasa MainView to strona zawartości odpowiedzialna za wyświetlanie głównego widoku aplikacji. W konstruktorze pobiera buforowane konto użytkownika przy użyciu MSALClientHelper z wystąpienia PublicClientSingleton i włącza przycisk logowania, jeśli nie znaleziono buforowanego konta użytkownika.

    Po kliknięciu przycisku logowania wywołuje metodę AcquireTokenSilentAsync w celu uzyskania tokenu w trybie dyskretnym i przechodzi do strony claimsview przy użyciu metody Shell.Current.GoToAsync. Ponadto metoda OnBackButtonPressed jest zastępowana w celu zwrócenia wartości true, co oznacza, że przycisk Wstecz jest wyłączony dla tego widoku.

Dodaj stronę podglądu roszczeń

Następne kroki zorganizują kod w taki sposób, aby strona ClaimsView została zdefiniowana. Na stronie zostaną wyświetlone roszczenia użytkownika znalezione w tokenie ID.

  1. W okienku programu Visual Studio Eksploratora rozwiązań, kliknij prawym przyciskiem myszy na Views.

  2. Wybierz pozycję Dodaj nowy element>....

  3. Na liście szablonów wybierz pozycję .NET MAUI.

  4. Wybierz szablon .NET MAUI ContentPage (XAML). Nadaj plikowi nazwę ClaimsView.xaml.

  5. Wybierz pozycję Dodaj.

  6. Plik ClaimsView.xaml zostanie otwarty na nowej karcie dokumentu, wyświetlając wszystkie znaczniki XAML reprezentujące interfejs użytkownika strony. Zastąp znacznik XAML następującym znacznikiem:

    <?xml version="1.0" encoding="utf-8" ?>
    <ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
                 xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
                 x:Class="SignInMaui.Views.ClaimsView"
                 Title="ID Token View">
        <Shell.BackButtonBehavior>
            <BackButtonBehavior IsVisible="False" IsEnabled="False" />
        </Shell.BackButtonBehavior>
        <VerticalStackLayout>
            <Label 
                Text="CIAM"
                FontSize="26"
                HorizontalOptions="Center" />
            <Label 
                Text="MAUI sample"
                FontSize="26"
                Padding="0,0,0,20"
                HorizontalOptions="Center" />
    
            <Label 
                Padding="0,20,0,0"
                VerticalOptions="Center" 
                HorizontalOptions="Center"
                FontSize="18"
                Text="Claims found in ID token"
                />
            <ListView ItemsSource="{Binding IdTokenClaims}"
                      x:Name="Claims">
                <ListView.ItemTemplate>
                    <DataTemplate>
                        <ViewCell>
                            <Grid Padding="0, 0, 0, 0">
                                <Label Grid.Column="1" 
                                       Text="{Binding}" 
                                       HorizontalOptions="Center" />
                            </Grid>
                        </ViewCell>
                    </DataTemplate>
                </ListView.ItemTemplate>
            </ListView>
            <Button
                x:Name="SignOutButton"
                Text="Sign Out"
                HorizontalOptions="Center"
                Clicked="SignOutButton_Clicked" />
        </VerticalStackLayout>
    </ContentPage>
    

    Ten kod znaczników XAML reprezentuje układ interfejsu użytkownika dla widoku oświadczenia w aplikacji .NET MAUI. Zaczyna się od zdefiniowania ContentPage z tytułem i wyłączeniem zachowania przycisku Wstecz.

    Wewnątrz VerticalStackLayoutznajduje się kilka elementów Label wyświetlających tekst statyczny, po których następuje element ListView o nazwie Claims, który łączy się z kolekcją o nazwie IdTokenClaims, aby wyświetlić oświadczenia znalezione w tokenie identyfikatora. Każde oświadczenie jest renderowane w ViewCell przy użyciu DataTemplate i wyświetlane jako wyśrodkowany Label w siatce.

    Na koniec znajduje się przycisk Sign Out wyśrodkowany w dolnej części układu, który wyzwala program obsługi zdarzeń SignOutButton_Clicked po kliknięciu.

Obsługa danych ClaimsView

Następnym krokiem jest dodanie kodu do obsługi danych ClaimsView.

  1. W okienku eksploratora rozwiązań programu Visual Studio rozwiń plik ClaimsView.xaml, aby wyświetlić plik ClaimsView.xaml.csza pomocą kodu. Otwórz ClaimsView.xaml.cs i zastąp zawartość pliku następującym kodem:

    using SignInMaui.MSALClient;
    using Microsoft.Identity.Client;
    
    namespace SignInMaui.Views;
    
    public partial class ClaimsView : ContentPage
    {
        public IEnumerable<string> IdTokenClaims { get; set; } = new string[] {"No claims found in ID token"};
        public ClaimsView()
        {
            BindingContext = this;
            InitializeComponent();
    
            _ = SetViewDataAsync();
        }
    
        private async Task SetViewDataAsync()
        {
            try
            {
                _ = await PublicClientSingleton.Instance.AcquireTokenSilentAsync();
    
                IdTokenClaims = PublicClientSingleton.Instance.MSALClientHelper.AuthResult.ClaimsPrincipal.Claims.Select(c => c.Value);
    
                Claims.ItemsSource = IdTokenClaims;
            }
    
            catch (MsalUiRequiredException)
            {
                await Shell.Current.GoToAsync("claimsview");
            }
        }
    
        protected override bool OnBackButtonPressed() { return true; }
    
        private async void SignOutButton_Clicked(object sender, EventArgs e)
        {
            await PublicClientSingleton.Instance.SignOutAsync().ContinueWith((t) =>
            {
                return Task.CompletedTask;
            });
    
            await Shell.Current.GoToAsync("mainview");
        }
    }
    

    Kod ClaimsView.xaml.cs reprezentuje kod zaplecza dla widoku roszczeń w aplikacji .NET MAUI. Rozpoczyna się od zaimportowania niezbędnych przestrzeni nazw i zdefiniowania klasy ClaimsView, która rozszerza ContentPage. Właściwość IdTokenClaims jest kolekcją ciągów znaków, początkowo ustawioną na pojedynczy ciąg znaków wskazujący, że nie znaleziono roszczeń.

    Konstruktor ClaimsView ustawia kontekst powiązania na bieżące wystąpienie, inicjuje składniki widoku i wywołuje metodę SetViewDataAsync asynchronicznie. Metoda SetViewDataAsync próbuje uzyskać token dyskretnie, pobiera oświadczenia z wyniku uwierzytelniania i ustawia właściwość IdTokenClaims, aby wyświetlić je w ListView o nazwie Claims. Jeśli wystąpi MsalUiRequiredException wskazująca, że interakcja użytkownika jest wymagana do uwierzytelniania, aplikacja przechodzi do widoku oświadczeń.

    Metoda OnBackButtonPressed modyfikuje działanie przycisku wstecz tak, aby zawsze zwracała wartość true, co uniemożliwia użytkownikowi powrót z tego widoku. Obsługa zdarzeń SignOutButton_Clicked wylogowuje użytkownika przy użyciu wystąpienia PublicClientSingleton, a po zakończeniu kieruje do main view.

Modyfikowanie powłoki aplikacji

Klasa AppShell definiuje hierarchię wizualną aplikacji, znacznik XAML używany podczas tworzenia interfejsu użytkownika aplikacji. Zaktualizuj AppShell, aby przekazać mu informacje o Views.

  1. Kliknij dwukrotnie plik AppShell.xaml w okienku eksploratora rozwiązań , aby otworzyć edytor XAML. Zastąp znacznik XAML następującym kodem:

    <?xml version="1.0" encoding="UTF-8" ?>
    <Shell
        x:Class="SignInMaui.AppShell"
        xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
        xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
        xmlns:local="clr-namespace:SignInMaui.Views"
        Shell.FlyoutBehavior="Disabled">
    
        <ShellContent
            Title="Home"
            ContentTemplate="{DataTemplate local:MainView}"
            Route="MainPage" />
    </Shell>
    

    Kod XAML definiuje klasę AppShell, która wyłącza zachowanie wysuwane i ustawia główną zawartość na element ShellContent z tytułem Home i szablonem zawartości wskazującym klasę MainView.

  2. W ekranie eksploratora rozwiązań Visual Studio rozwiń plik AppShell.xaml, aby wyświetlić plik zawierający kod AppShell.xaml.cs. Otwórz AppShell.xaml.cs i zastąp zawartość pliku następującym kodem:

    // Copyright (c) Microsoft Corporation. All rights reserved.
    // Licensed under the MIT License.
    using SignInMaui.Views;
    
    namespace SignInMaui;
    
    public partial class AppShell : Shell
    {
        public AppShell()
        {
            InitializeComponent();
            Routing.RegisterRoute("mainview", typeof(MainView));
            Routing.RegisterRoute("claimsview", typeof(ClaimsView));
        }
    }
    

    Należy zaktualizować plik AppShell.xaml.cs, aby uwzględnić niezbędne rejestracje tras dla MainView i ClaimsView. Wywołując metodę InitializeComponent(), zapewniasz inicjalizację klasy AppShell. Metoda RegisterRoute() kojarzy trasy mainview i claimsview z odpowiednimi typami widoków, MainView i ClaimsView.

Dodawanie kodu specyficznego dla platformy

Projekt aplikacji .NET MAUI zawiera folder Platformy z każdym folderem podrzędnym reprezentującym platformę docelową programu .NET MAUI. Aby zapewnić zachowanie specyficzne dla aplikacji systemu Android w celu uzupełnienia domyślnej klasy aplikacji, wykonaj następujące kroki:

  1. Kliknij dwukrotnie plik Platforms/Android/AndroidManifest.xml w okienku eksploratora rozwiązań , aby otworzyć edytor XML. Zaktualizuj następujące właściwości:

    • Ustaw nazwę aplikacji na MAUI CIAM.
    • Ustaw nazwę pakietu na SignInMaui.Droid.
    • Ustaw minimalną wersję systemu Android na Android 5.0 (interfejs API poziom 21).
  2. Kliknij dwukrotnie plik Platforms/Android/MainActivity.cs w okienku eksploratora rozwiązań , aby otworzyć edytor csharp. Zastąp zawartość pliku następującym kodem:

    // Copyright (c) Microsoft Corporation. All rights reserved.
    // Licensed under the MIT License.
    using Android.App;
    using Android.Content;
    using Android.Content.PM;
    using Android.OS;
    using SignInMaui.MSALClient;
    using Microsoft.Identity.Client;
    
    namespace SignInMaui;
    
    [Activity(Theme = "@style/Maui.SplashTheme", MainLauncher = true, ConfigurationChanges = ConfigChanges.ScreenSize | ConfigChanges.Orientation | ConfigChanges.UiMode | ConfigChanges.ScreenLayout | ConfigChanges.SmallestScreenSize | ConfigChanges.Density)]
    public class MainActivity : MauiAppCompatActivity
    {
        protected override void OnCreate(Bundle savedInstanceState)
        {
            base.OnCreate(savedInstanceState);
            // configure platform specific params
            PlatformConfig.Instance.RedirectUri = $"msal{PublicClientSingleton.Instance.MSALClientHelper.AzureAdConfig.ClientId}://auth";
            PlatformConfig.Instance.ParentWindow = this;
    
            // Initialize MSAL and platformConfig is set
            _ = Task.Run(async () => await PublicClientSingleton.Instance.MSALClientHelper.InitializePublicClientAppAsync()).Result;
        }
    
        protected override void OnActivityResult(int requestCode, Result resultCode, Intent data)
        {
            base.OnActivityResult(requestCode, resultCode, data);
            AuthenticationContinuationHelper.SetAuthenticationContinuationEventArgs(requestCode, resultCode, data);
        }
    }
    

    Podzielmy kluczowe części dodanego kodu:

    • Niezbędne instrukcje using są umieszczone na górze.
    • Klasa MainActivity została zdefiniowana jako dziedzicząca po MauiAppCompatActivity, która jest klasą bazową dla platformy Android w .NET MAUI.
    • Atrybut [Activity] jest stosowany do klasy MainActivity, określając różne ustawienia działania systemu Android.
      • Theme = "@style/Maui.SplashTheme" ustawia motyw startowy dla aktywności.
      • MainLauncher = true wyznacza to działanie jako główny punkt wejścia aplikacji.
      • ConfigurationChanges określa zmiany konfiguracji, które może obsłużyć działanie, takie jak rozmiar ekranu, orientacja , tryb interfejsu użytkownika , układ ekranu , najmniejszy rozmiar ekranui gęstość.
    • OnCreate metoda jest zastępowana w celu zapewnienia logiki niestandardowej podczas tworzenia działania.
      • base.OnCreate(savedInstanceState) wywołuje podstawową implementację metody .
      • PlatformConfig.Instance.RedirectUri jest ustawiona na wartość generowaną dynamicznie na podstawie PublicClientSingleton.Instance.MSALClientHelper.AzureAdConfig.ClientId. Konfiguruje identyfikator URI przekierowania dla klienta MSAL.
      • PlatformConfig.Instance.ParentWindow jest ustawiona na bieżące wystąpienie działania, które określa okno nadrzędne dla operacji związanych z uwierzytelnianiem.
      • PublicClientSingleton.Instance.MSALClientHelper.InitializePublicClientAppAsync() inicjuje aplikację klienta MSAL asynchronicznie przy użyciu metody pomocniczej z pojedynczego wystąpienia o nazwie MSALClientHelper. Task.Run służy do wykonywania inicjowania w wątku w tle, a .Result służy do synchronicznego oczekiwania na ukończenie zadania.
    • OnActivityResult metoda jest zastępowana w celu obsługi wyniku działania uruchomionego przez bieżące działanie.
      • base.OnActivityResult(requestCode, resultCode, data) wywołuje podstawową implementację metody .
      • AuthenticationContinuationHelper.SetAuthenticationContinuationEventArgs(requestCode, resultCode, data) ustawia argumenty zdarzeń kontynuacji uwierzytelniania na podstawie otrzymanego kodu żądania, kodu wyniku i danych intencji. Służy do kontynuowania przepływu uwierzytelniania po tym, jak działanie zewnętrzne zwróci wynik.
  3. W panelu Eksploratora rozwiązań w Visual Studio wybierz pozycję Platformy .

  4. Kliknij prawym przyciskiem myszy na folder Android>Dodaj nowy element...>.

  5. Wybierz pozycję Elementy języka C#>Klasa. Nadaj plikowi nazwę MsalActivity.cs.

  6. Zastąp zawartość pliku MsalActivity.cs następującym kodem:

    // Copyright (c) Microsoft Corporation. All rights reserved.
    // Licensed under the MIT License.
    
    using System;
    using System.Collections.Generic;
    using System.Linq;
    using System.Text;
    
    using Android.App;
    using Android.Content;
    using Android.OS;
    using Android.Runtime;
    using Android.Views;
    using Android.Widget;
    using Microsoft.Identity.Client;
    
    namespace MauiAppBasic.Platforms.Android.Resources
    {
        [Activity(Exported =true)]
        [IntentFilter(new[] { Intent.ActionView },
            Categories = new[] { Intent.CategoryBrowsable, Intent.CategoryDefault },
            DataHost = "auth",
            DataScheme = "msalEnter_the_Application_Id_Here")]
        public class MsalActivity : BrowserTabActivity
        {
        }
    }
    

    Podzielmy kluczowe części dodanego kodu:

    • MsalActivity klasa jest zadeklarowana w przestrzeni nazw MauiAppBasic.Platforms.Android.Resources. Klasa dziedziczy z klasy BrowserTabActivity, co oznacza, że rozszerza swoją funkcjonalność.
    • Klasa jest ozdobiona atrybutem [Activity(Exported = true)], co oznacza, że aktywność jest eksportowana i można uzyskać do niej dostęp przez inne metody.
    • Filtr intencji jest określany przy użyciu atrybutu "[IntentFilter(...)]". Konfiguruje działanie w celu przechwycenia intencji ActionView.
    • Filtr intencji jest ustawiony do obsługi intencji ActionView z określonymi DataScheme (msalEnter_the_Application_Id_Here) i DataHost ("auth"). Ta konfiguracja umożliwia aktywności obsługiwanie procesu uwierzytelniania poprzez przechwytywanie i przetwarzanie intencji ActionView. Zastąp Enter_the_Application_Id_Here identyfikatorem aplikacji (klienta) z aplikacji zarejestrowanej wcześniej.

Dodawanie ustawień aplikacji

Ustawienia umożliwiają rozdzielenie danych, które konfigurują zachowanie aplikacji z kodu, co pozwala na zmianę zachowania bez ponownego kompilowania aplikacji. MauiAppBuilder udostępnia ConfigurationManager, które służy do konfigurowania ustawień w naszej aplikacji .NET MAUI. Dodajmy plik appsettings.json jako EmbeddedResource.

Aby utworzyć appsettings.json, wykonaj następujące kroki:

  1. W okienku eksploratora rozwiązań programu Visual Studio kliknij prawym przyciskiem myszy projekt SignInMaui>Dodaj nowy element>....

  2. Wybierz Web>plik konfiguracji JavaScript JSON. Nadaj plikowi nazwę appsettings.json.

  3. Wybierz pozycję Dodaj.

  4. Wybierz appsettings.json

  5. W okienku Właściwości ustaw Akcja Kompilacji na Osadzony Zasób.

  6. W okienku Właściwości ustaw Kopiuj do katalogu wyjściowego na Kopiuj zawsze.

  7. Zastąp zawartość pliku appsettings.json następującym kodem:

    {
      "AzureAd": {
        "Authority": "https://Enter_the_Tenant_Subdomain_Here.ciamlogin.com/",
        "ClientId": "Enter_the_Application_Id_Here",
        "CacheFileName": "msal_cache.txt",
        "CacheDir": "C:/temp"
      },
      "DownstreamApi": {
        "Scopes": "openid offline_access"
      }
    }
    
  8. W appsettings.jsonznajdź symbol zastępczy:

    1. Enter_the_Tenant_Subdomain_Here i zastąp ją poddomeną Katalog (dzierżawa). Jeśli na przykład domena podstawowa dzierżawy jest contoso.onmicrosoft.com, użyj contoso. Jeśli nie masz nazwy najemcy, dowiedz się, jak zobaczyć szczegóły najemcy.
    2. Enter_the_Application_Id_Here i zastąp go identyfikatorem aplikacji (klienta) zarejestrowanej wcześniej.

Użyj niestandardowej domeny adresu URL (opcjonalnie)

Użyj domeny niestandardowej, aby w pełni oznaczyć adres URL uwierzytelniania. Z punktu widzenia użytkownika użytkownicy pozostają w Twojej domenie podczas procesu uwierzytelniania, zamiast być przekierowywanymi do nazwy domeny ciamlogin.com.

Wykonaj następujące kroki, aby użyć domeny niestandardowej:

  1. Wykonaj kroki opisane w Włączanie niestandardowych domen adresów URL dla aplikacji w dzierżawach zewnętrznych, aby włączyć niestandardową domenę adresu URL dla dzierżawy zewnętrznej.

  2. Otwórz plik appsettings.json:

    1. Zaktualizuj wartość właściwości Authority do https://Enter_the_Custom_Domain_Here/Enter_the_Tenant_ID_Here. Zastąp Enter_the_Custom_Domain_Here domeną niestandardowego adresu URL i Enter_the_Tenant_ID_Here identyfikatorem dzierżawy. Jeśli nie masz identyfikatora dzierżawy, dowiedz się, jak odczytać szczegóły dzierżawy.
    2. Dodaj właściwość knownAuthorities z wartością [Enter_the_Custom_Domain_Here].

Po wprowadzeniu zmian w pliku appsettings.json, jeśli domena niestandardowego adresu URL to login.contoso.com, a identyfikator dzierżawcy to aaaabbbb-0000-cccc-1111-dddd2222eeee, plik powinien wyglądać podobnie do następującego fragmentu kodu:

{
  "AzureAd": {
    "Authority": "https://login.contoso.com/aaaabbbb-0000-cccc-1111-dddd2222eeee",
    "ClientId": "Enter_the_Application_Id_Here",
    "CacheFileName": "msal_cache.txt",
    "CacheDir": "C:/temp",
    "KnownAuthorities": ["login.contoso.com"]
  },
  "DownstreamApi": {
    "Scopes": "openid offline_access"
  }
}

Uruchamianie i testowanie aplikacji mobilnej .NET MAUI

Aplikacje .NET MAUI są przeznaczone do uruchamiania na wielu systemach operacyjnych i urządzeniach. Musisz wybrać docelowy element, aby przetestować i debugować swoją aplikację.

Ustaw Debug Target na pasku narzędzi programu Visual Studio na urządzenie, które chcesz używać do debugowania i testowania. W poniższych krokach pokazano ustawienie celu debugowania jako Android:

  1. Wybierz listę rozwijaną Debugowanie elementu docelowego.
  2. Wybierz pozycję Emulatory systemu Android.
  3. Wybierz urządzenie emulatora.

Uruchom aplikację, naciskając F5 lub wybierz przycisk odtwarzania w górnej części programu Visual Studio.

  1. Teraz możesz przetestować przykładową aplikację .NET MAUI dla systemu Android. Po uruchomieniu aplikacji w emulatorze zostanie wyświetlone okno aplikacji systemu Android:

    Zrzut ekranu przedstawiający przycisk logowania w aplikacji systemu Android.

  2. W oknie systemu Android, które się pojawi, wybierz przycisk Zaloguj się. Zostanie otwarte okno przeglądarki z monitem o zalogowanie się.

    Zrzut ekranu przedstawiający monit użytkownika o wprowadzenie poświadczeń w aplikacji systemu Android.

    Podczas procesu logowania zostanie wyświetlony monit o przyznanie różnych uprawnień (aby zezwolić aplikacji na dostęp do danych). Po pomyślnym zalogowaniu się i wyrażeniu zgody na ekranie aplikacji zostanie wyświetlona strona główna.

    Zrzut ekranu przedstawiający stronę główną w aplikacji systemu Android po zalogowaniu.

Zobacz też