Blazor Server официально выпущен с .NET Core 3.0, а Blazor WebAssembly все еще находится в предварительной версии (выпуск запланирован на май 2020 г.). Если у вас уже есть существующее веб-приложение ASP.NET Core и вы думаете об интеграции Blazor или медленном его внедрении, этот пост поможет вам.
Вы можете начать создавать компоненты Blazor в уже существующем веб-приложении ASP.NET Core. Таким образом, вы можете начать с небольших шагов по преобразованию существующего приложения в новейшую веб-инфраструктуру Microsoft. Это поможет вам в полной мере воспользоваться новейшими технологиями и позволит вам применить их в своем приложении.
Если вы хотите понять, что такое Blazor и как он работает, ознакомьтесь с этой статьей:
Как лучше всего добавить компоненты Blazor в приложение ASP.NET Core?
- Создайте библиотеку классов Razor в существующем решении.
- Добавьте к нему соответствующие компоненты Razor.
- Добавьте библиотеку RCL в качестве ссылки на существующий проект ASP.NET Core MVC.
- Начните использовать компоненты.
Преимущества:
- Компоненты Razor отделены от остального кода MVC.
- RCL можно экспортировать в любое другое приложение Blazor, которое вы, возможно, захотите создать в будущем.
- Вы можете начать с маленьких шагов к самой рекомендуемой платформе Microsoft для любых новых веб-приложений.
Пошаговое руководство
Скачать пример из репозитория git
Предпосылки:
- .NET Core 3.0 — установить отсюда
- Visual Studio 2019 16.3+
Давайте начнем
- Создайте новое веб-приложение ASP.NET Core 3.0 MVC.
- Найдите класс
Startup.cs
и вставьте приведенный ниже код, чтобы добавитьAddServerSideBlazor
в коллекцию услуг.
3. Найдите класс Startup.cs
и вставьте приведенную ниже строку кода, чтобы добавить конечную точку приложения.
4. Найдите _layouot.cshtm
и вставьте приведенную ниже библиотеку JS. Это обеспечивает подключение SinglR к компонентам сервера Blazor.
5. Щелкните правой кнопкой мыши «решение», чтобы добавить новую библиотеку классов Razor, и назовите ее RazorComponentLibrary
.
6. Щелкните правой кнопкой мыши RazorComponentLibrary
, чтобы добавить новый компонент Razor и назовите его ExampleComponent.razor
.
7. Добавьте приведенный ниже фрагмент кода в ExampleComponent.razor
.
8. В приложении MVC Core добавьте RazorComponentLibrary
в качестве ссылки
9. Теперь в приложении MVC Core найдите Index.cshtml
и добавьте пример компонента бритвы.
10. Вы можете идти. Запустите приложение сейчас.