Esercitazione: connettere un'app JavaScript a Microsoft 365

Completato

In questo esercizio si creerà un'app JavaScript connessa a Microsoft 365. Si userà la libreria JavaScript di Microsoft Authentication Library per consentire agli utenti di accedere all'app con il proprio account Microsoft 365. Per visualizzare il nome degli utenti, si userà Microsoft Graph JavaScript SDK.

Eseguire l'app

  1. Per ottenere il codice iniziale dell'app usato in questo esercizio, scegliere una delle opzioni seguenti:

    Se si usa Git, clonare il progetto usando il comando Git Clone:

    git clone https://github.com/MicrosoftDocs/mslearn-retrieve-m365-data-with-msgraph-quickstart.git
    

    Se non si usa Git, passare a https://github.com/MicrosoftDocs/mslearn-retrieve-m365-data-with-msgraph-quickstart nel Web browser. Selezionare il pulsante Code (Codice) e quindi scegliere Download ZIP (Scarica ZIP). Estrarre il file con estensione zip nel computer.

  2. Aprire la cartella nell'editor di codice.

  3. Aprire il file auth.js e trovare la costante msalConfig:

    const msalConfig = {
        auth: { .. }
    }
    
  4. Sostituire il valore della clientId proprietà con il valore dell'ID applicazione (client) copiato dall'applicazione Microsoft Entra (spa-aad-app) registrata in precedenza. È possibile ottenere questo valore dalla pagina di panoramica dell'applicazione Microsoft Entra (spa-aad-app).

  5. Nello stesso fileauth.js trovare la msalConfig.auth.authority proprietà . Sostituire il <your directory ID here> valore con il valore ID directory (tenant) dell'applicazione Microsoft Entra (spa-aad-app) registrata in precedenza. È possibile ottenere questo valore dalla pagina di panoramica dell'applicazione Microsoft Entra (spa-aad-app).

    La msalConfig costante dovrebbe essere simile al codice seguente, con gli ID univoci del tenant di Microsoft Entra e dell'applicazione registrata:

    const msalConfig = {
      auth: {
        clientId: 'b1a37248-53b5-430c-b946-ef83521af70c',
        authority: 'https://login.microsoftonline.com/b930540b-a147-45bb-8f24-bfbed091aa25',
        redirectUri: 'http://localhost:8080'
      }
    };
    
  6. Visualizzare in anteprima l'app Web eseguendo il comando seguente nel terminale:

    npm start
    
  7. Il browser predefinito dovrebbe aprirsi e puntare a http://localhost:8080.

  8. Selezionare il pulsante Accedi con Microsoft per accedere con l'account Microsoft 365.

  9. Dopo aver eseguito l'accesso con l'account e aver fornito il consenso all'app, l'app dovrebbe visualizzare il nome utente.

  10. Arrestare il server Node.js selezionando CTRL+C nella finestra del terminale.