👣 ☠️ 👨🏻‍🏫 Blazor WebAssembly 3.2.0 Preview 1 ist jetzt verfügbar 👩🏾‍💼 🦗 🎃

Heute haben wir ein neues Vorschau-Update für Blazor WebAssembly mit vielen großartigen neuen Funktionen und Verbesserungen veröffentlicht.

Folgendes ist neu in dieser Version:

Version aktualisiert auf 3.2.
Vereinfachter Start
Größenverbesserungen herunterladen
.NET SignalR Client-Unterstützung

Start

Installieren Sie das .NET Core 3.1 SDK und führen Sie den folgenden Befehl aus , um mit Blazor WebAssembly 3.2.0 Preview 1 zu beginnen :

dotnet new -i Microsoft.AspNetCore.Blazor.Templates::3.2.0-preview1.20073.1

Das ist alles! Weitere Dokumente und Beispiele finden Sie unter https://blazor.net .

Aktualisieren Sie das vorhandene Projekt

So aktualisieren Sie eine vorhandene Blazor WebAssembly-Anwendung von 3.1.0 Preview 4 auf 3.2.0 Preview 1:

Aktualisieren Sie alle Links zu Microsoft.AspNetCore.Blazor * -Paketen auf 3.2.0-Preview1.20073.1.
In Program.cs im Projekt Blazor Webassembly Client ersetzen BlazorWebAssemblyHost.CreateDefaultBuilder() mit WebAssemblyHostBuilder.CreateDefault().
Verschieben Sie die Stammkomponentenregistrierungen im Blazor WebAssembly-Clientprojekt durch Aufrufen von Startup.Configure auf Program.csbuilder.RootComponents.Add<TComponent>( ) .
Blazor WebAssembly Startup.ConfigureServices Program.cs builder.Services.
Startup.cs Blazor WebAssembly client project.
Blazor WebAssembly ASP.NET Core, Server app.UseClientSideBlazorFiles<Client.Startup>(...) app.UseClientSideBlazorFiles<Client.Program>(...).

3.2

In dieser Version haben wir die Versionen des Blazor WebAssembly-Pakets auf 3.2 aktualisiert, um sie von der jüngsten Version von .NET Core 3.1 Long Term Support (LTS) zu unterscheiden. Es gibt keine entsprechende Version von .NET Core 3.2 - die neue Version 3.2 gilt nur für Blazor WebAssembly. Blazor WebAssembly basiert derzeit auf .NET Core 3.1, erbt jedoch nicht den Status von .NET Core 3.1 LTS. Stattdessen wird die erste Version von Blazor WebAssembly, die für Mai dieses Jahres geplant ist, Current sein , die "drei Monate nach der nächsten Version von Current oder LTS beibehalten wird", wie in der .NET Core Support Policy beschrieben . Die nächste Version von Blazor WebAssembly nach Version 3.2 im Mai wird mit .NET 5 veröffentlicht. Dies bedeutet, dass Sie nach der Veröffentlichung von .NET 5 Ihre Blazor WebAssembly-Anwendungen auf .NET 5 aktualisieren müssen, um dies zu unterstützen.

Vereinfachter Start

In dieser Version haben wir die Start- und Hosting-APIs für Blazor WebAssembly vereinfacht. Ursprünglich waren die Start- und Bereitstellungs-APIs für Blazor WebAssembly so konzipiert, dass sie die in ASP.NET Core verwendeten Muster widerspiegeln, aber nicht alle Konzepte waren relevant. Aktualisierte APIs ermöglichen auch die Verwendung einiger neuer Szenarien.

So sieht der neue Startcode in Program.cs aus :

public class Program
{
    public static async Task Main(string[] args)
    {
        var builder = WebAssemblyHostBuilder.CreateDefault(args);
        builder.RootComponents.Add<App>("app");

        await builder.Build().RunAsync();
    }
}

Blazor WebAssembly-Anwendungen unterstützen jetzt asynchrone MainMethoden für den Einstiegspunkt in die Anwendung.

Rufen Sie an, um einen Standardhost zu erstellen WebAssemblyHostBuilder.CreateDefault(). Root-Komponenten und -Dienste werden mithilfe des Linkers konfiguriert. Eine separate Klasse wird Startupnicht mehr benötigt. Das folgende Beispiel wurde hinzugefügt WeatherService, sodass es über die Abhängigkeitsinjektion (DI) verfügbar ist:

public class Program
{
    public static async Task Main(string[] args)
    {
        var builder = WebAssemblyHostBuilder.CreateDefault(args);
        builder.Services.AddSingleton<WeatherService>();
        builder.RootComponents.Add<App>("app");

        await builder.Build().RunAsync();
    }
}

Nachdem der Host erstellt wurde, können Sie vom Root-DI aus auf die Dienste zugreifen, bevor Komponenten angezeigt werden. Dies kann nützlich sein, wenn Sie eine Initialisierungslogik ausführen müssen, bevor etwas angezeigt wird:

public class Program
{
    public static async Task Main(string[] args)
    {
        var builder = WebAssemblyHostBuilder.CreateDefault(args);
        builder.Services.AddSingleton<WeatherService>();
        builder.RootComponents.Add<App>("app");

        var host = builder.Build();

        var weatherService = host.Services.GetRequiredService<WeatherService>();
        await weatherService.InitializeWeatherAsync();

        await host.RunAsync();
    }
}

Der Host stellt jetzt auch eine Instanz der zentralen Konfiguration für die Anwendung bereit. Die Konfiguration enthält keine Standarddaten, Sie können sie jedoch nach Bedarf in Ihrer Anwendung füllen.

