Skip to content

A single page app implemented using Angular 7, ASP.NET Core 2.1 and Azure AD B2C.

License

Notifications You must be signed in to change notification settings

3DSemantix/angular-asp.net-core-aad-b2c

Repository files navigation

Angular + ASP.NET Core + AAD B2C

A single page app implemented using Angular 7, ASP.NET Core 2.1 and Azure AD B2C.

Synopsis

This is a fully functionnal ASP.NET Core 2.1 and Angular 7 application, using Azure Active Directory B2C to handle authentication based on the OAuth 2.0 authorization flow.

Here are some of the provided functionnalities:

  • Sign-in/Sign-out/Register via AAD B2C
  • Retrieve access_token and refresh_token from AAD B2C authorization response code
  • Access AAD B2C protected API with retrieved access_token
  • Restrict Angular pages on current authentication status
  • Auto refresh the access_token when needed using the refresh_token
  • Support the sliding window option (token lifetime configuration)
  • Support multiples configurations based on environment variables (usefull in Azure Deployement Slots)

Getting Started

Prerequisites

Node.js Installed

.NET Core Installed

Setup the project

Copy the appsettings.json file and rename it as appsettings.Development.json.

Set your appsettings.Development.json file with your own AAD B2C informations:

"OauthValues": {
	"AadInstance": "https://login.microsoftonline.com/{0}/v2.0/.well-known/openid-configuration?p={1}",
	"ClientId": "00000000-0000-0000-0000-00000000000",
	"ClientSecret": "your_client_secret",
	"Tenant": "your_website.onmicrosoft.com",
	"SignInPolicyId": "YOUR_SIGN_IN_POLICY",
	"SignUpPolicyId": "YOUR_SIGN_UP_POLICY",
	"GetAccessScopes": "offline_access https://your_website.onmicrosoft.com/YOUR_APP/application.claim",
	"RedirectUri": "http://localhost:4200/",
	"RefreshTokenSlidingWindowLifetime": 80
}

Angular CLI

If you never installed Angular CLI, run:

npm install @angular/cli --global

Run the project

Open and launch the project directly from Visual Studio.

Visual Studio should restore npm packages, if it fails, run inside the \ClientApp folder the following command:

npm install

License

This project is licensed under the MIT License - see the LICENSE file for details

Acknowledgments

Thanks to Levi Fuller for his tutorial: How to build an Angular Application with ASP.NET Core in Visual Studio 2017, visualized

About

A single page app implemented using Angular 7, ASP.NET Core 2.1 and Azure AD B2C.

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published