Restrict access to Web API using Blazor WASM

Question

I'm working on a project for a financial application and after a lot of thought decided to create a web API (using JWT) and, initially, a Blazor frontend. Eventually we will add mobile apps.

So my first idea was to use Blazor WASM. Then thinking about how to secure the API from brute force attacks I realized that HttpClient will run on the client machine so we can't restrict access to the API by IP address.

It seams that Blazor Server is a better option.

What do you think?

Answer 1

Hi, @Oliverio Díaz Abood ,

There are two solutions for your requirements.

1. Blazor WebAssembly application with authentication using WebAPI and ASP.NET Core Identity

This article explains how to create a hosted Blazor WebAssembly app that uses IdentityServer to authenticate users and API calls.

The structure of first solution is shown below.

Add the Microsoft.AspNetCore.Authentication.JwtBearer NuGet package to the ASP.NET Core server project.

2. Server-side Blazor application with authentication

Identity server authentication for pages and added JWT authentication for API.

services.AddAuthentication(options =>  
{  
    options.DefaultAuthenticateScheme = CookieAuthenticationDefaults.AuthenticationScheme;  
    options.DefaultSignInScheme = CookieAuthenticationDefaults.AuthenticationScheme;  
    options.DefaultChallengeScheme = CookieAuthenticationDefaults.AuthenticationScheme;  
})  


[HttpGet]  
[Authorize(AuthenticationSchemes = JwtBearerDefaults.AuthenticationScheme)]  
public async Task<ActionResult<MyCustomResponseModel>> Get([FromQuery] MyCustomRequestModel request)  
{  
    ...  
}  

So, it depends on requirments. Below is Pros and Cons of Blazor Server/WASM.

Pros and Cons Blazor Server

Advantages

• Faster loading than WASM
• Access to secure resources like databases or cloud-based services
• Supports browsers which don’t support WASM like IE 11
• C# code is not sent to the browser

Disadvantages

• Extra latency due to sending data back and forth
• No offline support
• Scalability can be challenging
• Server required (serverless possible)

Pros and Cons Blazor WebAssembly

Advantages

• Faster UI Code
• When performance matters use WASM
• Offline support
• Can be distributed via CDN, no server required (except for API)
• Any .Net standard 2.0 C# can be run

Disadvantages

• An API layer is required if you want to access secure resources
• Debugging still a bit limited

---
If the answer doesn’t solve your issue, please provide more details of error that will help us track down what’s happening.
If the answer is helpful, please click "Accept Answer" and upvote it.
Note: Please follow the steps in our documentation to enable e-mail notifications if you want to receive the related email notification for this thread.

Best Regards,
Michael Wang