物联网怎么控制家里边电源开关（如何利用浏览器云端控制家里的电灯开关）
物联网怎么控制家里边电源开关（如何利用浏览器云端控制家里的电灯开关）新建一个Html，命名为websocket.html，内容如下：二、编写控制网页: websocket.html一、部署tcp服务器和websocket服务器并且安装emqtt之前的几期文章已经讲述了相关的内容，朋友们可以回头去看一看。相关服务都部署好以后，我们就可以开始编写控制网页。
上期文章我们介绍了如何用Swoole创建tcp服务器与websocket服务器，并结合mqtt构成通讯网络。
Swoole: TcpServer SocketServer EMQTT组合，实现基础设备控制
今期文章，我们就来进行实战介绍我们如何利用浏览器的websocket控制线下硬件。
基础架构
一、部署tcp服务器和websocket服务器并且安装emqtt
之前的几期文章已经讲述了相关的内容，朋友们可以回头去看一看。
相关服务都部署好以后，我们就可以开始编写控制网页。
二、编写控制网页: websocket.html
新建一个Html，命名为websocket.html，内容如下：
<!DOCTYPE html> <html> <head> <title>终端远程控制</title> <meta charset="utf-8"> <meta name="renderer" content="webkit"> <meta http-equiv="X-UA-Compatible" content="IE=edge chrome=1"> <meta name="viewport" content="width=device-width initial-scale=1.0 minimum-scale=1.0 maximum-scale=1.0 user-scalable=0"> <script> var socket = new WebSocket('ws://你的服务器ip:39002'); console.log(socket); socket.onopen = function (event) { console.log(event); if (socket.readyState === 1) { console.log('connected'); var data = JSON.stringify({ "reg": "btdaF70c0HUr9iddalkU3" }); socket.send(data); } } // 监听消息 socket.onmessage = function (event) { console.log(event.data); }; </script> </head> <body> <p style="margin:100px;"> <button id='btn_open'>开灯</button> <button id='btn_close'>关灯</button> </p> </body> </html> <script> document.getElementById('btn_open').onclick = function () { console.log(socket.send( JSON.stringify({ "instruction": "01 05 00 00 FF 00 8C 3A" }) )) } document.getElementById('btn_close').onclick = function () { console.log(socket.send( JSON.stringify({ "instruction": "01 05 00 00 00 00 CD CA" }) )) } </script>
三、调试
打开浏览器，然后访问websocket.html，效果如图：
视频如下：
好啦，这一期就到这里，感谢各位阅读，持续关注小搜将会为大家带来更多实用知识，我们下一期再见。
