ASP.NET Core Blazor Hybrid

In diesem Artikel lernen Sie mit ASP.NET Core Blazor Hybrid eine Möglichkeit kennen, interaktive clientseitige Webbenutzeroberflächen mit .NET in einer ASP.NET Core-App zu erstellen.

Verwenden Sie Blazor Hybrid, um Desktop- und mobile native Clientframeworks mit .NET und Blazor zu kombinieren.

In einer Blazor Hybrid-App laufen Razor-Komponenten nativ auf dem Gerät. Komponenten werden über einen lokalen Interoperabilitätskanal in einem eingebetteten Web View-Steuerelement gerendert. Komponenten werden nicht im Browser ausgeführt, und WebAssembly ist nicht beteiligt. Razor-Komponenten laden und führen Code schnell aus, und Komponenten haben über die .NET-Plattform vollen Zugriff auf die nativen Fähigkeiten des Geräts. Komponentenstile, die in einer Web View gerendert werden, sind plattformabhängig und erfordern möglicherweise, dass Sie Unterschiede beim Rendering zwischen Plattformen mithilfe benutzerdefinierter Stylesheets berücksichtigen.

In Artikeln zu Blazor Hybrid werden Themen behandelt, die sich auf die Integration von Razor-Komponenten in native Clientframeworks beziehen.

Blazor Hybrid-Apps mit .NET MAUI

Blazor Hybrid Support ist in das .NET Multi-platform App UI (.NET MAUI) Framework integriert. .NET MAUI enthält das Steuerelement BlazorWebView, das das Rendern von Razor-Komponenten in einem eingebetteten Web View-Steuerelement ermöglicht. Indem Sie .NET MAUI und Blazor zusammen verwenden, können Sie eine festgelegte Webbenutzeroberfläche auf Mobilgeräten, Desktops und im Web wiederverwenden.

Blazor Hybrid-Apps mit WPF und Windows Forms

Blazor Hybrid-Apps können mit Windows Presentation Foundation (WPF) und Windows Forms erstellt werden. Blazor stellt BlazorWebView-Steuerelemente für beide Frameworks bereit (WPF BlazorWebView, Windows Forms BlazorWebView). Razor-Komponenten werden nativ auf dem Windows-Desktop ausgeführt und in einem eingebetteten Web View-Steuerelement gerendert. Mit Blazor in WPF und Windows Forms können Sie Ihren bestehenden Windows-Desktop-Apps eine neue Benutzeroberfläche hinzufügen, die plattformübergreifend mit .NET MAUI oder im Web wiederverwendet werden kann.

Web View-Konfiguration

Blazor Hybrid macht die zugrunde liegende Web View-Konfiguration für verschiedene Plattformen über Ereignisse des BlazorWebView-Steuerelements verfügbar:

• BlazorWebViewInitializing bietet Zugriff auf die Einstellungen, die zum Erstellen der Web View auf einzelnen Plattformen verwendet werden, wenn Einstellungen verfügbar sind.
• BlazorWebViewInitialized bietet Zugriff auf die Web View, um weitere Konfiguration der Einstellungen zu ermöglichen.

Verwenden Sie die bevorzugten Muster auf jeder Plattform, um Ereignishandler an die Ereignisse anzufügen, um Ihren benutzerdefinierten Code auszuführen.

API-Dokumentation:

• .NET MAUI
  • BlazorWebViewInitializing
  • BlazorWebViewInitialized
• WPF
  • BlazorWebViewInitializing
  • BlazorWebViewInitialized
• Windows Forms
  • BlazorWebViewInitializing
  • BlazorWebViewInitialized

Nicht behandelte Ausnahmen in Windows Forms und WPF-Apps

Dieser Abschnitt gilt nur für Windows Forms und WPF-AppsBlazor Hybrid.

Erstellen Sie einen Rückruf für UnhandledException für die System.AppDomain.CurrentDomain-Eigenschaft. Im folgenden Beispiel wird eine Compileranweisung verwendet, um eine MessageBox anzuzeigen, die den Benutzer entweder über einen Fehler informiert oder dem Entwickler die Fehlerinformationen anzeigt. Protokollieren Sie die Fehlerinformationen in error.ExceptionObject.

