Rejestrowanie aplikacji jednostronicowej w usłudze Azure Active Directory B2C

  • Artykuł

Aby aplikacje mogły wchodzić w interakcje z usługą Azure Active Directory B2C (Azure AD B2C), muszą być zarejestrowane w dzierżawie, którą zarządzasz. W tym przewodniku pokazano, jak zarejestrować jednostronicową aplikację ("SPA") przy użyciu witryny Azure Portal.

Omówienie opcji uwierzytelniania

Wiele nowoczesnych aplikacji internetowych jest tworzonych jako aplikacje jednostronicowe po stronie klienta ("SPAs"). Deweloperzy piszą je przy użyciu języka JavaScript lub struktury SPA, takiej jak Angular, Vue i React. Te aplikacje działają w przeglądarce internetowej i mają różne cechy uwierzytelniania niż tradycyjne aplikacje internetowe po stronie serwera.

Usługa Azure AD B2C udostępnia dwie opcje umożliwiające logowanie użytkowników jednostronicowych i uzyskiwanie tokenów w celu uzyskiwania dostępu do usług zaplecza lub internetowych interfejsów API:

Przepływ kodu autoryzacji (z PKCE)

Przepływ kodu autoryzacji OAuth 2.0 (z protokołem PKCE) umożliwia aplikacji wymianę kodu autoryzacji tokenów identyfikatorów w celu reprezentowania uwierzytelnionego użytkownika i tokenów dostępu wymaganych do wywoływania chronionych interfejsów API. Ponadto zwraca tokeny odświeżania , które zapewniają długoterminowy dostęp do zasobów w imieniu użytkowników bez konieczności interakcji z tymi użytkownikami.

Jest to zalecane podejście. Posiadanie tokenów odświeżania o ograniczonym okresie istnienia pomaga aplikacji dostosować się do nowoczesnych ograniczeń prywatności plików cookie przeglądarki, takich jak Safari ITP.

Aby skorzystać z tego przepływu, aplikacja może używać biblioteki uwierzytelniania, która ją obsługuje, na przykład MSAL.js.

Single-page applications-auth

Niejawny przepływ udzielania

Niektóre biblioteki, takie jak MSAL.js 1.x, obsługują tylko niejawny przepływ udzielania lub aplikacje są implementowane w celu korzystania z niejawnego przepływu. W takich przypadkach usługa Azure AD B2C obsługuje niejawny przepływ OAuth 2.0. Niejawny przepływ udzielania umożliwia aplikacji uzyskanie identyfikatorów i tokenów dostępu . W przeciwieństwie do przepływu kodu autoryzacji niejawny przepływ udzielania nie zwraca tokenu Odświeżanie.

Single-page applications-implicit

Ten przepływ uwierzytelniania nie obejmuje scenariuszy aplikacji korzystających z międzyplatformowych struktur Języka JavaScript, takich jak Electron i React-Native. Scenariusze te wymagają dalszych możliwości interakcji z platformami natywnymi.

Wymagania wstępne

  • Jeśli nie masz subskrypcji platformy Azure, przed rozpoczęciem utwórz bezpłatne konto.

  • Jeśli nie masz dzierżawy usługi Azure AD B2C, utwórz go teraz. Możesz użyć istniejącej dzierżawy usługi Azure AD B2C.

