物联网系统开发:快速实现一个智能充电柜(智能锁)

快速开发:快速实现一个智能充电柜(智能锁)

架构图

在这里插入图片描述

前端

在这里插入图片描述

WebView

常用的JS调用Java代码的方法,主要包括以下三种:

1)通过WebView的addJavascriptInterface进行对象映射

2)通过 WebViewClient 的shouldOverrideUrlLoading方法回调拦截 url

3) 通过 WebChromeClient 的onJsAlert、onJsConfirm、onJsPrompt方法回调拦截JS对话框alert、confirm、prompt 消息

原生渲染

在这里插入图片描述

本地开发的web 页面,构建形成 Weex 的一个 JS bundle(native);在云端,开发者可以把生成的 JS bundle 部署上去,然后通过网络请求或预下发的方式传递到用户的移动应用客户端;在移动应用客户端里,WeexSDK 会准备好一个 JavaScript 引擎,并且在用户打开一个 Weex 页面时执行相应的 JS bundle,并在执行过程中产生各种命令发送到 native 端进行的界面渲染或数据存储、网络通信、调用设备功能、用户交互响应等移动应用的场景实践。

1、Weex 的 iOS 和 Android 客户端中都会运行一个 JavaScript 引擎,来执行 JS bundle。

2、Weex向各端的渲染层发送规范化的指令,调度客户端的native渲染和其它各种能力。

3、我们在 iOS 下选择了 JavaScriptCore 内核,而在 Android 下选择了 UC 提供的 v8 内核。

原理:
1、将XML+CSS+JavaScript代码转换为JSBundle
2、JSBundle传给JS Framework解析为Json格式的Virtual DOM
3、客户端通过接收Virtual DOM渲染界面

vue示例

<template>
	<view class="content">
		<text> {{speedWarnInfo}} </text>
		<view class="log">
			<view v-for="(log,index) in logs" class="" :key="index">
				{{log}}
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				logs: [],
				speed: 0,
				speedWarnInfo: ''
			}
		},
		watch: {
			speed: {
				handler(val) {
					if (val > 100) {
						this.speedWarnInfo = "超速"
					}
				},
				immediate: true
			}
		},
		beforeCreate:function(){
			// 实例完全被创建出来之前,vue 实例的挂载元素$el和数据对象 data 都为 undefined,还未初始化
		},
		created:function(){
			// 数据对象 data 已存在,可以调用 methods 中的方法,操作 data 中的数据,但 dom 未生成,$el 未存在 。
			this.connect()
		},
		beforeMount:function(){
			// vue 实例的 $el 和 data 都已初始化,挂载之前为虚拟的 dom节点,模板已经在内存中编辑完成了,但是尚未把模板渲染到页面中。data.message 未替换
		},
		mounted:function(){
			// vue 实例挂载完成,data.message 成功渲染。内存中的模板,已经真实的挂载到了页面中,用户已经可以看到渲染好的页面了。
		},
		updated:function(){
			// 当 data 变化时,会触发beforeUpdate方法 。data 数据尚未和最新的数据保持同步。
		},
		beforeUpdate:function(){
			// 当 data 变化时,会触发 updated 方法。页面和 data 数据已经保持同步了。
		},
		beforeDestroy:function(){
			// 组件销毁之前调用 ,在这一步,实例仍然完全可用。
		},
		destroyed:function(){
			// 组件销毁之后调用,对 data 的改变不会再触发周期函数,vue 实例已解除事件监听和 dom绑定,但 dom 结构依然存在。
		},
		methods: {
			connect() {
				var self = this
				self.logs.push('connect')
				var mqtt = require('mqtt/dist/mqtt.js')
				// #ifdef H5
				var client = mqtt.connect('xx://xxx.xxxxxx:8080')
				// #endif
				// #ifdef MP-WEIXIN||APP-PLUS
				var client = mqtt.connect('xx://xxx.xxxxxx:8080')
				// #endif
				client.on('connect', function() {
					self.logs.push('on connect')
					client.subscribe('presence', function(err) {
						if (!err) {
							client.publish('presence', 'hello')
						}
					})
				}).on('reconnect', function() {
					self.logs.push('on reconnect')
				}).on('error', function() {
					self.logs.push('on error')
				}).on('end', function() {
					self.logs.push('on end')
				}).on('message', function(topic, message) {
					console.log(message)
					self.logs.push(message.toString())
				})
			}
		}
	}
