In this stream, we look at how we can manage state in a Blazor application. There are two types of state storage in Blazor, session storage and local storage.
localStorage and sessionStorage differ as follows:
- localStorage is scoped to the user’s browser. If the user reloads the page or closes and re-opens the browser, the state persists. If the user opens multiple browser tabs, the state is shared across the tabs. Data persists in localStorage until explicitly cleared.
- sessionStorage is scoped to the user’s browser tab. If the user reloads the tab, the state persists. If the user closes the tab or the browser, the state is lost. If the user opens multiple browser tabs, each tab has its own independent version of the data.
We try to use the Microsoft.AspNetCore.ProtectedBrowserStorage to implement session storage, but we soon see that it doesn’t work and we FAIL miserably. Then we try an OSS package from Chris Sainty (https://chrissainty.com/) called Blazored.LocalStorage (https://github.com/Blazored/LocalStorage). We are able to successfully store state with this package, but there are some limiations when working in a Blazor server app.
