Blazor WebAssembly 3.2.0 Preview 1 теперь доступна

Сегодня мы выпустили новое предварительное обновление для Blazor WebAssembly с множеством замечательных новых функций и улучшений.

Вот что нового в этом выпуске:

• Версия обновлена до 3.2
• Упрощенный запуск
• Улучшения размера загрузки
• Поддержка клиента .NET SignalR

Начало

Чтобы начать работу с Blazor WebAssembly 3.2.0 Preview 1 установите .NET Core 3.1 SDK и затем выполните следующую команду:

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

Вот и все! Вы можете найти дополнительные документы и примеры на https://blazor.net.

Обновить существующий проект

Чтобы обновить существующее приложение Blazor WebAssembly с 3.1.0 Preview 4 до 3.2.0 Preview 1:

• Обновите все ссылки на пакеты Microsoft.AspNetCore.Blazor* на 3.2.0-preview1.20073.1.
• В Program.cs в клиентском проекте Blazor WebAssembly замените BlazorWebAssemblyHost.CreateDefaultBuilder() на WebAssemblyHostBuilder.CreateDefault().
• Переместите регистрации корневых компонентов в клиентском проекте Blazor WebAssembly из Startup.Configure в Program.cs вызвав builder.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

В этом выпуске мы обновили версии пакетов Blazor WebAssembly до 3.2, чтобы отличать их от недавнего выпуска .NET Core 3.1 Long Term Support (LTS). Соответствующего выпуска .NET Core 3.2 не существует — новая версия 3.2 применяется только к Blazor WebAssembly. Blazor WebAssembly в настоящее время основана на .NET Core 3.1, но не наследует статус .NET Core 3.1 LTS. Вместо этого начальный выпуск Blazor WebAssembly, запланированный на май этого года, будет Current, который «поддерживается в течение трех месяцев после следующего выпуска Current или LTS», как описано в .политике поддержки .NET Core . Следующий запланированный выпуск Blazor WebAssembly после выпуска 3.2 в мае будет с .NET 5 . Это означает, что после выхода .NET 5 вам потребуется обновить приложения Blazor WebAssembly до .NET 5, чтобы поддерживать его.

Упрощенный запуск

В этом выпуске мы упростили API запуска и хостинга для Blazor WebAssembly. Первоначально API запуска и размещения для Blazor WebAssembly были разработаны для отражения шаблонов, используемых в ASP.NET Core, но не все концепции были актуальны. Обновленные API также позволяют использовать некоторые новые сценарии.

Вот как выглядит новый код запуска в Program.cs:

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 теперь поддерживают асинхронные Main методы для точки входа в приложение.

Чтобы создать хост по умолчанию, вызовите WebAssemblyHostBuilder.CreateDefault(). Корневые компоненты и сервисы настраиваются с помощью компоновщика; отдельный класс Startup больше не нужен. В следующем примере добавляется WeatherService, поэтому он доступен через внедрение зависимостей (DI):

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();     } }

После того как хост создан, вы можете получить доступ к сервисам из корневой области DI до того, как какие-либо компоненты будут представлены. Это может быть полезно, если вам нужно запустить некоторую логику инициализации, прежде чем что-либо будет отображено:

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();     } }

Хост также теперь предоставляет экземпляр центральной конфигурации для приложения. Конфигурация не заполняется никакими данными по умолчанию, но вы можете заполнить ее, как требуется в вашем приложении.

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();     } } 

Улучшения размера загрузки

Приложения Blazor WebAssembly запускают компоновщик .NET IL в каждой сборке для удаления неиспользуемого кода из приложения. В предыдущих выпусках обрезались только основные библиотеки фреймворков. Начиная с этого выпуска сборки Blazor также обрезаются, что приводит к незначительному уменьшению размера — около 100 КБ. Как и раньше, если вам когда-либо понадобится отключить связывание, добавьте свойсвто <BlazorLinkOnBuild>false</BlazorLinkOnBuild> к вашему фалу проекта.

Поддержка клиента .NET SignalR

Теперь вы можете использовать SignalR из ваших приложений Blazor WebAssembly с помощью клиента .NET SignalR.

Чтобы попробовать SignalR в своем приложении Blazor WebAssembly:

1. Создайте приложение Blazor WebAssembly, размещенное на ASP.NET Core.

   dotnet new blazorwasm -ho -o BlazorSignalRApp

2. Добавьте пакет клиента ASP.NET Core SignalR в проект Client.

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

3. В проекте Server добавьте следующий класс Hub/ChatHub.cs.

   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);         }     } } 

4. В проекте Server добавьте службы SignalR в методе Startup.ConfigureServices.

   services.AddSignalR(); 

5. Также добавьте конечную точку для ChatHub в Startup.Configure.

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

6. Обновите Pages/Index.razor в проекте Client следующей разметкой.

   @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; } 

7. Создайте и запустите проект Server

   cd Server dotnet run 

8. Откройте приложение в двух отдельных вкладках браузера, чтобы общаться в режиме реального времени через SignalR.

Известные проблемы

Ниже приведен список известных проблем этого выпуска, которые будут устранены в будущем обновлении.

• Запуск нового приложения Blazor WebAssembly, размещенного на ASP.NET Core, из командной строки приводит к появлению предупреждения:

  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. 

  • Решение: это предупреждение может быть проигнорировано или удалено с помощью свойства <DisableImplicitComponentsAnalyzers>true</DisableImplicitComponentsAnalyzers> MSBuild.

Отзывы

Мы надеемся, что вам понравятся новые функции в этой предварительной версии Blazor WebAssembly! Пожалуйста, дайте нам знать, что вы думаете, сообщая о проблемах на GitHub.

Спасибо за использование Blazor.