State management in Blazor

There is a sufficient document for state management in Blazor.
Here is a quick & fast work through with all prerequisites, how to get state management in Blazor working.

Example with Blazored.LocalStorage package

Install nuget package for your project

# Find packages providing a "Blazored.LocalStorage" 
Find-Package Blazored.LocalStorage

# install "Blazored.LocalStorage" 
Install-Package Blazored.LocalStorage -Project YourProject# alternatively

Add Blazored.LocalStorage to ConfigureServices at your Startup.cs

using System;/* ... */using Microsoft.AspNetCore.Hosting;using Microsoft.AspNetCore.Http;/* ... */using Blazored.LocalStorage;public class Startup{  /* ... */  public void ConfigureServices(IServiceCollection services)  {     /* ... */    services.AddRazorPages();     services.AddServerSideBlazor();    /* ... */    services.AddBlazoredLocalStorage();    /* ... */  }}

Using LocalStorage inside a razor page / control

@page "/MyPage"


@using Blazored.LocalStorage




@inject ILocalStorageService localStorage

@code {  /* ... */  Dictionary<string, string> sessionDict;  /* ... */  protected override async Task OnAfterRenderAsync(bool firstRender)  {     if (firstRender)    {      sessionDict =         await localStorage.GetItemAsync<Dictionary<string, string>>("SessDict");      StateHasChanged();    }    await base.OnAfterRenderAsync(firstRender);  }         protected async Task PersistSessionDict(<Dictionary<string, string> persistDict)
  {
    if (persistDict != sessionDict)    {
      await localStorage.SetItemAsync("SessDict", persistDict);
    }
  }}

Using LocalStorage inside an entity class

using System;/* ... */using Blazored.LocalStorage;
public class MyEntity{  [Inject]  public ILocalStorageService LS  {     get => _localStorage;    set => this._localStorage = value;  }  private ILocalStorageService _localStorage; 

  interal async Task<Dictionary<string, string>> GetSessionDict() =>       await LS.GetItemAsync<Dictionary<string, string>>("SessDict");  /* ... */}

Example with ProtectedBrowserStorage package

Install nuget package for your project

# Find packages providing a "ProtectedBrowserStorage" 
Find-Package ProtectedBrowserStorage 

# install "Microsoft.AspNetCore.ProtectedBrowserStorage" 
Install-Package Microsoft.AspNetCore.ProtectedBrowserStorage -Project YourProject# alternatively install "ProtectedBrowserStorage.NETStandard" Install-Package ProtectedBrowserStorage.NETStandard -Project YourProject

Add ProtectedBrowserStorage to ConfigureServices at your Startup.cs

using System;/* ... */using Microsoft.AspNetCore.Hosting;using Microsoft.AspNetCore.Http;/* ... */using Microsoft.AspNetCore.ProtectedBrowserStorage;
public class Startup{  /* ... */  public void ConfigureServices(IServiceCollection services)  {     /* ... */    services.AddRazorPages();     services.AddServerSideBlazor();    /* ... */    services.AddProtectedBrowserStorage();    /* ... */  }}

Using ProtectedBrowserStorage inside a razor page / control

@page "/MyPage"


@using Microsoft.AspNetCore.ProtectedBrowserStorage



@inject ProtectedSessionStorage ProtectedSessionStore

@code {  /* ... */  Dictionary<string, string> sessionDict;  /* ... */
  protected override async Task OnAfterRenderAsync(bool firstRender)  {     if (firstRender)    {      sessionDict =         await ProtectedSessionStore.GetAsync<Dictionary<string, string>>("SessDict");      StateHasChanged();    }    await base.OnAfterRenderAsync(firstRender);  }         protected async Task PersistSessionDict(<Dictionary<string, string> persistDict)
  {
    if (persistDict != sessionDict)    {
      await ProtectedSessionStore.SetAsync("SessDict", persistDict);
    }
  }}

Sources and links:

State Management in Blazor

https://www.nuget.org/packages/Microsoft.AspNetCore.ProtectedBrowserStorage
https://www.nuget.org/packages/ProtectedBrowserStorage.NETStandard/
https://github.com/MeysamMoghaddam/ProtectedBrowserStorage
https://github.com/Blazored/LocalStorage