【DigiKey“智造万物，快乐不停”创意大赛】智能家居中控屏 6. 家庭服务器端搭建

pomin

【DigiKey“智造万物，快乐不停”创意大赛】智能家居中控屏 6. 家庭服务器端搭建 [复制链接]

 

> 作为一个DIY爱好者，怎么能没有自己的家庭服务器、NAS、路由呢，同时也可以作为家庭中用的MQTT服务器来桥接家中的各种物联网信息！ 本项目智能家居中控屏中显示的数据来源就是利用网络来获取家庭服务器端中的数据，具体流程如下： 服务器端使用 HomeAssistant 来接入家中的各种智能设备，然后利用 HA 的 API 搭配 NodeRED 自动化流程来转发数据到 MQTT 服务器，在已联网的中控屏（MQTT客户端）上显示获取到的信息，并且可以通过触控来操作各种智能设备。 服务器端的控制面板和 Docker 管理器直接使用操作比较简单的 casaos 面板。 <ignore_js_op> <img style="cursor:pointer;" id="aimg_769608" aid="769608" src="static/image/common/none.gif" onclick="zoom(this, this.getAttribute('zoomfile'), 0, 0, '0')" zoomfile="data/attachment/forum/202401/02/212541f5k4zf5bbdvck4oe.png" file="data/attachment/forum/202401/02/212541f5k4zf5bbdvck4oe.png.thumb.jpg" inpost="1" onmouseover="showMenu({'ctrlid':this.id,'pos':'12'})" /> <div class="tip tip_4 aimg_tip" id="aimg_769608_menu" style="position: absolute; display: none" disautofocus="true"> <div class="xs0"> <p><strong>Pasted image 20231228000728.png</strong> <em class="xg1">(849.17 KB, 下载次数: 0)</em></p> <p> <a href="javascript:;" class="loginf" >下载附件</a> <a href="javascript:;" onclick="showWindow(this.id, this.getAttribute('url'), 'get', 0);" id="savephoto_769608" url="home.php?mod=spacecp&ac=album&op=saveforumphoto&aid=769608&handlekey=savephoto_769608">保存到相册</a> </p> <p class="xg1 y">2024-1-2 21:25 上传</p> </div> <div class="tip_horn"></div> </div> </ignore_js_op> 搭建好的 HomeAssistant，把我的所有智能家居设备都接入到了这里 <ignore_js_op> <img style="cursor:pointer;" id="aimg_769606" aid="769606" src="static/image/common/none.gif" onclick="zoom(this, this.getAttribute('zoomfile'), 0, 0, '0')" zoomfile="data/attachment/forum/202401/02/212540wvtalhquiuv4oyuf.png" file="data/attachment/forum/202401/02/212540wvtalhquiuv4oyuf.png.thumb.jpg" inpost="1" onmouseover="showMenu({'ctrlid':this.id,'pos':'12'})" /> <div class="tip tip_4 aimg_tip" id="aimg_769606_menu" style="position: absolute; display: none" disautofocus="true"> <div class="xs0"> <p><strong>Pasted image 20231228000751.png</strong> <em class="xg1">(83.22 KB, 下载次数: 0)</em></p> <p> <a href="javascript:;" class="loginf" >下载附件</a> <a href="javascript:;" onclick="showWindow(this.id, this.getAttribute('url'), 'get', 0);" id="savephoto_769606" url="home.php?mod=spacecp&ac=album&op=saveforumphoto&aid=769606&handlekey=savephoto_769606">保存到相册</a> </p> <p class="xg1 y">2024-1-2 21:25 上传</p> </div> <div class="tip_horn"></div> </div> </ignore_js_op> MQTT 服务器，可以桥接各种家中的 MQTT 数据包 <ignore_js_op> <img style="cursor:pointer;" id="aimg_769605" aid="769605" src="static/image/common/none.gif" onclick="zoom(this, this.getAttribute('zoomfile'), 0, 0, '0')" zoomfile="data/attachment/forum/202401/02/212540du1yrm1pd11dv0mk.png" file="data/attachment/forum/202401/02/212540du1yrm1pd11dv0mk.png.thumb.jpg" inpost="1" onmouseover="showMenu({'ctrlid':this.id,'pos':'12'})" /> <div class="tip tip_4 aimg_tip" id="aimg_769605_menu" style="position: absolute; display: none" disautofocus="true"> <div class="xs0"> <p><strong>Pasted image 20231228000940.png</strong> <em class="xg1">(165.95 KB, 下载次数: 0)</em></p> <p> <a href="javascript:;" class="loginf" >下载附件</a> <a href="javascript:;" onclick="showWindow(this.id, this.getAttribute('url'), 'get', 0);" id="savephoto_769605" url="home.php?mod=spacecp&ac=album&op=saveforumphoto&aid=769605&handlekey=savephoto_769605">保存到相册</a> </p> <p class="xg1 y">2024-1-2 21:25 上传</p> </div> <div class="tip_horn"></div> </div> </ignore_js_op> NodeRED 自动化流程，可以通过Javascript和图形化拖拽来实现自定义的数据流，很适合创建家庭自动化的流程。 <ignore_js_op> <img style="cursor:pointer;" id="aimg_769604" aid="769604" src="static/image/common/none.gif" onclick="zoom(this, this.getAttribute('zoomfile'), 0, 0, '0')" zoomfile="data/attachment/forum/202401/02/212539kbbf212312dk20c0.png" file="data/attachment/forum/202401/02/212539kbbf212312dk20c0.png.thumb.jpg" inpost="1" onmouseover="showMenu({'ctrlid':this.id,'pos':'12'})" /> <div class="tip tip_4 aimg_tip" id="aimg_769604_menu" style="position: absolute; display: none" disautofocus="true"> <div class="xs0"> <p><strong>Pasted image 20240102205039.png</strong> <em class="xg1">(128.47 KB, 下载次数: 0)</em></p> <p> <a href="javascript:;" class="loginf" >下载附件</a> <a href="javascript:;" onclick="showWindow(this.id, this.getAttribute('url'), 'get', 0);" id="savephoto_769604" url="home.php?mod=spacecp&ac=album&op=saveforumphoto&aid=769604&handlekey=savephoto_769604">保存到相册</a> </p> <p class="xg1 y">2024-1-2 21:25 上传</p> </div> <div class="tip_horn"></div> </div> </ignore_js_op> 在这里搭建了一个获取小米温湿度计数据的自动化流程，对接到HA中接入的小米温湿度计，使用 Javascript 来创建 JSON 格式的数据包后通过 MQTT 协议来推送到服务器 <ignore_js_op> <img style="cursor:pointer;" id="aimg_769603" aid="769603" src="static/image/common/none.gif" onclick="zoom(this, this.getAttribute('zoomfile'), 0, 0, '0')" zoomfile="data/attachment/forum/202401/02/212539r21n94kh84phph93.png" file="data/attachment/forum/202401/02/212539r21n94kh84phph93.png.thumb.jpg" inpost="1" onmouseover="showMenu({'ctrlid':this.id,'pos':'12'})" /> <div class="tip tip_4 aimg_tip" id="aimg_769603_menu" style="position: absolute; display: none" disautofocus="true"> <div class="xs0"> <p><strong>Pasted image 20240102211947.png</strong> <em class="xg1">(86.52 KB, 下载次数: 0)</em></p> <p> <a href="javascript:;" class="loginf" >下载附件</a> <a href="javascript:;" onclick="showWindow(this.id, this.getAttribute('url'), 'get', 0);" id="savephoto_769603" url="home.php?mod=spacecp&ac=album&op=saveforumphoto&aid=769603&handlekey=savephoto_769603">保存到相册</a> </p> <p class="xg1 y">2024-1-2 21:25 上传</p> </div> <div class="tip_horn"></div> </div> </ignore_js_op> 为了验证这个自动化流程的可用性，可以用 MQTTX 软件来订阅主题，可以看到每隔几秒就会收到一个 JSON 格式数据包。 <ignore_js_op> <img style="cursor:pointer;" id="aimg_769602" aid="769602" src="static/image/common/none.gif" onclick="zoom(this, this.getAttribute('zoomfile'), 0, 0, '0')" zoomfile="data/attachment/forum/202401/02/212539i7yfah7c7efd7bvt.png" file="data/attachment/forum/202401/02/212539i7yfah7c7efd7bvt.png.thumb.jpg" inpost="1" onmouseover="showMenu({'ctrlid':this.id,'pos':'12'})" /> <div class="tip tip_4 aimg_tip" id="aimg_769602_menu" style="position: absolute; display: none" disautofocus="true"> <div class="xs0"> <p><strong>Pasted image 20240102212405.png</strong> <em class="xg1">(70.67 KB, 下载次数: 0)</em></p> <p> <a href="javascript:;" class="loginf" >下载附件</a> <a href="javascript:;" onclick="showWindow(this.id, this.getAttribute('url'), 'get', 0);" id="savephoto_769602" url="home.php?mod=spacecp&ac=album&op=saveforumphoto&aid=769602&handlekey=savephoto_769602">保存到相册</a> </p> <p class="xg1 y">2024-1-2 21:25 上传</p> </div> <div class="tip_horn"></div> </div> </ignore_js_op>

Jacktang

Javascript和图形化拖拽来实现自定义的数据流，这很实用