© Complot/shutterstock.com
State Management in Blazor WebAssembly und Blazor Server

Blazor erhält Zustände


Razor Components, die Komponenten in Microsofts neuem Web-Framework Blazor, behalten ihre Zustände, solange nicht das Browserfenster geschlossen wird bzw. bei Blazor Server die Verbindung zum Server verloren geht. Dieser Beitrag behandelt sowohl die eingebaute Zustandsverwaltung als auch Lösungen für langlebige Zustände mit NuGet-Erweiterungen und dem Einsatz von JavaScript-Interoperabilität.

Klassische Webanwendungen mit Server-side Rendering sind zustandslos: Ein HTTP Request geht auf dem Webserver ein, wird verarbeitet, und irgendwann wird eine Antwort zum Browser gesendet. Nach Absenden der Antwort werden alle auf dem Webserver gesetzten Variablen vernichtet. Konkret wird in ASP.NET und ASP.NET Core bei jedem Aufruf immer wieder eine neue Instanz der Page-Klasse (bei Web Forms), der Controller-Klasse (bei MVC) bzw. des Page Models (bei Razor Pages) erzeugt. Man braucht Techniken wie Cookies, Hidden Fields oder URL-Parameter bzw. darauf aufsetzende Abstraktionen wie Session-Variablen oder ViewState, um Werte von einem zum nächsten HTTP-Aufruf weiterzugeben.

In vielen Fällen ist keiner dieser Workarounds notwendig – weder in Blazor Server noch in Blazor WebAssembly, denn Blazor ist ein zustandsbehaftetes Programmiermodell. Hier gibt es einen sogenannten Circuit (auf Deutsch: Schaltkreis, Stromkreis, Bezirk), der Zustände der Komponenten und injizierter Klasseninstanzen speichert. Eine weitergehende Zustandsverwaltung unter Verwendung des Browserspeichers ist geboten, wenn man über die Lebensdauer des Circuits hinaus Zustände erhalten will, z. B. nach einem Neuladen oder Neuöffnen des Webbrowsers.

Zwischen Blazor Server und Blazor WebAssembly gibt es aber auch hier wieder den Unterschied, dass bei Blazor WebAssembly die Komponentenzustände im Hauptspeicher des Webbrowsers und bei Blazor Server im Hauptspeicher des Webservers liegen.

Lebenszeit des Komponentenzustands

Eine Instanz einer Razor Component (und alle in ihr per Field oder Property gespeicherten Werte sowie das zugehörige Virtual DOM) lebt, solange sie zur aktuellen Ansicht gehört. Eine Komponenteninstanz gehört zur aktuellen Ansicht, wenn die Komponente

  1. entweder über eine Route (einen relativen URL) direkt aktiviert ist

  2. in eine andere Komponente eingebettet ist, die über eine Route aktiviert ist

  3. in eine andere Komponente eingebettet ist, für die Satz 2 gilt

Testanwendung: Counter

Dass Razor Components zustandsbehaftet sind, zeigt schon das Zählerbeispiel (Counter.razor), das Microsoft in d...

Neugierig geworden?

Angebote für Teams

Für Firmen haben wir individuelle Teamlizenzen. Wir erstellen Ihnen gerne ein passendes Angebot.

Das Library-Modell:
IP-Zugang

Das Company-Modell:
Domain-Zugang