public class Program
{
    public static async Task Main(string[] args)
    {
        var builder = WebAssemblyHostBuilder.CreateDefault(args);
        builder.Services.AddSingleton<WeatherService>();
        builder.RootComponents.Add<App>("app");

        var host = builder.Build();

        var weatherService = host.Services.GetRequiredService<WeatherService>();
        await weatherService.InitializeWeatherAsync(host.Configuration["WeatherServiceUrl"]);

        await host.RunAsync();
    }
}

Größenverbesserungen herunterladen

Blazor WebAssembly-Anwendungen führen den .NET IL-Linker in jeder Assembly aus, um nicht verwendeten Code aus der Anwendung zu entfernen. In früheren Versionen wurden nur die Haupt-Framework-Bibliotheken abgeschnitten. Ab dieser Version werden auch Blazor-Baugruppen gekürzt, was zu einer leichten Verkleinerung führt - etwa 100 KB. Wenn Sie die Bindung jemals deaktivieren müssen, fügen Sie <BlazorLinkOnBuild>false</BlazorLinkOnBuild> Ihrer Projektdatei nach wie vor Ihre eigene hinzu .

.NET SignalR Client-Unterstützung

Jetzt können Sie SignalR aus Ihren Blazor WebAssembly-Anwendungen mit dem .NET SignalR-Client verwenden.

So testen Sie SignalR in Ihrer Blazor WebAssembly-Anwendung:

Erstellen Sie eine Blazor WebAssembly-Anwendung, die auf ASP.NET Core gehostet wird.
```
dotnet new blazorwasm -ho -o BlazorSignalRApp
```

Fügen Sie die ASP.NET - Core SignalR Client - Paket auf dem Client - Projekt .

cd BlazorSignalRApp
dotnet add Client package Microsoft.AspNetCore.SignalR.Client

Fügen Sie im Serverprojekt die folgende Hub / ChatHub.cs-Klasse hinzu .

using System.Threading.Tasks;
using Microsoft.AspNetCore.SignalR;

namespace BlazorSignalRApp.Server.Hubs
{
    public class ChatHub : Hub
    {
        public async Task SendMessage(string user, string message)
        {
            await Clients.All.SendAsync("ReceiveMessage", user, message);
        }
    }
}

Im Server - Projekt, fügen Sie die SignalR Dienstleistungen im Verfahren Startup.ConfigureServices.
```
services.AddSignalR();
```

Fügen Sie auch den Endpunkt für ChatHubat hinzu Startup.Configure.

.UseEndpoints(endpoints =>
{
    endpoints.MapDefaultControllerRoute();
    endpoints.MapHub<ChatHub>("/chatHub");
    endpoints.MapFallbackToClientSideBlazor<Client.Program>("index.html");
});

Aktualisieren Sie Pages / Index.razor im Client- Projekt mit dem folgenden Markup.

@using Microsoft.AspNetCore.SignalR.Client
@page "/"
@inject NavigationManager NavigationManager

<div>
    <label for="userInput">User:</label>
    <input id="userInput" @bind="userInput" />
</div>
<div class="form-group">
    <label for="messageInput">Message:</label>
    <input id="messageInput" @bind="messageInput" />
</div>
<button @onclick="Send" disabled="@(!IsConnected)">Send Message</button>

<hr />

<ul id="messagesList">
    @foreach (var message in messages)
    {
        <li>@message</li>
    }
</ul>

@code {
    HubConnection hubConnection;
    List<string> messages = new List<string>();
    string userInput;
    string messageInput;

    protected override async Task OnInitializedAsync()
    {
        hubConnection = new HubConnectionBuilder()
            .WithUrl(NavigationManager.ToAbsoluteUri("/chatHub"))
            .Build();

        hubConnection.On<string, string>("ReceiveMessage", (user, message) =>
        {
            var encodedMsg = user + " says " + message;
            messages.Add(encodedMsg);
            StateHasChanged();
        });

        await hubConnection.StartAsync();
    }

    Task Send() => hubConnection.SendAsync("SendMessage", userInput, messageInput);

    public bool IsConnected => hubConnection.State == HubConnectionState.Connected;
}

Erstellen Sie ein Serverprojekt und führen Sie es aus
```
cd Server
dotnet run
```
Öffnen Sie die Anwendung in zwei separaten Browser-Registerkarten, um in Echtzeit über SignalR zu kommunizieren.

Bekannte Probleme

Im Folgenden finden Sie eine Liste bekannter Probleme in dieser Version, die in einem zukünftigen Update behoben werden.

Das Starten einer neuen Blazor WebAssembly-Anwendung, die auf ASP.NET Core über die Befehlszeile gehostet wird, generiert eine Warnung:
```
CSC : warning CS8034: Unable to load Analyzer assembly C:\Users\user\.nuget\packages\microsoft.aspnetcore.components.analyzers\3.1.0\analyzers\dotnet\cs\Microsoft.AspNetCore.Components.Analyzers.dll : Assembly with same name is already loaded.
```
- Lösung: Diese Warnung kann mithilfe der <DisableImplicitComponentsAnalyzers>true</DisableImplicitComponentsAnalyzers> MSBuild- Eigenschaft ignoriert oder entfernt werden .

Bewertungen

Wir hoffen, dass Ihnen die neuen Funktionen in dieser Vorschau-Version von Blazor WebAssembly gefallen! Bitte teilen Sie uns Ihre Meinung mit, wenn Sie Probleme auf GitHub melden .

Vielen Dank, dass Sie Blazor verwenden.

Blazor WebAssembly 3.2.0 Preview 1 ist jetzt verfügbar