Initiera klientprogram med hjälp av MSAL.js

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.

Initiera MSAL.js 2.x-applikationer

Initiera MSAL.js-autentiseringskontexten genom att instansiera ett [PublicClientApplication][msal-js-publicclientapplication] med ett [Configuration][msal-js-configuration] -objekt. 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][msal-js-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 applikationer

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 kan du uttryckligen registrera ett återanrop för lyckad eller misslyckad via handleRedirectCallback() metoden. Explicit registrering av återanrop krävs i MSAL.js 1.2.x och tidigare eftersom omdirigeringsflöden inte returnerar löften på samma sätt som metoderna med en popup-fönsterupplevelse gör. 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][/javascript/api/@azure/msal-browser/publicclientapplication] med ett konfigurationsobjekt