Microsoft Graph Toolkit MSAL Provider

The Microsoft Graph Toolkit (mgt) library is a collection of authentication providers and UI components powered by Microsoft Graph.

The @microsoft/mgt-msal-provider package exposes the MsalProvider class which uses MSAL.js to sign in users and acquire tokens to use with Microsoft Graph.

See docs for full documentation of the MsalProvider

Usage

1. Install the packages

   npm install @microsoft/mgt-element @microsoft/mgt-msal-provider

2. Initialize the provider in code

   import {Providers} from '@microsoft/mgt-element';
   import {MsalProvider} from '@microsoft/mgt-msal-provider';
   
   // initialize the auth provider globally
   Providers.globalProvider = new MsalProvider({
     clientId: 'clientId',
     scopes?: string[];
     authority?: string;
     redirectUri?: string;
     loginType?: LoginType; // LoginType.Popup or LoginType.Redirect (redirect is default)
     loginHint?: string
     options?: Configuration; // msal js Configuration object
   });

3. Alternatively, initialize the provider in html (only client-id is required):

   <script type="module" src="../node_modules/@microsoft/mgt-msal-provider/dist/es6/index.js" />
   
   <mgt-msal-provider client-id="<YOUR_CLIENT_ID>"
                     login-type="redirect/popup" 
                     scopes="user.read,people.read" 
                     redirect-uri="https://my.redirect/uri" 
                     authority=""> 
   </mgt-msal-provider> 

See provider usage documentation to learn about how to use the providers with the mgt components, to sign in/sign out, get access tokens, call Microsoft Graph, and more.

Sea also

• Microsoft Graph Toolkit docs
• Microsoft Graph Toolkit repository
• Microsoft Graph Toolkit playground