Migrowanie z biblioteki MSAL w wersji 1.x do biblioteki MSAL w wersji 2.x

Jeśli dopiero zaczynasz korzystać z biblioteki MSAL, zacznij tutaj. Jeśli pochodzisz z biblioteki MSAL w wersji 1.x, możesz skorzystać z tego przewodnika, aby zaktualizować kod, aby użyć biblioteki MSAL w wersji 2.x

1. Aktualizowanie rejestracji aplikacji

Przejdź do centrum administracyjnego Microsoft Entra dla Twojej dzierżawy i przejrzyj sekcję Rejestracje aplikacji. Możesz utworzyć nową rejestrację dla biblioteki MSAL 2.x lub zaktualizować istniejącą rejestrację na potrzeby rejestracji używanej dla biblioteki MSAL 1.x.

2. Dodawanie msal-browser pakietu do projektu

Za pomocą narzędzia npm użyj następującego polecenia:

npm install @azure/msal-browser

3. Aktualizowanie kodu

W MSAL 1.x tworzono instancję aplikacji, jak poniżej:

import * as msal from "msal";

const msalInstance = new msal.UserAgentApplication(config);

W formacie MSAL 2.x można go zaktualizować, aby użyć nowego PublicClientApplication obiektu.

import * as msal from "@azure/msal-browser";

const msalInstance = new msal.PublicClientApplication(config);

Mogą istnieć niewielkie różnice w obiekcie konfiguracji, który jest przekazywany. Jeśli przekazujesz bardziej zaawansowaną konfigurację do UserAgentApplication obiektu, zobacz tutaj , aby uzyskać więcej informacji na temat nowych opcji konfiguracji obiektów aplikacji.

Sygnatury obiektów żądań i odpowiedzi zostały zmienione — acquireTokenSilent teraz ma oddzielny podpis obiektu od interakcyjnych interfejsów API. Aby uzyskać więcej informacji na temat konfigurowania interfejsów API żądań, zobacz tutaj .

Większość interfejsów API z biblioteki MSAL 1.x została przeniesiona do biblioteki MSAL 2.x bez zmian. Niektóre funkcje zostały usunięte:

  • handleRedirectCallback
  • urlContainsHash
  • getCurrentConfiguration
  • getLoginInProgress
  • getAccount
  • getAccountState
  • isCallback

W bibliotece MSAL 2.x obsługa odpowiedzi z fragmentu adresu URL (hash) jest operacją asynchroniczną, ponieważ MSAL przeprowadza wymianę tokenu, gdy tylko odczyta z odpowiedzi kod autoryzacji. W związku z tym podczas wykonywania wywołań przekierowania biblioteka MSAL udostępnia handleRedirectPromise funkcję, która zwróci obietnicę, która zostanie rozwiązana, gdy przekierowanie zostało w pełni obsłużone przez bibliotekę MSAL. W przypadku korzystania z metody przekierowania strona używana w roli redirectUri musi implementować handleRedirectPromise, aby zapewnić prawidłową obsługę odpowiedzi oraz zapisywanie tokenów w pamięci podręcznej podczas powrotu z przekierowania.

const myMSALObj = new msal.PublicClientApplication(msalConfig); 

// Register Callbacks for Redirect flow
myMSALObj.handleRedirectPromise().then((tokenResponse) => {
    let accountObj = null;
    if (tokenResponse !== null) {
        accountObj = tokenResponse.account;
        const id_token = tokenResponse.idToken;
        const access_token = tokenResponse.accessToken;
    } else {
        const currentAccounts = myMSALObj.getAllAccounts();
        if (!currentAccounts || currentAccounts.length === 0) {
            // No user signed in
            return;
        } else if (currentAccounts.length > 1) {
            // More than one user signed in, find desired user with getAccountByUsername(username)
        } else {
            accountObj = currentAccounts[0];
        }
    }
    
    const username = accountObj.username;
   
}).catch((error) => {
    handleError(error);
});

function signIn() {
    myMSALObj.loginRedirect(loginRequest);
}

async function getTokenRedirect(request) {
    return await myMSALObj.acquireTokenSilent(request).catch(error => {
        this.logger.info("silent token acquisition fails. acquiring token using redirect");
        // fallback to interaction when silent call fails
        return myMSALObj.acquireTokenRedirect(request)
    });
}

Podczas wywołań loginPopup, acquireTokenPopup lub acquireTokenSilent możesz oczekiwać na spełnienie obietnicy.

const myMSALObj = new msal.PublicClientApplication(msalConfig); 

async function signIn(method) {
    try {
        const loginResponse = await myMSALObj.loginPopup(loginRequest);
    } catch (err) {
        handleError(error);
    }

    const currentAccounts = myMSALObj.getAllAccounts();
    if (!currentAccounts || currentAccounts.length === 0) {
        // No user signed in
        return;
    } else if (currentAccounts.length > 1) {
        // More than one user signed in, find desired user with getAccountByUsername(username)
    } else {
        accountObj = currentAccounts[0];
    }
}

async function getTokenPopup(request) {
    return await myMSALObj.acquireTokenSilent(request).catch(async (error) => {
        this.logger.info("silent token acquisition fails. acquiring token using popup");
        // fallback to interaction when silent call fails
        return await myMSALObj.acquireTokenPopup(request).catch(error => {
            handleError(error);
        });
    });
}

Aby uzyskać bardziej szczegółowe informacje na temat użycia, zobacz dokumentację logowania i uzyskiwania tokenu .

Tokeny odświeżania są teraz zwracane jako część odpowiedzi tokenowych i są używane przez bibliotekę do odnawiania tokenów dostępu bez interakcji i bez użycia elementów iframe. Aby uzyskać więcej informacji na temat odnawiania tokenów, zobacz dokumentację okresów istnienia tokenów .

Wszystkie inne interfejsy API powinny działać tak jak poprzednio. Zaleca się zapoznać z domyślnym przykładem, aby zobaczyć działający przykład użycia biblioteki MSAL 2.0.