使用JavaScript和MQTT開發(fā)物聯(lián)網(wǎng)應用示例解析
如果說Java和C#哪個是最好的開發(fā)語言,無疑會挑起程序員之間的相互怒懟,那如果說JavaScript是動態(tài)性最好的語言,相信大家都不會有太大的爭議。隨著越來越多的硬件平臺和開發(fā)板開始支持JavaScript,JavaScript在硬件端以及物聯(lián)網(wǎng)領域有了新的機會。
IoT應用開發(fā)的數(shù)據(jù)鏈路
圖1是一個智能家居物聯(lián)平臺的數(shù)據(jù)鏈路。

圖1 智能家居物聯(lián)平臺的數(shù)據(jù)鏈路
一般來說,可以把IoT應用分為如圖所示的四層。
- client層:指的是IoT設備,可以是冰箱、空調(diào),也可以是一些溫濕度傳感器。
- gateway層:大多數(shù)場景中gateway是家里的WiFi路由器,也有小部分是基于Zigbee或藍牙的網(wǎng)關設備。智能生活場景中的gateway數(shù)量相對于工業(yè)領域要少很多,在工業(yè)領域存在大量的邊緣計算放在gateway層進行處理(霧計算)。
- cloud云層:這里是集中處理業(yè)務的地方。
- 應用層:這一層是直接與用戶打交道的地方,可以是通過電腦的Web瀏覽器、手機App,也可以是有屏幕的智能設備的顯示器。隨著語音技術的發(fā)展,無屏設備也可以通過語音交互,作為一個應用存在于物聯(lián)網(wǎng)的交互層。
物聯(lián)設備(下文統(tǒng)稱為client),可以是單個設備或多個設備組成的應用場景。比如冰箱把運行的功耗數(shù)據(jù)、庫存數(shù)據(jù)、溫度數(shù)據(jù)采集,通過gateway發(fā)送到cloud層,cloud層收集數(shù)據(jù)后進行異常判斷,做智能模式推薦等業(yè)務處理后到application層進行展現(xiàn)和交互。用戶可以通過冰箱的設備數(shù)據(jù)進行模式選擇,還可以做一些與設備無關的增值服務,比如聽音樂、買菜等,這就是一個智能冰箱的數(shù)據(jù)鏈路。還有些client是成組智能場景的,比如溫濕度傳感器將數(shù)據(jù)上傳到cloud,經(jīng)過處理和加工,動態(tài)控制家中空調(diào)的溫度,調(diào)節(jié)空氣凈化器的運行模式等。這么描述好像沒有體現(xiàn)出cloud層的作用,那如果運行模式是用戶預先配置好的呢?如“當溫度超過25度,請幫我打開空調(diào)”,這些業(yè)務都可以通過cloud層進行處理。
client層的連接方式有WiFi、Bluetooth、Zigbee,而MQTT是為了讓物聯(lián)網(wǎng)設備更加互聯(lián)互通而出現(xiàn)的應用層數(shù)據(jù)協(xié)議。
MQTT+JavaScript
MQTT是一個長連接的通訊應用層協(xié)議,最大的特點是數(shù)據(jù)精簡、消息可靠、Publish-Subscribe模式靈活易用。MQTT已經(jīng)成為IoT傳輸?shù)臉藴蕝f(xié)議,應用非常廣泛。
圖2中Client指的是物聯(lián)網(wǎng)設備。Client通過對Topic的訂閱和發(fā)布數(shù)據(jù)管理應用中的數(shù)據(jù)流動,而Broker是MQTT應用中用于管理Topic的角色。Server是物聯(lián)網(wǎng)應用中的服務端,用于處理業(yè)務邏輯。
圖2 MQTT的數(shù)據(jù)鏈路圖
MQTT被廣泛使用的一個重要的原因是MQTT的生態(tài)非常完善,同時也支持JavaScript。因此圖2所示的所有鏈路和模塊,都可以通過JavaScript實現(xiàn)。
圖3 JavaScript在MQTT架構(gòu)中常用的架構(gòu)
JavaScript在MQTT架構(gòu)中常用的框架
mosca(https://github.com/mcollina/mosca)
mosca是一個用JavaScript實現(xiàn)的MQTT Broker。不僅如此,mosca還增加了對數(shù)據(jù)庫,如Redis、MongoDB的支持,用來實現(xiàn)消息數(shù)據(jù)的存儲。
MQTT.js(https://github.com/mqttjs/MQTT.js)
MQTT.js是官網(wǎng)推薦的JavaScript實現(xiàn)的Client端。
KOA和Express
這兩者都是非常主流的Node版本的Server,簡單易用。
實戰(zhàn)物聯(lián)網(wǎng)應用
這節(jié)我們運用之前介紹的框架,自己動手完成一個簡單的物聯(lián)網(wǎng)應用。應用場景如圖4所示,溫度傳感器用于接收溫度,并把文檔通過MQTT發(fā)送到Server端,在Server端進行業(yè)務處理,根據(jù)溫度計算出穿衣提示,通過MQTT把數(shù)據(jù)發(fā)送到特定的Topic,App訂閱Topic獲取數(shù)據(jù)后進行展現(xiàn)。
圖4 “穿衣提示”業(yè)務場景框架
Broker端的實現(xiàn)
Broker端使用mosca,參考網(wǎng)頁https://github.com/mcollina/mosca。
安裝mosca。
nmp install mosca --save
啟動mosca。這里需要注意,如果本地沒有配置MongoDB,則需要把ascoltatore中的內(nèi)容全部注釋掉。
var mosca = require('mosca');
var ascoltatore = {
//using ascoltatore
// type: 'mongo',
// url: 'mongodb://localhost:27017/mqtt',
// pubsubCollection: 'ascoltatori',
// mongo: {}
};
var settings = {
port: 1883,
backend: ascoltatore
};
var server = new mosca.Server(settings);
server.on('clientConnected', function(client) {
console.log('client connected', client.id);
});
// fired when a message is received
server.on('published', function(packet, client) {
console.log('Published', packet.payload); //{"clientId":"mqttjs_02fea7b4","topic":"/tips"}
// console.log('>>>packet', packet); //{"clientId":"mqttjs_02fea7b4","topic":"/tips"}
});
server.on('ready', setup);
// fired when the mqtt server is ready
function setup() {
console.log('Mosca server is up and running');
}
代碼完成后,啟動文件,本地的一個Broker就跑在localhost的1883端口上了。
Client端的溫度傳感器實現(xiàn)
Client使用MQTT.js實現(xiàn),參考網(wǎng)頁https://github.com/mqttjs/MQTT.js
安裝
npm install mqtt --save
啟動
var mqtt = require('mqtt');
var client = mqtt.connect('mqtt://localhost:1883');
client.on('connect', function () {
console.log('>>> connected')
// client.subscribe('/tips')
setInterval(
()=>{client.publish('/temperature', '30');},
3000
);
})
client.on('message', function (topic, message) {
// message is Buffer
console.log(message.toString())
})
// client.end();
執(zhí)行Node index后Client就啟動了,可以看到在MQTT.connect方法中連接了上一節(jié)中啟動的Broker地址,連接成功后,Client會輸出日志,“>>> connected”,Broker的控制臺也會輸出Client的連接信息。
這里模擬了溫度傳感器,定時3秒向/temperature的Topic中發(fā)送溫度數(shù)據(jù)。
本節(jié)的溫度器可以在電腦中使用Node方式運行,也可以運行在支持JavaScript的開發(fā)板中,如RUFF、NodeMCU、Raspberry Pi,并且可以使用真實的傳感器。
Server的實現(xiàn)
Server使用MQTT.js訂閱Client發(fā)送到/temperature Topic的數(shù)據(jù)進行處理,把處理后的數(shù)據(jù)轉(zhuǎn)譯成JSON發(fā)送到另一業(yè)務主題/tips中。
實現(xiàn)代碼如下:
'use strict'
const mqtt = require('mqtt');
var client = mqtt.connect('mqtt://localhost:1883');
client.on('connect', function () {
console.log('>>> connected');
client.subscribe('/temperature');
})
client.on('message', function (topic, message) {
var temperature = parseInt(message.toString());
var data = {temperature};
if (temperature >= 60) {
data.tips = "熱... 500服務器故障";
}
else if (temperature >= 50) {
data.tips = "今天天氣非常熱,建議不要穿衣服了";
}
else if (temperature >= 40) {
data.tips = "今天天氣十分的熱,建議穿短袖T恤+短褲";
}
else if (temperature >= 30) {
data.tips = "今天天氣有點的熱,建議穿短袖T恤";
}
else if (temperature >= 0) {
data.tips = "今天天氣正好,可以穿上一件薄衣服";
}
else if (temperature >= -10) {
data.tips = "今天天氣十分寒冷,棉襖可以穿上一件";
}
else {
data.tips = "今天天氣十分十分寒冷,棉襖可以穿上二件";
}
client.publish('/tips', JSON.stringify(data));
// if (temperature+1) {}
// message is Buffer
console.log(JSON.stringify(data));
})
App的實現(xiàn)
Demo的App使用KOA啟動一個Web,在Web中展現(xiàn)當前溫度對應的穿衣提示,通過訂閱tips獲取數(shù)據(jù)。
安裝koa
$ npm install koa
實現(xiàn)代碼
'use strict'
const Koa = require('koa');
const mqtt = require('mqtt');
const app = new Koa();
var msg = {temperature:"-",tips:""};
// response
app.use(ctx => {
ctx.body = "當前溫度:" + msg.temperature + "度" + "\n" + '穿衣提示:'+msg.tips + "\n" ;
});
app.listen(3000);
//mqtt
var client = mqtt.connect('mqtt://localhost:1883');
client.on('connect', function () {
console.log('>>> connected');
client.subscribe('/tips');
})
client.on('message', function (topic, message) {
var data = JSON.parse(message.toString());
console.log(message.toString());
console.log(data.tips);
msg = data;
// if (temperature+1) {}
// message is Buffer
// let str = message.toString();
// let data = JSON.parse(message);
// console.log(data.tips);
// msg = message.toString();
})
Demo小節(jié)
本章給出了一個簡單的物聯(lián)網(wǎng)業(yè)務的業(yè)務場景和實現(xiàn)邏輯,其中Client也可以運行在電腦上進行Demo查看,或是跑在真實物聯(lián)設備或開發(fā)版上。如圖5,筆者使用RUFF開發(fā)板實現(xiàn)了一次。
完整Demo代碼已經(jīng)分享在github中,大家可以輸入URL下載。
https://github.com/coolnameismy/javascript-mqtt-demo-wearingTip
總結(jié)
本文和大家交流了物聯(lián)網(wǎng)應用的一般數(shù)據(jù)鏈路、MQTT協(xié)議的架構(gòu),并基于MQTT實現(xiàn)了一個簡單的物聯(lián)網(wǎng)應用。
現(xiàn)在正是前端工程師的大好機會,越來越多的嵌入式設備都開始支持JavaScript,原因是現(xiàn)在有很多JavaScript引擎可以把JavaScript轉(zhuǎn)換成各種平臺的底層代碼,比較有名的有Jerryscript、Duktape等。隨著越來越多的JavaScript工程師進入嵌入式開發(fā)的領域,嵌入式應用開發(fā)也會出現(xiàn)前后端分離的情況(應用開發(fā)或是驅(qū)動開發(fā)),類似于Web開發(fā)的前后端分離。前端關注在應用、創(chuàng)意、數(shù)據(jù)鏈路、用戶體現(xiàn)上,而后端則關心GPIO、I2C的底層數(shù)據(jù)接口和驅(qū)動,平臺兼容性等方向。
到此這篇關于使用JavaScript和MQTT開發(fā)物聯(lián)網(wǎng)應用示例解析的文章就介紹到這了,更多相關JavaScript和MQTT開發(fā)物聯(lián)網(wǎng)應用內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關文章希望大家以后多多支持腳本之家!
相關文章
layui 上傳文件_批量導入數(shù)據(jù)UI的方法
今天小編就為大家分享一篇layui 上傳文件_批量導入數(shù)據(jù)UI的方法,具有很好的參考價值,希望對大家有所幫助。一起跟隨小編過來看看吧2019-09-09
electron-builder允許安裝時請求提升權限的場景分析
electron-builder 作為一個用于 Electron 應用程序打包的工具,需要下載并使用 Electron 運行時來創(chuàng)建可執(zhí)行文件,這篇文章給大家介紹electron-builder允許安裝時請求提升權限的相關知識,感興趣的朋友跟隨小編一起看看吧2024-03-03
通過js動態(tài)創(chuàng)建標簽,并設置屬性方法
下面小編就為大家分享一篇通過js動態(tài)創(chuàng)建標簽,并設置屬性方法,具有很好的參考價值,希望對大家有所幫助。一起跟隨小編過來看看吧2018-02-02
獲取網(wǎng)站跟路徑的javascript代碼(站點及虛擬目錄)
js獲取網(wǎng)站根路徑(站點及虛擬目錄) ,需要的朋友可以參考下。2009-10-10
微信小程序利用canvas 繪制幸運大轉(zhuǎn)盤功能
本文通過一段簡單的實例代碼給大家介紹微信小程序利用canvas 繪制幸運大轉(zhuǎn)盤,代碼很簡單,感興趣的朋友跟隨腳本之家小編一起看看吧2018-07-07
js實現(xiàn)鼠標點擊文本框自動選中內(nèi)容的方法
這篇文章主要介紹了js實現(xiàn)鼠標點擊文本框自動選中內(nèi)容的方法,涉及javascript鼠標點擊事件onClick及選擇事件select的使用技巧,非常簡單實用,需要的朋友可以參考下2015-08-08

