Initiera klientprogram med hjälp av MSAL.js

Artikel
03/05/2024

I den här artikeln beskrivs initieringen av Microsoft Authentication Library for JavaScript (MSAL.js) med en instans av ett användaragentprogram.

Användaragentprogrammet är en form av offentligt klientprogram där klientkoden körs i en användaragent, till exempel en webbläsare. Klienter som dessa lagrar inte hemligheter eftersom webbläsarkontexten är öppet tillgänglig.

Mer information om klientprogramtyper och programkonfigurationsalternativ finns i Offentliga och konfidentiella klientappar i MSAL.

Förutsättningar

Innan du initierar ett program måste du först registrera det i administrationscentret för Microsoft Entra och upprätta en förtroenderelation mellan ditt program och Microsofts identitetsplattform.

När du har registrerat din app behöver du några eller alla av följande värden som finns i administrationscentret för Microsoft Entra.

Värde	Obligatoriskt	Beskrivning
App-ID (klient-ID)	Obligatoriskt	Ett GUID som unikt identifierar ditt program inom Microsofts identitetsplattform.
Utfärdare	Valfritt	Identitetsproviderns URL (instansen) och inloggningspubliken för ditt program. Instans- och inloggningspubliken utgör utfärdaren när den sammanfogas.
Katalog-ID (klientorganisation)	Valfritt	Ange katalog-ID (klientorganisation) om du skapar ett verksamhetsspecifikt program enbart för din organisation, vilket ofta kallas för ett program med en enda klientorganisation.
Omdirigerings-URI	Valfritt	Om du skapar en webbapp `redirectUri` anger du var identitetsprovidern (Microsofts identitetsplattform) ska returnera de säkerhetstoken som den har utfärdat.

Initiera MSAL.js 2.x-appar

Initiera MSAL.js-autentiseringskontexten genom att instansiera en PublicClientApplication med ett konfigurationsobjekt . Den minsta nödvändiga konfigurationsegenskapen clientID är programmets, som visas som program-ID (klient)-ID på sidan Översikt för appregistreringen i administrationscentret för Microsoft Entra.

Här är ett exempel på konfigurationsobjekt och instansiering av en PublicClientApplication:

const msalConfig = {
  auth: {
    clientId: "Enter_the_Application_Id_Here",
    authority: "https://login.microsoftonline.com/Enter_the_Tenant_Info_Here",
    knownAuthorities: [],
    redirectUri: "https://localhost:{port}/redirect",
    postLogoutRedirectUri: "https://localhost:{port}/redirect",
    navigateToLoginRequestUrl: true,
  },
  cache: {
    cacheLocation: "sessionStorage",
    storeAuthStateInCookie: false,
  },
  system: {
    loggerOptions: {
      loggerCallback: (
        level: LogLevel,
        message: string,
        containsPii: boolean
      ): void => {
        if (containsPii) {
          return;
        }
        switch (level) {
          case LogLevel.Error:
            console.error(message);
            return;
          case LogLevel.Info:
            console.info(message);
            return;
          case LogLevel.Verbose:
            console.debug(message);
            return;
          case LogLevel.Warning:
            console.warn(message);
            return;
        }
      },
      piiLoggingEnabled: false,
    },
    windowHashTimeout: 60000,
    iframeHashTimeout: 6000,
    loadFrameTimeout: 0,
  },
};

// Create an instance of PublicClientApplication
const msalInstance = new PublicClientApplication(msalConfig);

// Handle the redirect flows
msalInstance
  .handleRedirectPromise()
  .then((tokenResponse) => {
    // Handle redirect response
  })
  .catch((error) => {
    // Handle redirect error
  });

`handleRedirectPromise`

Anropa handleRedirectPromise när programmet använder omdirigeringsflöden. När du använder omdirigeringsflöden handleRedirectPromise ska köras vid varje sidinläsning.

Tre resultat är möjliga från löftet:

.then anropas och tokenResponse är sanningsenligt: Programmet returneras från en omdirigeringsåtgärd som lyckades.
.then anropas och tokenResponse är falsy (null): Programmet returneras inte från en omdirigeringsåtgärd.
.catch anropas: Programmet returneras från en omdirigeringsåtgärd och det uppstod ett fel.

Initiera MSAL.js 1.x-appar

Initiera MSAL 1.x-autentiseringskontexten genom att instansiera en UserAgentApplication med ett konfigurationsobjekt. Den minsta nödvändiga konfigurationsegenskapen clientID är för ditt program, som visas som program-ID (klient) på sidan Översikt för appregistreringen i administrationscentret för Microsoft Entra.

För autentiseringsmetoder med omdirigeringsflöden (loginRedirect och acquireTokenRedirect) i MSAL.js 1.2.x eller tidigare måste du uttryckligen registrera ett återanrop för att lyckas eller fel via handleRedirectCallback() metoden. Explicit registrering av återanrop krävs i MSAL.js 1.2.x och tidigare eftersom omdirigeringsflöden inte returnerar löften som metoderna med en popup-upplevelse. Det är valfritt att registrera återanropet i MSAL.js version 1.3.x och senare.

// Configuration object constructed
const msalConfig = {
  auth: {
    clientId: "Enter_the_Application_Id_Here",
  },
};

// Create UserAgentApplication instance
const msalInstance = new UserAgentApplication(msalConfig);

function authCallback(error, response) {
  // Handle redirect response
}

// Register a redirect callback for Success or Error (when using redirect methods)
// **REQUIRED** in MSAL.js 1.2.x and earlier
// **OPTIONAL** in MSAL.js 1.3.x and later
msalInstance.handleRedirectCallback(authCallback);

Enskild instans och konfiguration

Både MSAL.js 1.x och 2.x är utformade för att ha en enda instans och konfiguration av UserAgentApplication eller PublicClientApplication, för att representera en enda autentiseringskontext.

Flera instanser av UserAgentApplication eller PublicClientApplication rekommenderas inte eftersom de kan orsaka motstridiga cacheposter och beteende i webbläsaren.

Nästa steg

Kodexemplet MSAL.js 2.x på GitHub visar instansiering av en PublicClientApplication med ett konfigurationsobjekt :

Dela via