Szybki start: konfigurowanie logowania do aplikacji ASP.NET przy użyciu usługi Azure Active Directory B2C

Azure Active Directory B2C (Azure AD B2C) zapewnia zarządzanie tożsamościami w chmurze w celu ochrony aplikacji, firm i klientów. Usługa Azure AD B2C umożliwia aplikacjom uwierzytelnianie względem kont społecznościowych i firmowych za pomocą protokołów zgodnych z otwartymi standardami.

W tym przewodniku Szybki start aplikacja platformy ASP.NET jest używana do logowania za pomocą dostawcy tożsamości społecznościowych i wywoływania chronionego internetowego interfejsu API usługi Azure AD B2C.

Wymagania wstępne

  • Visual Studio 2019 r. z ASP.NET tworzenia aplikacji internetowych.

  • Konto społecznościowe z serwisu Facebook, Google lub Microsoft.

  • Pobierz plik zip lub sklonuj przykładową aplikację internetową z usługi GitHub.

    git clone https://github.com/Azure-Samples/active-directory-b2c-dotnet-webapp-and-webapi.git
    

    Przykładowe rozwiązanie ma dwa projekty:

    • TaskWebApp — aplikacja internetowa, która pozwala tworzyć i edytować listę zadań. Aplikacja internetowa używa przepływu użytkownika rejestracji lub logowania do rejestracji lub logowania użytkowników.
    • TaskService — internetowy interfejs API, który obsługuje następujące funkcje listy zadań: tworzenie, odczytywanie, aktualizowanie i usuwanie. Internetowy interfejs API jest chroniony przez usługę Azure AD B2C i wywoływany przez aplikację internetową.

Uruchamianie aplikacji w programie Visual Studio

  1. W folderze projektu przykładowej aplikacji otwórz rozwiązanie B2C-WebAPI-DotNet.sln w programie Visual Studio.

  2. Na potrzeby tego przewodnika Szybki start uruchomisz równocześnie projekty TaskWebApp i TaskService. Kliknij prawym przyciskiem myszy rozwiązanie B2C-WebAPI-DotNet w Eksploratorze rozwiązań i wybierz pozycję Ustaw projekty startowe.

  3. Wybierz pozycję Wiele projektów startowych i zmień Akcję dla obu projektów na Uruchom.

  4. Wybierz przycisk OK.

  5. Naciśnij klawisz F5, aby debugować obie aplikacje. Każda z aplikacji zostanie otwarta we własnej karcie przeglądarki:

    • https://localhost:44316/ — aplikacja internetowa platformy ASP.NET. W przewodniku Szybki start ta aplikacja jest używana bezpośrednio.
    • https://localhost:44332/ — internetowy interfejs API wywoływany przez internetową aplikację platformy ASP.NET.

Logowanie się przy użyciu swojego konta

  1. Wybierz pozycję Zarejestruj się/Zaloguj w ASP.NET internetowej, aby uruchomić przepływ pracy.

    Przykładowa ASP.NET w przeglądarce z wyróżnionym linkiem rejestracji/rejestracji

    Przykład obsługuje kilka opcji rejestracji, w tym przy użyciu dostawcy tożsamości dla sieci społecznościowej, lub tworzenia konta lokalnego przy użyciu adresu e-mail. W tym przewodniku Szybki start użyj konta dostawcy tożsamości społecznościowych z serwisu Facebook, Google lub Microsoft.

  2. Azure AD B2C przedstawia stronę logowania fikcyjnej firmy Fabrikam dla przykładowej aplikacji internetowej. Aby zarejestrować się przy użyciu dostawcy tożsamości społecznościowych, wybierz przycisk dostawcy tożsamości, którego chcesz użyć.

    Strona Logowania lub rejestracji z przyciskami dostawcy tożsamości

    Uwierzytelniasz się (logujesz) przy użyciu poświadczeń konta w sieci społecznościowej i autoryzowasz aplikację do odczytywania informacji z konta w sieci społecznościowej. Po udzieleniu dostępu aplikacji może ona pobrać informacje z profilu na koncie w sieci społecznościowej, takie jak Twoje nazwisko i miasto.

  3. Zakończ proces logowania dla dostawcy tożsamości.

Edycja profilu

Usługa Azure Active Directory B2C zawiera funkcję umożliwiającą użytkownikom aktualizowanie profilów. Przykładowa aplikacja internetowa używa przepływu użytkownika profilu edycji usługi Azure AD B2C dla przepływu pracy.

  1. Na pasku menu aplikacji wybierz nazwę profilu, a następnie wybierz pozycję Edytuj profil, aby edytować utworzony profil.

    Przykładowa aplikacja internetowa w przeglądarce z wyróżnionym linkiem Edytuj profil

  2. Zmień nazwę wyświetlaną lub Miasto, a następnie wybierz pozycję Kontynuuj, aby zaktualizować profil.

    Zmiana zostanie wyświetlona w prawej górnej części strony głównej aplikacji internetowej.

Uzyskiwanie dostępu do chronionego zasobu interfejsu API

  1. Wybierz To-Do Listy zadań do wprowadzania i modyfikowania elementów listy zadań do pracy.

  2. W polu tekstowym Nowy element wprowadź tekst. Aby wywołać Azure AD B2C internetowego interfejsu API, który dodaje element listy zadań do wyboru, wybierz pozycję Dodaj.

    Przykładowa aplikacja internetowa w przeglądarce z dodawaniem elementu listy zadań do wykonaj

    Aplikacja internetowa platformy ASP.NET dołącza token dostępu usługi Azure AD do żądania skierowanego do chronionego zasobu internetowego interfejsu API w celu wykonania operacji na pozycjach listy zadań do wykonania użytkownika.

Pomyślnie użyto konta użytkownika usługi Azure AD B2C do wykonania autoryzowanego wywołania chronionego internetowego interfejsu API usługi Azure AD B2C.

Następne kroki

Tworzenie dzierżawy usługi Azure Active Directory B2C w witrynie Azure Portal