You are on page 1of 18

CT071-3-3-DDAC Introduction to Identity Framework in ASP.

NET Core

Lab 2.1 – Introduction to Identity Framework in ASP.NET Core


Estimated usage time: 1 Hour 30 Minutes

ASP.NET Core Identity:


• Is an API that supports user interface (UI) login functionality.
• Manages users, passwords, profile data, roles, claims, tokens, email confirmation, and more.

Users can create an account with the login information stored in Identity or they can use an external login
provider. Supported external login providers include Facebook, Google, Microsoft Account, and Twitter.
Identity is typically configured using a SQL Server database to store usernames, passwords, and profile
data. In this topic, you learn how to use Identity to register, log in, and log out a user.

Note:
The templates treat username and email as the same for users.

a. Integrate authentication function to existing project.


(Estimated Total Time Used: 30 minutes)

1. Continued from the Lab 1.4 project.


2. From Solution Explorer, right-click on the project name > Add > New Scaffolded Item.

Level 3 Asia Pacific University of Technology & Innovation Page 1 of 18


CT071-3-3-DDAC Introduction to Identity Framework in ASP.NET Core

3. From the left pane of the Add New Scaffolded Item dialog, tap Identity. Then, select the
Identity and tap Add.

4. In the Add Identity dialog, add the following options:

• Check the following files to override:


1. Account/Login
2. Account/Register
3. Account/Manage/Index

Level 3 Asia Pacific University of Technology & Innovation Page 2 of 18


CT071-3-3-DDAC Introduction to Identity Framework in ASP.NET Core

• Tap the + button in data context class column to create a new Data Context (Database) class
for the identity function.
• In the Add Data Context dialog -

• Use the default data context type name and tap Add:
MVC_APU_FlowerShop2023.Data.MVC_APU_FlowerShop2023Context.

NOTE:
The system will use your project name as the base name of the SQL database name.

• Lastly, tap Create.


• Tap the + button in user class column to create a sub-user class so that it can be used to modify
the current properties or add a new property to the current identity table.
• In the Add User Class dialog -

• Use the default user class type name and tap Add: MVC_APU_FlowerShop2023User.

Level 3 Asia Pacific University of Technology & Innovation Page 3 of 18


CT071-3-3-DDAC Introduction to Identity Framework in ASP.NET Core

• Once the Add Identity dialog is done (as shown as below), tap Add button.

5. Lastly, a folder named “Areas” will be appearing in the Solution Explorer corner. The
screenshot as below:

Level 3 Asia Pacific University of Technology & Innovation Page 4 of 18


CT071-3-3-DDAC Introduction to Identity Framework in ASP.NET Core

6. In your appsettings.json, you will see the database connection is auto generated and
attached in the file (shown as below).

7. Open your "MVC_APU_FlowerShop2023Context.cs" file and make sure no errors are


found. If an error occurs, please edit until there is no error.

8. Open your "Program.cs" file and make sure no errors are found. If an error occurs, please
edit until there is no error.

9. Once your project gets screens similar to the above, it means Identity Framework Core is
now integrated with your project. You can now start designing registration pages, login
pages, and user profile pages in your application.

Level 3 Asia Pacific University of Technology & Innovation Page 5 of 18


CT071-3-3-DDAC Introduction to Identity Framework in ASP.NET Core

b. Add the registration, login, and user profile pages in your existing project.
(Estimated Total Time Used: 30 minutes)

1. From Solution Explorer, expand the Views folder.


2. Then, expand the Shared folder.
3. Open the _Layout.cshtml.

Level 3 Asia Pacific University of Technology & Innovation Page 6 of 18


CT071-3-3-DDAC Introduction to Identity Framework in ASP.NET Core

4. Now, add the <partial name="_LoginPartial" /> into the _Layout.html.

Level 3 Asia Pacific University of Technology & Innovation Page 7 of 18


CT071-3-3-DDAC Introduction to Identity Framework in ASP.NET Core

5. Now, need to enable authentication feature in your project.


6. Start the Program.cs file, modify the below section:

• Add the sentences of builder.Services.AddRazorPages();.

• Add app.UseAuthentication(); after app.UseRouting(); but before the


app.UseAuthorization();

Level 3 Asia Pacific University of Technology & Innovation Page 8 of 18


CT071-3-3-DDAC Introduction to Identity Framework in ASP.NET Core

• In the app.MapControllerRoute();, add app.MapRazorPages();

7. Tap F5 to run the app in debug mode or Ctrl-F5 in non-debug mode. You will now see
that the register and login buttons appear on the website.

Level 3 Asia Pacific University of Technology & Innovation Page 9 of 18


CT071-3-3-DDAC Introduction to Identity Framework in ASP.NET Core

If you were running in debug mode, tap Shift-F5 to stop debugging.

Level 3 Asia Pacific University of Technology & Innovation Page 10 of 18


CT071-3-3-DDAC Introduction to Identity Framework in ASP.NET Core

c. Create database for the Authentication Feature


(Estimated Total Time Used: 30 minutes)

1. To create a database for storing user information, you must use the Package Manager
Console (PMC).
2. To start the PMC, click on the Tools > NuGet Package Manager > Package Manager
Console.

3. In the Visual Studio Package Manager Console, type the below commands:

Add-Migration CreateIdentitySchema

OR

Level 3 Asia Pacific University of Technology & Innovation Page 11 of 18


CT071-3-3-DDAC Introduction to Identity Framework in ASP.NET Core

If an error occurs as below, please follow the following step. Otherwise, ignore this
step!

Level 3 Asia Pacific University of Technology & Innovation Page 12 of 18


CT071-3-3-DDAC Introduction to Identity Framework in ASP.NET Core

A migration code will be generated after the add-migration command. This migration code
will create the structural schema of the tables for the new database.

After creating a migration file using the add-migration command, you must update the
database. Execute the Update-Database command to create or modify a database schema.

Update-Database

Level 3 Asia Pacific University of Technology & Innovation Page 13 of 18


CT071-3-3-DDAC Introduction to Identity Framework in ASP.NET Core

4. Now, in Visual Studio, open the SQL Server Object Explorer (SSOX).

5. To connect to the local SQL database in SSOX, follow the below step.

Level 3 Asia Pacific University of Technology & Innovation Page 14 of 18


CT071-3-3-DDAC Introduction to Identity Framework in ASP.NET Core

6. Once you connected to the local SQL database, you will see your database
“MVC_APU_FlowerShop2023” located in the SQL Server and all the default tables are
under the database.

Level 3 Asia Pacific University of Technology & Innovation Page 15 of 18


CT071-3-3-DDAC Introduction to Identity Framework in ASP.NET Core

7. Once every above step is done, let’s test the application now.
a. Register a new user.

b. Click on the “Click here to confirm your account.” to verify your account.

Level 3 Asia Pacific University of Technology & Innovation Page 16 of 18


CT071-3-3-DDAC Introduction to Identity Framework in ASP.NET Core

c. Click on the Login button now. Use the previous user credentials to login.

d. Select the new username (next to the Logout link). You might need to expand the
window or select the navigation bar icon to show the username and other links.

Level 3 Asia Pacific University of Technology & Innovation Page 17 of 18


CT071-3-3-DDAC Introduction to Identity Framework in ASP.NET Core

e. Select the Personal Data tab.


f. Select the Download button and examine the PersonalData.json file.

g. Test the Delete button, which deletes the logged-on user.

Summary:
• We have learnt how to create a simple authentication feature in an existing ASP .Net Core Web
Application in Visual Studio.

Level 3 Asia Pacific University of Technology & Innovation Page 18 of 18

You might also like