</script>

<style>
	.content {
		text-align: center;
		height: 400upx;
		word-break: break-all;
	}
</style>

后端通信协议

协议就是通信双方的一个约定,即,表示第1位传输的什么、第2位传输的什么

有哪些协议可用

长链接:mqtt,Jt808,Tcp,http
短链接:coap,http

短连接的操作步骤是:
建立连接——数据传输——关闭连接…建立连接——数据传输——关闭连接
长连接的操作步骤是:
建立连接——数据传输…(保持连接)…数据传输——关闭连接

JT808

消息ID(0-1)   消息体属性(2-3)  终端手机号(4-9)  消息流水号(10-11)    消息包封装项(12-15)

byte[0-1]   消息ID word(16)
byte[2-3]   消息体属性 word(16)
        bit[0-9]    消息体长度
        bit[10-12]  数据加密方式
                        此三位都为 0,表示消息体不加密
                        第 10 位为 1,表示消息体经过 RSA 算法加密
                        其它保留
        bit[13]     分包
                        1:消息体卫长消息,进行分包发送处理,具体分包信息由消息包封装项决定
                        0:则消息头中无消息包封装项字段
        bit[14-15]  保留
byte[4-9]   终端手机号或设备ID bcd[6]
        根据安装后终端自身的手机号转换
        手机号不足12 位,则在前面补 0
byte[10-11]     消息流水号 word(16)
        按发送顺序从 0 开始循环累加
byte[12-15]     消息包封装项
        byte[0-1]   消息包总数(word(16))
                        该消息分包后得总包数
        byte[2-3]   包序号(word(16))
                        从 1 开始
        如果消息体属性中相关标识位确定消息分包处理,则该项有内容
        否则无该项

编码
7E 02 00 00 3F 00 00 04 02 18 95 00 0B 00 00 00 00 00 04 00 03 01 58 CC AA 06 CB 79 F5 00 95 00 00 00 00 16 01 05 16 54 15 01 04 00 00 69 74 02 02 00 00 03 02 00 00 25 04 00 00 00 00 2B 04 00 00 00 00 30 01 00 31 01 0B 32 01 46 7C 7E
解码
在这里插入图片描述

Mqtt

在这里插入图片描述
MQTT客户端
一个使用MQTT协议的应用程序或者设备,它总是建立到服务器的网络连接。客户端可以:

(1)发布其他客户端可能会订阅的信息;
(2)订阅其它客户端发布的消息;
(3)退订或删除应用程序的消息;
(4)断开与服务器连接。

MQTT服务器
开源:mosquito,emq
MQTT服务器以称为"消息代理"(Broker),可以是一个应用程序或一台设备。它是位于消息发布者和订阅者之间,它可以:

(1)接受来自客户的网络连接;
(2)接受客户发布的应用信息;
(3)处理来自客户端的订阅和退订请求;
(4)向订阅的客户转发应用程序消息。

数据包结构

在这里插入图片描述

在MQTT协议中,一个MQTT数据包由:固定头(Fixed header)、 可变头(Variable header)、 消息体(payload)三部分构成。

MQTT 数据包结构

固定头(Fixed header),存在于所有MQTT数据包中,表示数据包类型及数据包的分组类标识
可变头(Variable header),存在于部分MQTT数据包中,数据包类型决定了可变头是否存在及其具体内容
消息体(Payload),存在于部分MQTT数据包中,表示客户端收到的具体内容

