Пошаговое руководство
Часто возникает требование, когда нам нужно передавать данные в реальном времени с веб-сервера на веб-клиент, например, отображать канал IoT в реальном времени, обновления базы данных в реальном времени и т. д. без обновления страницы. Здесь SignalR приходит на помощь.
SignalR — это бесплатная и открытая программная библиотека для Microsoft ASP.NET. Библиотека включает серверные и клиентские компоненты JavaScript.
Реализация
Давайте шаг за шагом реализуем сценарий, в котором мы отправляем оперативные данные из ASP.NET Core.
Предварительные требования
· Визуальная студия 2019
· Пакет SDK для .NET Core 3.1
Шаг 1. Откройте Visual Studio › Новый проект › Проект веб-приложения ASP.NET Core.
Шаг 2. Выберите тип проекта веб-приложения
Шаг 3. Создайте новую папку «Hubs» внутри проекта и добавьте «CounterHub.cs» со следующим кодом. Этот код прослушивает push-сообщения и отправляет их соответствующему прокси-серверу SignalR Hub.
Шаг 4. Создайте новую папку «Службы» внутри проекта и добавьте «TimerService.cs» со следующим кодом. Этот код отправляет сообщение в соответствующий концентратор SignalR.
Шаг 5. Настройте код запуска для использования SignalR, конечной точки SignalR Hub и нашего TimerService.
Шаг 6. Настройте прокси-сервер SignalR Hub с помощью JavaScript. Поместите приведенный ниже код в wwwroot › js › site.js
Шаг 7. В приведенном выше теге site.js ‹script› включите библиотеку JavaScript SignalR в Pages › Shared › _Layout.cshtml
Шаг 8. Добавьте HTML-разметку для отображения данных счетчика в реальном времени в Pages › Index.cshtml.
Вывод
После запуска вашего кода вы увидите счетчик увеличения в реальном времени!
Демонстрационный код
