Switch Blazor-Interaktivität

Das Umschalten eines bestehenden Power Portals Pro-Projekts von einem Interaktivitätsmodus in einen anderen erfolgt durch eine Reihe von Änderungen an Program.cs, App.razor, dem .Client Projekt und (beim Hinzufügen von Interaktivität) den Kontoseiten. Das Framework selbst benötigt keine Änderungen – nur die Host-Verkabelung schon. Die folgenden Schritte behandeln die gängigen Übergänge.

Tipp

Wenn deine Anpassungen auf wenigen Seiten liegen, ist der geringste Weg ein neues Projekt im Zielmodus zu unterstützen und deine Anpassungen zu kopieren. Der Vergleich deines aktuellen Hosts mit einer frisch generierten Referenz ist ebenfalls hilfreich, wenn du nach einem manuellen Wechsel einer Diskrepanz nachgehen möchtest.

Server → WebAssembly oder Auto

Diese Schritte fügen WebAssembly zu einem Server-only-Host hinzu. Die gleichen Bearbeitungen gelten, egal ob du nur WebAssembly oder Auto anvisierst – die einzigen Unterschiede sind, welche Builder-Methoden du verkettest Program.cs und welcher Rendermodus App.razor zurückkehrt. Beide werden pro Schritt aufgerufen.

1. Konvertiere das . Client-Projekt zu einer WebAssembly-App

Öffnen .Client/MyApp.Client.csproj und das SDK von Microsoft.NET.Sdk.Razor . Microsoft.NET.Sdk.BlazorWebAssembly Fügen Sie das WebAssembly-Framework und Power Portals Pro Client-Pakete hinzu:

Fügen Sie auch das WebAssembly-Server-Side-Hosting-Paket zum Server-Host .csproj hinzu – es stellt die Middleware bereit, die das WASM-Bundle bedient:

2. Interaktive WebAssembly-Komponenten auf dem Server registrieren

Im Server Program.csersetzen Sie die Komponentenregistrierung durch die entsprechenden Builder-Aufrufe. AddAuthenticationStateSerialization() Serialisiert den authentifizierten Benutzer über die Server→WASM-Grenze, sodass die Kaskadierung AuthenticationState auf beiden Laufzeiten konsistent ist:

3. Kartiere den WebAssembly-Rendermodus

Aktualisieren app.MapRazorComponents<App>() Sie, um die passenden Rendermodus-Endpunkte zu verknüpfen. Der AddAdditionalAssemblies Aufruf zeigt bereits auf die .Client Assemblys _Imports in den Vorlagen, daher ändert er sich hier nicht:

4. App.razors PageRenderMode aktualisieren

In App.razor's PageRenderMode Getter kehre der neue Rendermodus zurück. Pinne /Account/* zuerst auf InteractiveWebAssemblyRenderMode(prerender: false)und gib dann für alles andere die Standardeinstellung zurück:

Der Account-route-Pin ist erforderlich, da der des Frameworks IAuthService nur im DI-Graphen des WASM-Clients registriert ist. Ohne den Pin kann Autos serverseitiges Prerendering in einer Cold Session nicht aufgelöst werden [Inject] IAuthService .

5. Fügen Sie . hinzu. Kunde/Program.cs

Erstelle ein Formular Program.cs im .Client Projekt. Dies richtet den WebAssembly-Host ein, registriert ihn HttpClient beim Cookie-Forwarding-Handler (also authentifizierte Aufrufe vom WASM-Client, um /api/* denselben Authentifizierungscookie wie der Browser zu sehen) und ruft die WASM-seitige Framework-Dienste auf. AddPowerPortalsProWebClient Der UserPowerPortalsProWebClient Aufruf holt beim Start die querschneidenden Lokalisierungsstrings vorab ab, sodass der erste Paint keinen Key-as-Fallback-Text zeigt:

6. Wechsel von Formularpost- zu JSON-Auth-Endpunkten

Server-Hosts werden für Formular-Post-Identitätsseiten verwendet MapAdditionalIdentityEndpoints() . WebAssembly- und Auto-Hosts verwenden MapAuthEndpoints<TUser>() stattdessen – der .Client's Wrapper IAuthService ruft diese JSON-Endpunkte unter folgende Worte auf /api/auth/*:

Wenn der Host sowohl Server- als auch WASM-Kontoseiten betreibt (ungewöhnlich), können beide Endpunktregistrierungen koexistieren. Die Standard-Templates wählen das eine oder das andere basierend auf dem Interaktivitätsmodus.

7. Verschieben Sie die Kontoseiten auf die . Kundenprojekt

Power Portals Pro liefert zwei parallele Sets von Kontoseiten, eine für jeden Render-Kontext:

8. Optional — scoped exception handler für /api/*

Wenn WebAssembly im Einsatz ist, werden Ausnahmen von /api/* der Notwendigkeit, den WASM-Client als RFC 9457 problem+json zu benutzen, geworfen, damit die Client-Seite PowerPortalsProService den ursprünglichen CLR-Typ rehydratisieren kann. Die Vorlagen verbinden dies mit einem Scoped UseExceptionHandler for /api/* Only — Die Developer Exception Page behandelt weiterhin Server-gerenderte Seitenfehler an anderer Stelle:

WebAssembly oder Auto → Server

Kehren Sie die obigen Schritte um:

Auto ↔ WebAssembly

Der günstigste Switch – das Projektlayout, die Pakete und die Account-Seiten – sind zwischen den beiden identisch. Nur drei Dinge ändern sich:

Überprüfung des Schalters

Nach der Vornahme der Änderungen:

Anmerkung

Achten Sie auf Diskrepanzen zwischen der Dienstdauer beim Verschieben von Diensten zwischen Server und WASM-Client. Der WASM-Host läuft pro Sitzung als einzelner Scope, aber die Caching-Dienste des Frameworks sind als Singletons registriert – wenn Sie Ihren eigenen Dienst auf Transient der WASM-Seite registrieren, setzt der per-Instanz-Zustand jede Auflösung stillschweigend zurück. Verwenden Singleton Sie auf der WASM-Seite für jeden Dienst, der einen veränderbaren Zustand hat.