1. MQTT固定头

固定头存在于所有MQTT数据包中,其结构如下:
在这里插入图片描述

1.1 MQTT数据包类型
位置:byte 1, bits 7-4。

相于一个4位的无符号值,类型如下

在这里插入图片描述

1.2 标识位
位置:byte 1, bits 3-0。

在不使用标识位的消息类型中,标识位被做为保留位。如果收到无效的标志时,接收端必须关闭网络连接

在这里插入图片描述

DUP:发布消息的副本。用来在保证消息的可靠传输,如果设置为 1,则在下面的变长中增加MessageId,并且需要回复确认,以保证消息传输完成,但不能用于检测消息重复发送。
QoS:发布消息的服务质量,即:保证消息传递的次数
00:最多一次,即:<=1
01:至少一次,即:>=1
10:一次,即:=1
11:预留
RETAIN: 发布保留标识,表示服务器要保留这次推送的信息,如果有新的订阅者出现,就把这消息推送给它,如果设有那么推送至当前订阅者后释放。

1.3 剩余长度(Remaining Length)
位置:byte 1。

固定头的第二字节用来保存变长头部和消息体的总大小的,但不是直接保存的。这一字节是可以扩展,其保存机制,前7位用于保存长度,后一部用做标识。当最后一位为 1时,表示长度不足,需要使用二个字节继续保存

2.MQTT可变头

MQTT数据包中包含一个可变头,它驻位于固定的头和负载之间。可变头的内容因数据包类型而不同,较常的应用是做为包的标识:

在这里插入图片描述

很多类型数据包中都包括一个2字节的数据包标识字段,这些类型的包有:PUBLISH (QoS > 0)、PUBACK、PUBREC、PUBREL、PUBCOMP、SUBSCRIBE、SUBACK、UNSUBSCRIBE、UNSUBACK
CONNECT报文的可变报头按下列次序包含四个字段:

协议名(Protocol Name)
协议级别(Protocol Level)
连接标志(Connect Flags)
保持连接(Keep Alive)。

3.Payload消息体

Payload消息体位MQTT数据包的第三部分,CONNECT、SUBSCRIBE、SUBACK、UNSUBSCRIBE四种类型的消息 有消息体:

CONNECT,消息体内容主要是:客户端的ClientID、订阅的Topic、Message以及用户名和密码。
SUBSCRIBE,消息体内容是一系列的要订阅的主题以及QoS。
SUBACK,消息体内容是服务器对于SUBSCRIBE所申请的主题及QoS进行确认和回复。
UNSUBSCRIBE,消息体内容是要订阅的主题。

硬件

Jetson nano

在这里插入图片描述

Haas

在这里插入图片描述

Raspberry Pi

在这里插入图片描述

Ruff

在这里插入图片描述

HaaS600 EC600S 开发板

1.串口

Enhanced COM Port 为日志串口

Standard COM Port 为用户串口

$  ./amp.exe seriallist
COM5
COM4

在这里插入图片描述

     ...
     1569/main | app_status_indication_set 1
     1569/main | platform_init_step1 done, user_init=3, ret=0
     1569/main | platform_init_step1 enter temprature cali on signal
     1569/main | board_init platform_init_step1 done
     1573/main_task | sys_init go
     1573/main_task | sys freq calc : 320000000, wifi init 1 
     1573/main_task | sys_init soc_peripheral_init done
             Welcome to AliOS Things           
     1574/main_task | sys_init aos_components_init done
     1574/main_task |         mesh has been opened        
[Jan 01 00:00:01.482]<I>ULOG-test sys_init aos_components_init done

nano entry here!

2.putty

单片机或计算机在串口通信时的速率。

例如假设数据传送速率为120符号/秒(symbol/s)(也就是波特率为120Baud),又假设每一个符号为8位(bit),则其传送的比特率为(120symbol/s) * (8bit/symbol)=960bps.。
在这里插入图片描述

