Outlook addin - l'utente deve per forza cliccare sulla dialog per ottenere un token graph?

Question

Salve a tutti.

Sto sviluppando un outlook addin usando Yeoman e React.

Ho seguito una guida Microsoft su come ottenere un token graph usando Msal ed effettivamente sono in grado di ottenerlo e chiamare le api senza problemi.

Il problema è che il modo in cui ottengo il token è che l'utente deve sempre cliccare su un pulsante che apre una dialog dove l'utente deve confermare che ${app} vuole aprire una nuova finestra.
C'è un modo tramite cui l'utente non è forzato a compiere sempre questa azione?

Grazie mille

Answer 1

Gentile Federico,

Per evitare che l'utente debba cliccare sempre su un pulsante e confermare l'apertura di una nuova finestra, puoi implementare l'autenticazione silenziosa usando MSAL (Microsoft Authentication Library). L'autenticazione silenziosa tenta di acquisire un token senza richiedere l'intervento dell'utente, sfruttando un token di aggiornamento (refresh token) o un cookie di sessione esistente.

Ecco come puoi farlo:

Passaggi per Implementare l'Autenticazione Silenziosa

1. Configurazione iniziale di MSAL: Assicurati che la tua configurazione di MSAL sia corretta. Ecco un esempio:

   
      import { PublicClientApplication } from "@azure/msal-browser";
   
      const msalConfig = {
   
        auth: {
   
          clientId: "your-client-id",
   
          authority: "https://login.microsoftonline.com/your-tenant-id",
   
          redirectUri: "your-redirect-uri",
   
        },
   
      };
   
      const msalInstance = new PublicClientApplication(msalConfig);
   
   

2. Acquisizione di un token silenzioso: Usa il metodo acquireTokenSilent di MSAL per tentare di acquisire un token senza l'intervento dell'utente.

   
      import { InteractionRequiredAuthError } from "@azure/msal-browser";
   
      async function getTokenSilent() {
   
        const account = msalInstance.getAllAccounts()[0];
   
        const request = {
   
          scopes: ["User.Read"],
   
          account: account,
   
        };
   
        try {
   
          const response = await msalInstance.acquireTokenSilent(request);
   
          return response.accessToken;
   
        } catch (error) {
   
          if (error instanceof InteractionRequiredAuthError) {
   
            // Se l'autenticazione silenziosa fallisce, chiedi l'interazione dell'utente
   
            return getTokenInteractive();
   
          } else {
   
            console.error(error);
   
            throw error;
   
          }
   
        }
   
      }
   
   

3. Autenticazione interattiva come fallback: Se l'autenticazione silenziosa fallisce (ad esempio, il token è scaduto o non è valido), usa l'autenticazione interattiva come fallback.

   
      async function getTokenInteractive() {
   
        const request = {
   
          scopes: ["User.Read"],
   
        };
   
        try {
   
          const response = await msalInstance.acquireTokenPopup(request);
   
          return response.accessToken;
   
        } catch (error) {
   
          console.error(error);
   
          throw error;
   
        }
   
      }
   
   

4. Chiamare le API con il token: Ora puoi chiamare le API di Microsoft Graph usando il token ottenuto.

   
      async function callGraphApi() {
   
        try {
   
          const token = await getTokenSilent();
   
          const response = await fetch("https://graph.microsoft.com/v1.0/me", {
   
            headers: {
   
              Authorization: `Bearer ${token}`,
   
            },
   
          });
   
          const data = await response.json();
   
          console.log(data);
   
        } catch (error) {
   
          console.error("Errore nella chiamata all'API di Graph", error);
   
        }
   
      }
   
   

Considerazioni

• Consenso degli Utenti: La prima volta che un utente usa la tua applicazione, dovrà comunque fornire il consenso interattivo. Una volta ottenuto il consenso, i futuri accessi possono essere gestiti silenziosamente finché il token di aggiornamento è valido.
• Gestione degli Errori: Assicurati di gestire correttamente gli errori e le eccezioni, specialmente i casi in cui è richiesta l'interazione dell'utente.
• Token di Aggiornamento: MSAL gestisce automaticamente i token di aggiornamento, quindi non dovrai gestirli manualmente.

Seguendo questi passaggi, dovresti essere in grado di ridurre al minimo l'interazione dell'utente per l'autenticazione, migliorando l'esperienza utente della tua applicazione Outlook Add-in.

Spero di essere stata di aiuto

Monica.