Migrowanie jednostronicowej aplikacji JavaScript z niejawnego udzielenia do przepływu kodu uwierzytelniania
Biblioteka uwierzytelniania firmy Microsoft dla języka JavaScript (MSAL.js) w wersji 2.0 zapewnia obsługę przepływu kodu autoryzacji za pomocą protokołu PKCE i mechanizmu CORS w aplikacjach jednostronicowych na platformie tożsamości Microsoft. Wykonaj kroki opisane w poniższych sekcjach, aby przeprowadzić migrację aplikacji MSAL.js 1.x przy użyciu niejawnego udzielania zgody do MSAL.js 2.0 lub nowszej (poniżej 2.x) oraz przepływu kodu uwierzytelniania.
MSAL.js 2.x wprowadza ulepszenia względem MSAL.js 1.x, obsługując w przeglądarce przepływ kodu autoryzacji zamiast niejawnego przepływu udzielania. MSAL.js 2.x nie obsługuje implicit flow.
Kroki migracji
Aby zaktualizować aplikację do MSAL.js 2.x i przepływu kodu uwierzytelniania, istnieją trzy podstawowe kroki:
- Przełącz docelowe identyfikatory URI rejestracji aplikacji z platformy Web na platformę aplikacji jednostronicowej.
- Zaktualizuj kod z MSAL.js 1.x do wersji 2.x.
- Wyłącz niejawne przyznawanie dostępu w rejestracji aplikacji, kiedy wszystkie aplikacje udostępniające rejestrację zostały zaktualizowane do MSAL.js 2.x i przepływu kodu autoryzacyjnego.
W poniższych sekcjach opisano każdy krok szczegółowo.
Przełączanie identyfikatorów URI przekierowania do platformy SPA
Jeśli chcesz nadal używać istniejącej rejestracji dla swoich aplikacji, skorzystaj z centrum administracyjnego Microsoft Entra, aby zaktualizować adresy URL przekierowania rejestracji na platformę SPA. To umożliwia przepływ kodu autoryzacji z obsługą protokołu PKCE i mechanizmu CORS dla aplikacji korzystających z rejestracji (nadal musisz zaktualizować kod swojej aplikacji do wersji MSAL.js v2.x).
Wykonaj następujące kroki dla rejestracji aplikacji, które są obecnie skonfigurowane z użyciem adresów przekierowania platformy internetowej:
Zaloguj się do centrum administracyjnego usługi Microsoft Entra.
Przejdź do Tożsamość>Aplikacje>Rejestracje aplikacji, wybierz swoją aplikację, a następnie Uwierzytelnianie.
Na kafelku Web platformy w obszarze URI przekierowania wybierz baner ostrzegawczy wskazujący, że należy przeprowadzić migrację identyfikatorów URI.
Wybierz tylko te identyfikatory URI przekierowania, których aplikacje będą używać MSAL.js 2.x, a następnie wybierz pozycję Konfiguruj.
Te identyfikatory URI przekierowania powinny być teraz wyświetlane na kafelku platformy aplikacji jednostronicowej, pokazujące, że obsługa mechanizmu CORS z przepływem kodu autoryzacji i funkcją PKCE jest włączona dla tych identyfikatorów URI.
Możesz również zarejestrować nową aplikację zamiast aktualizować adresy URI przekierowania w istniejącej rejestracji.
Aktualizowanie kodu do MSAL.js 2.x
W wersji MSAL 1.x utworzono wystąpienie aplikacji, inicjując UserAgentApplication w następujący sposób:
// MSAL 1.x
import * as msal from "msal";
const msalInstance = new msal.UserAgentApplication(config);
W MSAL 2.x zainicjuj aplikację [PublicClientApplication][msal-js-publicclientapplication] zamiast.
// MSAL 2.x
import * as msal from "@azure/msal-browser";
const msalInstance = new msal.PublicClientApplication(config);
Aby uzyskać dodatkowe zmiany, które mogą być potrzebne w Twoim kodzie, zobacz przewodnik migracji na GitHub.
Wyłącz ustawienia autoryzacji niejawnej
Po zaktualizowaniu wszystkich aplikacji produkcyjnych korzystających z tej rejestracji aplikacji i jej identyfikatora klienta do MSAL 2.x i przepływu kodu autoryzacji, należy odznaczyć ustawienia niejawnego przyznawania dostępu pod menu Uwierzytelnianie rejestracji aplikacji.
Po usunięciu zaznaczenia ustawień udzielania dostępu w trybie niejawnym w rejestracji aplikacji, przepływ w trybie niejawnym jest wyłączony dla wszystkich aplikacji, które korzystają z tej rejestracji i jej identyfikatora klienta.
Nie wyłączaj niejawnego przepływu udzielania przed zaktualizowaniem wszystkich aplikacji na MSAL.js 2.x i [PublicClientApplication][msal-js-publicclientapplication].
Następne kroki
Aby dowiedzieć się więcej na temat przepływu kodu autoryzacji, w tym różnic między przepływami kodu niejawnego i przepływem kodu autoryzacji, zobacz Platforma tożsamości Microsoft i przepływ kodu autoryzacji OAuth 2.0.
Można dowiedzieć się więcej, tworząc aplikację jednostronicową React (SPA), która loguje użytkowników w ramach poniższej wieloczęściowej serii samouczków.