Skip to main content

Posts

Showing posts with the label Blazor WebAssembly

Part-4 |Blazor WebAssembly[.NET 7] JWT Authentication Series | Implement Refresh Token & User Logout

The main objectives  of this article are: Implement Refresh Token User Logout Refresh Token: When the JWT access token expires to renew it without user credentials we will use the Refresh Token. The user sends a valid 'User Name' and 'Password' to the server, then the server will generate JWT Access Token and Refresh Token sent as a response. The JWT Access Token is a short-lived token(eg: 20 minutes) and Refresh Token is a long live token(eg: 7 days). Now client application sends a JWT access token in the request header that makes the user authenticated. If the JWT token expires then the server returns a 401 authorized response. Then the client sends the refresh token to the server to regenerate the JWT Access Token. The server validates the refresh token and returns a new JWT Access Token and a new Refresh Token as a response. SQL Script To Create UserRefreshToken Table: Let's run the below sql script to create 'UserRefreshToken' table that contains colum

Part-1 |Blazor WebAssembly[.NET 7] JWT Authentication Series | User Registration

The main objectives of this article are: In The API Project, We Will Create A User Registration Endpoint. In Blazor WebAssembly Application We Will Create A User Registration Form. User Table SQL Script: Run the below script to create the 'User' table. CREATE TABLE [dbo].[User]( [Id] INT IDENTITY(1000,1) NOT NULL, [FirstName] VARCHAR(300) NULL, [LastName] VARCHAR(300) NULL, [Email] VARCHAR(300) NULL, [Password] VARCHAR(500) NULL CONSTRAINT PK_User PRIMARY KEY (Id) ) Create A .NET7 Blazor WebAssembly Application: Let's create a Blazor WebAssembly application using Visual Studio 2022. (Step 1) (Step 2) (Step 3) Setup MudBlazor: Install the MudBlazor library. Add the MudBlazor namespace in '_Import.razor'. @using MudBlazor Add the below CSS into the closing head tag in 'wwwroot/index.html'. <link href="https://fonts.googleapis.com/css?family=Roboto:300,400,500,700&display=swap" rel="stylesheet" /> <link href="

Part-9 | Blazor WebAssembly | .Net7 API | MudBlazor | CRUD - Implement Pagination

The main objective of the article is: Implements Pagination. Implement Pagination In API Project: Let's change our HTTP GET Endpoint where we have to fetch the total number of records in the API response. Let's create a new API response like 'SuperHeroesContainerDto'. API_Project/Dtos/SuperHeroesContainerDto.cs: namespace Dot7.Api.Dtos { public class SuperHeroesContainerDto { public int TotalCount { get; set; } public List<SuperHeroesDto> SuperHeroes { get; set; } } public class SuperHeroesDto { public int Id { get; set; } public string? Name { get; set; } public string? Franchise { get; set; } public string? Gender { get; set; } public string? ImageURL { get; set; } } } Here we have properties like 'TotalCount'  and a collection of  'SuperHeroesDto'. Install the Automapper NuGet package. Now create an auto mapper profiler class like 'AppMapperProfile.cs' in