AppDomain.CurrentDomain.UnhandledException += (sender, error) =>
{
#if DEBUG
    MessageBox.Show(text: error.ExceptionObject.ToString(), caption: "Error");
#else
    MessageBox.Show(text: "An error has occurred.", caption: "Error");
#endif
    
    // Log the error information (error.ExceptionObject)
};

Globalisierung und Lokalisierung

Dieser Abschnitt gilt nur für .NET MAUIBlazor Hybrid-Apps.

.NET MAUI konfiguriert CurrentCulture und CurrentUICulture basierend auf den Umgebungsinformationen des Geräts.

IStringLocalizer und andere APIs im Microsoft.Extensions.Localization-Namespace funktionieren im Allgemeinen wie erwartet, zusammen mit der Globalisierungsformatierung, -analyse und -bindung, die von der Kultur des Benutzers abhängig sind.

Beim dynamischen Ändern der App-Kultur zur Laufzeit muss die App neu geladen werden, um die Änderung der Kultur zu übernehmen. Dadurch wird die Stammkomponente neu gerendert und die neue Kultur an neu gerenderte untergeordnete Komponenten übergeben.

Das Ressourcensystem von .NET unterstützt das Einbetten lokalisierter Bilder (als Blobs) in eine App, aber Blazor Hybrid kann die eingebetteten Bilder derzeit nicht in Razor-Komponenten anzeigen. Auch wenn ein Benutzer die Bytes eines Bilds mithilfe von ResourceManager in einen Stream liest, unterstützt das Framework derzeit kein Rendering des abgerufenen Bilds in einer Razor-Komponente.

Ein plattformspezifischer Ansatz zum Einschließen lokalisierter Images ist ein Feature des Ressourcensystems von . NET, aber die Browserelemente einer Razor-Komponente in einer .NET MAUIBlazor Hybrid-App können nicht mit solchen Bildern interagieren.

Weitere Informationen finden Sie in den folgenden Ressourcen:

• Xamarin.Forms-Lokalisierung von Zeichenfolgen und Bildern: Der Leitfaden gilt generell für Blazor Hybrid-Apps. Nicht jedes Szenario wird derzeit unterstützt.
• Blazor Bildkomponente zum Anzeigen von Bildern, auf die nicht über HTTP-Endpunkte zugegriffen werden kann (dotnet/aspnetcore #25274)

Zugreifen auf bereichsbezogene Dienste über die native Benutzeroberfläche

BlazorWebView verfügt über eine TryDispatchAsync-Methode, die eine angegebene Action<ServiceProvider>-Methode asynchron aufruft und die in Razor-Komponenten verfügbaren bereichsbezogenen Dienste übergibt. Auf diese Weise kann Code über die native Benutzeroberfläche auf bereichsbezogene Dienste zugreifen, z. B. NavigationManager:

private async void MyMauiButtonHandler(object sender, EventArgs e)
{
    var wasDispatchCalled = await _blazorWebView.TryDispatchAsync(sp =>
    {
        var navMan = sp.GetRequiredService<NavigationManager>();
        navMan.CallSomeNavigationApi(...);
    });

    if (!wasDispatchCalled)
    {
        ...
    }
}

Wenn wasDispatchCalledfalse ist, überlegen Sie, was Sie tun, wenn der Aufruf nicht verteilt wurde. Im Allgemeinen sollte die Verteilung nicht fehlschlagen. Wenn sie fehlschlägt, sind möglicherweise Betriebssystemressourcen erschöpft. Wenn Ressourcen erschöpft sind, sollten Sie eine Nachricht protokollieren, eine Ausnahme auslösen und den*die Benutzer*in möglicherweise benachrichtigen.

Zusätzliche Ressourcen

• Blazor Hybrid-Tutorials für ASP.NET Core
• .NET Multi-platform App UI (.NET MAUI)
• Windows Presentation Foundation (WPF)
• Windows Forms