在这里插入图片描述

3.push

$   ./amp.exe serialput ./app COM5 -b 115200
device type: ymodem
generating app package...
Browserslist: caniuse-lite is outdated. Please run:
npx browserslist@latest --update-db

Why you should do it regularly:
https://github.com/browserslist/browserslist#browsers-data-updating
Wait shakehand with board ...
Please reboot board now
Putting: ██████████████████████████████ 2/2
put complete!

4.reboot

5.代码

import * as http from 'http'

var gpio = require('gpio');
var mqtt = require('mqtt');
var network = require('network');

var switch_01 = gpio.open({
	id: 'D13'
});

var net = network.openNetWorkClient();
var netType = net.getType();
var netStatus = net.getStatus();
var switch_01_status = 0;
if (netStatus == 'connect') {
	/* 网络状态已连接,获取网络状态 */
	getNetInfo();
} else {
	/* wifi或者以太网,设置ifconfig */
	if (netType === "wifi" || netType === "ethnet") {
		net.setIfConfig({
			dhcp_en: true, // true: 动态IP模式(以下参数可忽略); false: 静态IP模式(以下参数必填)
			ip_addr: '192.168.124.66',
			mask: '255.255.255.0',
			gw: '192.168.124.1',
			dns_server: '8.8.8.8'
		});
	}
	/* 网络状态未连接,如果是wifi设备则主动联网(4G模组中系统会自动注网) */
	if (netType === "wifi") {
		net.connect({
			ssid: 'wangpengpeng-ssid', //热点ssid
			password: '******' //热点的密码
		});
	}

	/**
	 * 监听网络连接成功事件,成功执行回调函数
	 */
	net.on('connect', function() {
		getNetInfo();
		// create mqtt client
		createMQTTClient();
	});
	net.on('disconnect', function() {});
}

function getNetInfo() {
	console.log('net status is connected, begin getting net information...');
	var info = net.getInfo();
	if (netType === "wifi" || netType === "ethnet") {
		/* 是否开启dhcp */
		console.log('net dhcp_en is: ' + info.netInfo.dhcp_en);
		/* ip地址*/
		console.log('net ip_addr is: ' + info.netInfo.ip_addr);
		/* dns */
		console.log('net dns_server is: ' + info.netInfo.dns_server);
		/* 网关 */
		console.log('net gateway is: ' + info.netInfo.gw);
		/* 子网掩码 */
		console.log('net mask is: ' + info.netInfo.mask);
		/* mac地址 */
		console.log('net mac is: ' + info.netInfo.mac);
		/* wifi信号强度 */
		console.log('net wifi rssi is: ' + info.netInfo.rssi);
		return;
	}
	console.log('unkown net type');
}

function createMQTTClient() {
	var client = mqtt.createClient({
		host: 'de28fe41.cn-hangzhou.emqx.cloud',
		port: 15129,
		clientId: 'wangpengpeng_01',
		username: 'wangpengpeng',
		password: '******',
	});

	client.on('connect', function() {
		// subscribe
		client.subscribe({
			topic: '/open',
			success: function() {
				switch_01_status = 1
				switch_01.writeValue(switch_01_status);
			},
			fail: function() {}
		});
		// subscribe
		client.subscribe({
			topic: '/close',
			success: function() {
				switch_01_status = 0
				switch_01.writeValue(switch_01_status);
			},
			fail: function() {}
		});
		// publish
		setInterval(function() {
			client.publish({
				topic: '/push',
				message: switch_01_status
			});
		}, 3 * 1000);
	});
	client.on('disconnect', function() {
		console.log('mqtt disconnect');
	});
	client.on('reconnect', function() {
		console.log('mqtt reconnect');
	});
	client.on('message', function(topic, payload) {
		console.log('[' + topic + ']  message: ' + payload);
	});
	client.on('close', function() {
		console.log('mqtt close');
	});
}

评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值