Skip to content

Latest commit

 

History

History
 
 

angular17-standalone-sample

README.md

Angular 17 Standalone MSAL Angular v3 Sample

This developer sample is used to demonstrate how to use @azure/msal-angular with Angular standalone components, and does not use the MsalModule or NgModule. Please see Angular's docs on standalone for more information.

This project was generated with Angular CLI version 17.3.3, and uses Angular 17's application builder, but does not demonstrate use of server-side and prerendering capabilities. See Angular's docs for more details.

How to run the sample

Pre-requisites

Configure the application

  • Open ./src/app/app.config.ts in an editor.
  • Replace client ID with the Application (client) ID from the portal registration, or use the currently configured lab registration.
    • Optionally, you may replace any of the other parameters (tenant ID, redirect URI, scopes, etc.), or you can remove them and use the default values.
  • You can also change the client ID, tenant ID, or scopes in the ./src/environments folder.

Running the sample

  • In a command prompt, run npm run start.
  • Navigate to http://localhost:4200
  • In the web page, click on the "Login" button. The app will automatically reload if you change any of the source files.

Local development

If you are trying to run this sample locally in the MSAL.js repo, run npm run build before npm run start to install a tarball file of MSAL Angular.

Additional notes

  • This sample does not use the MsalRedirectComponent, but subscribes to handleRedirectObservable in the app.component.ts file. See our doc on redirects for more information.
  • The default interaction type for the sample is redirects. The sample can be configured to use redirects by changing the interactionType in main.ts to InteractionType.Popup.