Rejestrowanie aplikacji SPA

  1. Zaloguj się w witrynie Azure Portal.

  2. Jeśli masz dostęp do wielu dzierżaw, wybierz ikonę Ustawienia w górnym menu, aby przełączyć się do dzierżawy usługi Azure AD B2C z menu Katalogi i subskrypcje.

  3. W witrynie Azure Portal wyszukaj i wybierz pozycję Azure AD B2C.

  4. Wybierz pozycję Rejestracje aplikacji, a następnie wybierz pozycję Nowa rejestracja.

  5. Wprowadź nazwę aplikacji. Na przykład spaapp1.

  6. W obszarze Obsługiwane typy kont wybierz pozycję Konta w dowolnym dostawcy tożsamości lub katalogu organizacyjnym (na potrzeby uwierzytelniania użytkowników za pomocą przepływów użytkownika)

  7. W obszarze Identyfikator URI przekierowania wybierz pozycję Aplikacja jednostronicowa (SPA), a następnie wprowadź https://jwt.ms w polu tekstowym Adres URL.

    Identyfikator URI przekierowania to punkt końcowy, w którym serwer autoryzacji (w tym przypadku usługa Azure AD B2C) wysyła użytkownika po zakończeniu interakcji z użytkownikiem. Ponadto punkt końcowy identyfikatora URI przekierowania odbiera token dostępu lub kod autoryzacji po pomyślnym uwierzytelnieniu. W aplikacji produkcyjnej zazwyczaj jest to publicznie dostępny punkt końcowy, w którym aplikacja jest uruchomiona, na przykład https://contoso.com/auth-response. W celach testowych, takich jak ten przewodnik, można ustawić go na , należącą do https://jwt.msfirmy Microsoft aplikację internetową, która wyświetla zdekodowana zawartość tokenu (zawartość tokenu nigdy nie opuszcza przeglądarki). Podczas tworzenia aplikacji możesz dodać punkt końcowy, w którym aplikacja nasłuchuje lokalnie, na przykład http://localhost:5000. W dowolnym momencie możesz dodawać i modyfikować identyfikatory URI przekierowania w zarejestrowanych aplikacjach.

    Następujące ograniczenia dotyczą identyfikatorów URI przekierowania:

    • Adres URL odpowiedzi musi zaczynać się od schematu https, chyba że jest używany .localhost
    • W adresie URL odpowiedzi jest uwzględniana wielkość liter. Jego wielkość liter musi być zgodna ze wielkością ścieżki adresu URL uruchomionej aplikacji. Jeśli na przykład aplikacja zawiera jako część ścieżki .../abc/response-oidc, nie należy określać .../ABC/response-oidc w adresie URL odpowiedzi. Ponieważ przeglądarka internetowa traktuje ścieżki jako wrażliwe na wielkość liter, pliki cookie skojarzone z usługą .../abc/response-oidc mogą zostać wykluczone w przypadku przekierowania do niezgodnego .../ABC/response-oidc adresu URL.

  8. W obszarze Uprawnienia zaznacz pole wyboru Udziel zgody administratora na otwieranie i offline_access uprawnienia .

  9. Wybierz opcję Zarejestruj.

Włączanie przepływu niejawnego

Jeśli używasz biblioteki MSAL.js 1.3 lub starszej wersji z niejawnym przepływem udzielania w aplikacji SPA lub jeśli skonfigurujesz https://jwt.ms/ aplikację do testowania przepływu użytkownika lub zasad niestandardowych, musisz włączyć niejawny przepływ udzielania w rejestracji aplikacji:

  1. W menu po lewej stronie w obszarze Zarządzanie wybierz pozycję Uwierzytelnianie.

  2. W obszarze Niejawne udzielanie i przepływy hybrydowe zaznacz pola wyboru Tokeny dostępu (używane dla przepływów niejawnych) i Tokeny identyfikatorów (używane w przypadku przepływów niejawnych i hybrydowych).

  3. Wybierz pozycję Zapisz.

Jeśli aplikacja używa biblioteki MSAL.js 2.0 lub nowszej, nie włączaj niejawnego przyznawania przepływu, ponieważ biblioteka MSAL.js 2.0+ obsługuje przepływ kodu autoryzacji przy użyciu protokołu PKCE.

Migrowanie z niejawnego przepływu

Jeśli masz istniejącą aplikację korzystającą z niejawnego przepływu, zalecamy przeprowadzenie migracji do korzystania z przepływu kodu autoryzacji przy użyciu platformy, która ją obsługuje, na przykład MSAL.js 2.0+.

Gdy wszystkie produkcyjne SPA reprezentowane przez rejestrację aplikacji zaczynają korzystać z przepływu kodu autoryzacji, wyłącz niejawne ustawienia przepływu udzielania w następujący sposób:

  1. W menu po lewej stronie w obszarze Zarządzanie wybierz pozycję Uwierzytelnianie.
  2. W obszarze Niejawne udzielanie usuń zaznaczenie pól wyboru Tokeny dostępu i Tokeny identyfikatorów.
  3. Wybierz pozycję Zapisz.

Aplikacje korzystające z przepływu niejawnego mogą nadal działać, jeśli pozostawisz włączony niejawny przepływ (zaznaczone).

Następne kroki

Dowiedz się, jak tworzyć przepływy użytkowników w usłudze Azure Active Directory B2C.