Table of Contents

Setup: Registering Services

This is the second step of BlazorLiveView setup: Registering the required services in Program.cs.

Service Registration

BlazorLiveView services need to be registered in your dependency injection container. Add the following code to Program.cs before building the application.

using BlazorLiveView.Core.Extensions;
builder.Services.AddRazorComponents()
    .AddInteractiveServerComponents()
    .AddLiveView();

The method AddLiveView also accepts optional configuration options:

builder.Services.AddRazorComponents()
    .AddInteractiveServerComponents()
    .AddLiveView(options =>
    {
        // The URI path for the mirror endpoint (default: "/_mirror")
        options.MirrorUri = "/custom-mirror-path";

        // Whether to use a transparent overlay element on mirrors to prevent interaction
        options.UseScreenOverlay = true;
    });

Mapping the Mirror Endpoint

To be able to view the mirrored sessions, the mirror endpoint must be mapped. Add the following code to Program.cs after building the application and before calling app.Run().

using BlazorLiveView.Core.Extensions;
app.MapLiveViewMirrorEndpoint();

Note that the previous code is NOT SECURE by default. Anyone could access the mirror endpoint if they know the circuit ID. To add authentication and authorization, see the next section.

Adding Authorization

To secure the mirror endpoint, the method MapLiveViewMirrorEndpoint accepts a configuration action where you can configure the mirror endpoint.

app.MapLiveViewMirrorEndpoint(mirrorEndpoint =>
{
    mirrorEndpoint.RequireAuthorization("PolicyName");
});

Complete Program.cs Example

The complete Program.cs file may look like this:

using BlazorLiveView.Core.Extensions;

var builder = WebApplication.CreateBuilder(args);

builder.Services.AddRazorComponents()
    .AddInteractiveServerComponents()
    .AddLiveView();

var app = builder.Build();

app.MapRazorComponents<App>()
    .AddInteractiveServerRenderMode();

app.MapLiveViewMirrorEndpoint();

app.Run();

Next Steps

Continue with Setup: Dashboard to add the admin user interface.