实验四

最新推荐文章于 2024-07-11 10:29:42 发布

Shane Filan

最新推荐文章于 2024-07-11 10:29:42 发布

阅读量189

点赞数 1

文章标签：物联网

本文链接：https://blog.csdn.net/qq_43908230/article/details/116230663

版权

准备

硬件需要掌控板，电脑需要下载siot1.3并解压

实验步骤

1、打开SIoT.exe，复制本地IPV4地址，打开浏览器，在地址栏输入刚刚复制IP:8080，进入如图界面：
在这里插入图片描述
2、输入账号siot，密码dfrobot，登录进入如下界面：

3、打开Mind+，选择上传模式，点击左下角，主控板选择掌控板，网络库选择MQTT和Wi-Fi，回到主界面，选择连接设备来连接掌控板，
Mind+代码如下：

MQTT初始化参数：物联网平台选择SIOT，服务器地址为你刚开始复制的那个IP，账号siot，密码dfrobot，TOPIC为项目ID/设备名，比如2018A1XX/led,用了几个TOPIC就弄几个，我这里只用了一个。
尤其注意：掌控板连接wifi和那个IPV4地址要同一个网段，建议掌控板连笔记本电脑的热点，或者电脑和掌控板都连手机的热点。否则MQTT会连接失败。

4、接下来我们回到SIOT网页来测试一下能不能控制灯，点击发送消息，进入以下界面：
在这里插入图片描述
主题就是我们刚刚弄的TOPIC,我这里是2018A1XX/led，消息根据刚Mind+里所设置的开灯关灯命令，当为ledredon,掌控板红灯亮，当为ledrdoff，红灯灭，当为ledgreenon，绿灯亮，当为ledgreenoff，绿灯灭。

5、然后新建一个html文件，点击相应按钮控制灯亮灭，代码如下：

<!DOCTYPE html>
<html lang="en">

<head>
	<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
	<meta charset="utf-8" />
	<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0" />
	<!-- 最新版本的 Bootstrap 核心 CSS 文件 -->
	<link rel="stylesheet" href="js/bootstrap/css/bootstrap.min.css">
	<script src="js/jquery-2.1.4.min.js"></script>
	<script src="js/jquery.cookie.min.js"></script>
<link rel="stylesheet" href="css/style.css" crossorigin="anonymous">
	<!-- 最新的 Bootstrap 核心 JavaScript 文件 -->
	<script src="js/bootstrap/js/bootstrap.min.js"></script>
	<script src="js/vue.js"></script>
	<!-- <script src="js/app.js"></script> -->
	<title></title>
	<meta name="description" />
</head>

<body>
	<div class="container text-center"></div>
	<div class="container text-center">
		<button type="button" id="ledredon" class="btn btn-success btn-lg">红灯开</button>
		<button type="button" id="ledredoff" class="btn btn-info btn-lg">红灯关</button>
	</div>
	<br>
	<div class="container text-center">
		<button type="button" id="ledgreenon" class="btn btn-success btn-lg">绿灯开</button>
		<button type="button" id="ledgreenoff" class="btn btn-info btn-lg">绿灯关</button>
	</div>


	<script>
		$(function(){
			$('#ledredon').click(function(){
				$.get("http://你的ip:8080/publish?topic=2018A141xx/led&msg=ledredon&iname=siot&ipwd=dfrobot");
			});
			$('#ledredoff').click(function(){
				$.get("http://你的ip:8080/publish?topic=2018A141xx/led&msg=ledredoff&iname=siot&ipwd=dfrobot");
			});
			$('#ledgreenon').click(function(){
				$.get("http://你的ip:8080/publish?topic=2018A141xx/led&msg=ledgreenon&iname=siot&ipwd=dfrobot");
			});
			$('#ledgreenoff').click(function(){
				$.get("http://你的ip:8080/publish?topic=2018A141xx/led&msg=ledgreenoff&iname=siot&ipwd=dfrobot");
			});
			
		});
	</script>
</body>
</html>

注意：该html文件还需要bootstrap，jquery-2.1.4，vue和vue-dev。
网页打开是这样子：
在这里插入图片描述

实验结果如下所示：
在这里插入图片描述

Shane Filan

关注

1
点赞
踩
0

收藏

觉得还不错? 一键收藏
1
评论
实验四

这里写自定义目录标题准备实验步骤准备硬件需要掌控板，电脑需要下载siot1.3并解压实验步骤1、打开SIoT.exe，复制本地IPV4地址，打开浏览器，在地址栏输入刚刚复制IP:8080，进入如图界面：2、输入账号siot，密码dfrobot，登录进入如下界面：3、打开Mind+，点击左下角，主控板选择掌控板，网络库选择MQTT和Wi-Fi，回到主界面，选择连接设备来连接掌控板，选择上传模式Mind+代码如下：MQTT初始化参数：物联网平台选择SIOT，服务器地址为你刚开始复制的那个
复制链接

扫一扫