Какое-то время была идея создать свой домашний приборный щиток, чтобы я мог управлять своими устройствами, в том числе и теми двумя лампами, которые есть у меня дома. Но я всегда сохранял эту идею на будущее, в основном потому, что я люблю делать красивые пользовательские интерфейсы, и в настоящее время, чтобы иметь приятный опыт, вам нужно что-то вроде angular, react или много javascript, который мне не очень нравится.
Итак, если вы идете по маршруту одностраничного приложения, вам также необходимо создать веб-API, чтобы его можно было использовать из панели администратора. Вы можете видеть, что быстро становится много утомительной и долгой работы. Но теперь Blazor пришел нам на помощь благодаря своему серверному движку рендеринга, который позволяет работать с одной страницей благодаря своему веб-сокету. сообщения, которые пользователь не замечает, рендерятся с веб-сервера. Даже для нас, разработчиков, модель разработки выглядит похожей, ведь вы можете легко переключиться с рендеринга на стороне сервера на веб-сборку (но вы не можете использовать серверные библиотеки, такие как EF Core или любой другой коннектор БД).
Спасибо серверу. боковой рендеринг Я могу использовать библиотеки, такие как YeelightAPI, для обнаружения и включения и выключения моего домашнего освещения.
Вот как выглядит панель
В настоящее время панель очень проста и позволяет включать/выключать и переименовывать устройство.
Код некрасивый, но для наших целей тестирования он подойдет. Давайте посмотрим, как обнаруживаются устройства.
Вы можете легко понять, что внутри моего Index.cshtml я напрямую вызываю DeviceLocator.Discover() внутри OnInitAsync(), а затем перебираю их, чтобы отобразить в виде карточек. Мне пришлось разделить рендеринг каждого источника света на компоненте Blazor, чтобы я мог управлять устройство, и это легко.
Код для включения/выключения лампы находится на ToggleOnOff и с несколькими служебными методами для повторного подключения к устройству и проверки состояния устройства, все это делается с использованием существующих библиотек с навыками, которые я уже знаю из более чем 15 лет C #.
Фактически, этот небольшой пользовательский интерфейс был разработан менее чем за два часа, на что, вероятно, было потрачено более 30 минут, потому что я мог подключиться к своим устройствам yeelight!!
Затем я обнаружил, что вам нужно включить возможность обнаружения локальной сети из мобильного приложения Yeelight следующим образом.
Выберите устройство, которое вы хотите обнаружить, затем, когда откроется этот экран, нажмите кнопку в правом нижнем углу.
Теперь выберите кнопку Lan Control внизу.
Хорошо, теперь у вас все хорошо, и вы можете продолжать играть со своими устройствами, используя Blazor и ядро asp.net :)
Вот мой пример проекта на github
