In .Net applications, authentication can be simply accomplished with cookies without using any built-in authentication provider like 'Asp.Net Core Identity', 'Identity Server', 'Auth0', etc. This series is about implementing simple cookie-based authentication in the Blazor Server application.
In this part of the article, we have to accomplish our targets like:
- Creating user authentication tables.
- Creating Blazor Server Application.
- Installing Entity Framework core.
- Configuring Database Context.
Tables For Authentication:
- User - table store user information like 'email', 'password', 'firstname', 'lastname', etc.
- Roles - master table to store the roles like 'admin', 'user', 'manager',etc.
- UserRoles - a mapping table for the 'Users' & 'Roles' table to store the user roles information.
Create Users Table:
CREATE TABLE [dbo].[Users]( [Id] [int] IDENTITY(1,1) NOT NULL, [FirstName] [varchar](256) NULL, [LastName] [varchar](256) NULL, [Email] [varchar](256) NULL, [PasswordHash] [varchar](max) NULL, CONSTRAINT [PK_Users] PRIMARY KEY CLUSTERED ( [Id] ASC )WITH (PAD_INDEX = OFF, STATISTICS_NORECOMPUTE = OFF, IGNORE_DUP_KEY = OFF, ALLOW_ROW_LOCKS = ON, ALLOW_PAGE_LOCKS = ON) ON [PRIMARY] ) ON [PRIMARY] TEXTIMAGE_ON [PRIMARY]Create Roles Table:
CREATE TABLE [dbo].[Roles]( [Id] [int] IDENTITY(1,1) NOT NULL, [Name] [varchar](256) NULL, CONSTRAINT [PK_Roles] PRIMARY KEY CLUSTERED ( [Id] ASC )WITH (PAD_INDEX = OFF, STATISTICS_NORECOMPUTE = OFF, IGNORE_DUP_KEY = OFF, ALLOW_ROW_LOCKS = ON, ALLOW_PAGE_LOCKS = ON) ON [PRIMARY] ) ON [PRIMARY] GOCreate UserRoles Table:
CREATE TABLE [dbo].[UserRoles]( [Id] [int] IDENTITY(1,1) NOT NULL, [UserId] [int] NOT NULL, [RoleId] [int] NOT NULL, CONSTRAINT [PK_UserRoles] PRIMARY KEY CLUSTERED ( [Id] ASC )WITH (PAD_INDEX = OFF, STATISTICS_NORECOMPUTE = OFF, IGNORE_DUP_KEY = OFF, ALLOW_ROW_LOCKS = ON, ALLOW_PAGE_LOCKS = ON) ON [PRIMARY] ) ON [PRIMARY]
Create A Blazor Server Application:
Let's create a .Net6 Blazor WebAssembly sample application to accomplish our demo. We can use either Visual Studio 2022 or Visual Studio Code(using .NET CLI commands) to create any.Net6 application. For this demo, I'm using the 'Visual Studio Code'(using the .NET CLI command) editor.
CLI command
dotnet new blazorwasm -o Your_Project_Name
dotnet new blazorwasm -o Your_Project_Name
Install Entity Framework Core Package:
Now install entity framework core package.
Package Manager
Install-Package Microsoft.EntityFrameworkCore -Version 6.0.1
Install-Package Microsoft.EntityFrameworkCore -Version 6.0.1
.NET CLI
dotnet add package Microsoft.EntityFrameworkCore --version 6.0.1
dotnet add package Microsoft.EntityFrameworkCore --version 6.0.1
Now install entity framework core SQL package.
Package Manager
Install-Package Microsoft.EntityFrameworkCore.SqlServer -Version 6.0.1
Install-Package Microsoft.EntityFrameworkCore.SqlServer -Version 6.0.1
.NET CLI
dotnet add package Microsoft.EntityFrameworkCore.SqlServer --version 6.0.1
dotnet add package Microsoft.EntityFrameworkCore.SqlServer --version 6.0.1
Create Entities Represents Tables:
Let's create the entities to our table that helps to interact with our table by the entity framework core. So create a folder like 'Entities' inside the 'Data' folder.
Data/Entities/Users.cs:
namespace Dot6.Bserver.Cookie.Auth.Data.Entities; public class Users { public int Id { get; set; } public string FirstName { get; set; } public string LastName { get; set; } public string Email { get; set; } public string PasswordHash { get; set; } }Data/Entities/Roles.cs:
namespace Dot6.Bserver.Cookie.Auth.Data.Entities; public class Roles { public int Id { get; set; } public string Name { get; set; } }Data/Entities/UserRoles.cs:
namespace Dot6.Bserver.Cookie.Auth.Data.Entities; public class UserRoles { public int Id { get; set; } public int UserId { get; set; } public int RoleId { get; set; } }
Configure DatabaseContext:
Let's create a DatabaseContext class like 'MyCookieAuthContext.cs'.
Data/MyCookieAuthContext.cs:
using Dot6.Bserver.Cookie.Auth.Data.Entities; using Microsoft.EntityFrameworkCore; namespace Dot6.Bserver.Cookie.Auth.Data; public class MyCookieAuthContext : DbContext { public MyCookieAuthContext(DbContextOptions<MyCookieAuthContext> context) : base(context) { } public DbSet<Users> Users { get; set; } public DbSet<Roles> Roles { get; set; } public DbSet<UserRoles> UserRoles { get; set; } }
- Here registered all our entities inside of the DatabaseContext class those will act as tables.
appsettings.Development.json:
"ConnectionStrings": { "MyCookieAuthConnect":"Your_Connection" }Let's register our DatabaseContext into the 'Program.cs' file.
Program.cs:
builder.Services.AddDbContext<MyCookieAuthContext>(options => { options.UseSqlServer(builder.Configuration.GetConnectionString("MyCookieAuthConnect")); });In the next article, we will implement the user registration logic.
Support Me!
Buy Me A Coffee
PayPal Me
Video Session:
Wrapping Up:
Hopefully, I think this article delivered some useful information on Blazor Server Cookie Authentication. using I love to have your feedback, suggestions, and better techniques in the comment section below.
Thank you so much for this clear tutorial.
ReplyDeleteHow to apply multiple roles for a user?