This is an Angular2 single-page application to demonstrate how to use angular2-adal to enable single-sign-on authentication against Microsoft Windows Azure AD.
- Create an Azure AD on Azure Portal.
- Create or add some users to the AD.
- Add an application ('my organization is developing') to the AD with the properties as the below:
- Name: any
- Type: Web Application and/or Web API
- Sign-on URL: http://localhost:3002/
- App ID URL: http://myapp/localhost-3002
- When creating your app successfully, go to the 'Configure' page of your app, make sure 'User assignment required to access app' is 'NO'.
- Copy 'Client ID' (a GUID) on the 'Configure' page and remember it.
- Clone this repository to your local machine.
- Go to the 'src/app/services' directory and rename 'secret.service.ts.template' to 'secret.service.ts'.
- Edit 'secret.service.ts', replacing the 'tenant' value by your AD name (should be a complete domain name, e.g. myad.onmicrosoft.com); replacing the 'clientId' value by your app's client ID.
- Run 'npm install'.
- Run 'gulp build'.
- Run 'npm start' and wait for the 'welcome' page to pop up.
- First you will see the 'welcome' page which does not require any user identity.
- If you click 'login', you will be redirected to the Azure AD login page.
- When you login successfully, you will be redirected back to the 'home' page which requires a valid user identity.
- If you click 'logout', you will be redirected to the Azure AD logout page, and then redirected back to the 'welcome' page automatically after several seconds.
- Note if you try to access the 'home' page without a valid identity, you will be redirected to the 'welcome' page.
