謝作如

SIoT是一款簡單易用的MQTT服務(wù)器軟件，也是“虛谷物聯(lián)”項(xiàng)目的核心軟件之一。SIoT不用安裝，也不用注冊(cè)、設(shè)置，一鍵運(yùn)行后，其他物聯(lián)網(wǎng)設(shè)備（如掌控板）按照一定的規(guī)范接入即可正常使用。正因?yàn)檫@一點(diǎn)，SIoT得到創(chuàng)客教師們的熱捧，成為中小學(xué)物聯(lián)網(wǎng)教學(xué)的重要支撐軟件。

但是，能不能用SIoT做一個(gè)真實(shí)的物聯(lián)網(wǎng)項(xiàng)目，如智慧農(nóng)場、校園氣象站、門禁系統(tǒng)等？我們會(huì)發(fā)現(xiàn)，功能實(shí)現(xiàn)并不難，但管理設(shè)備不太方便。SIoT畢竟是通用的MQTT服務(wù)器，在線設(shè)備管理之類的功能，只能自行開發(fā)，這樣難度就有點(diǎn)大。因而，我冒出一個(gè)大膽的想法：能不能為SIoT編寫一個(gè)插件，讓這個(gè)通用的MQTT服務(wù)器變成可以商用的物聯(lián)網(wǎng)系統(tǒng)管理平臺(tái)？

為SIoT編寫網(wǎng)頁插件的可行性分析

作為SIoT開發(fā)團(tuán)隊(duì)的成員，我對(duì)SIoT的原理還是比較清楚的。SIoT運(yùn)行后，會(huì)啟動(dòng)兩種網(wǎng)絡(luò)服務(wù)：一是MQTT服務(wù)，作用是處理MQTT消息;二是Web服務(wù)，用來運(yùn)行Web管理頁面，實(shí)現(xiàn)在線管理。具體工作流程如圖1所示。

SIoT是一款綠色軟件，主目錄下文件夾“static”中存放的是SIoT的Web管理頁面，如下頁圖2所示。需要強(qiáng)調(diào)的是，SIoT的Web管理頁面和SIoT服務(wù)器之間是利用WebAPI的方式交互數(shù)據(jù)的。也就是說，和我們傳統(tǒng)的動(dòng)態(tài)網(wǎng)站開發(fā)方式不同，Web管理頁面并不是去讀數(shù)據(jù)庫，而是發(fā)送特定的Web請(qǐng)求，SIoT再返回相應(yīng)的數(shù)據(jù)，實(shí)現(xiàn)頁面管理功能。這種軟件設(shè)計(jì)能夠?qū)⒉煌木W(wǎng)絡(luò)服務(wù)隔離，開發(fā)效率更高。

用記事本打開“static”中的HTML文件，如“devices.html”，在源代碼中可以看到其使用了目前最熱門的Web前端框架vue.js技術(shù)，如下頁圖3所示。前端頁面設(shè)計(jì)和后端數(shù)據(jù)隔離，是現(xiàn)在最主流的Web開發(fā)模式。那么，思路就呼之欲出了：只要在SIoT的管理頁面上，按照既定的API規(guī)范，就能實(shí)現(xiàn)我們預(yù)設(shè)的功能了。如果同樣采用Vue.js編寫，那和現(xiàn)有的Web頁面結(jié)合更加緊密。對(duì)于曾經(jīng)開發(fā)過多個(gè)網(wǎng)站的資深網(wǎng)管來說，編寫這樣的頁面，技術(shù)上不算太難。

SIoT的API功能簡介

我曾經(jīng)在SIoT的文檔中，提供過一個(gè)有趣的范例，即在PPT和Doc中插入超鏈接，就能通過SIoT控制掌控板的開燈、關(guān)燈，甚至可以和Mind+中的角色互動(dòng)。這一功能的實(shí)現(xiàn)，其實(shí)就是利用了SIoT提供的WebAPI。只要通過瀏覽器訪問特定的地址即可。

地址：http：//SIoT的IP：8080/publish？topic=xzr/001&msg=on&iname=siot&ipwd=dfrobot。

這里的“SIoT的IP”指運(yùn)行SIoT的電腦IP地址，iname和ipwd要替換為SIoT的用戶名和密碼。

那么，SIoT究竟提供了哪些API？打開SIoT的使用文檔，在“高級(jí)操作技巧”的“3. WebAPI”部分，可以看到具體的WebAPI清單，如右表所示。

SIoT文檔地址：https：//siot.readthedocs.io/

“智慧農(nóng)場”管理插件的編寫

我準(zhǔn)備利用SIoT來開發(fā)一個(gè)學(xué)校智慧農(nóng)場的項(xiàng)目。這個(gè)項(xiàng)目事先定義了物聯(lián)網(wǎng)協(xié)議MQTT的各種細(xì)節(jié)，如每個(gè)物聯(lián)網(wǎng)終端節(jié)點(diǎn)的名稱為“sf”加局域網(wǎng)IP地址的尾號(hào)，終端上的傳感器或執(zhí)行器模塊，用連接的引腳編號(hào)來命名，如a0、d2。這樣一來，每一個(gè)模塊都有唯一的TopicID，如“sf88/a0”表示名稱為“sf88”的終端上的設(shè)備“a0”。

其中，“a0”接光線傳感器，“a1”接土壤濕度傳感器，“d2”接電磁閥。這個(gè)插件的作用是，將所有的終端信息顯示在一個(gè)頁面上，并能夠用網(wǎng)頁按鈕的方式進(jìn)行澆水，也就是給“sf88/d2”的TopicID發(fā)送特定的消息。

第一步：新建網(wǎng)頁

復(fù)制“devices.html”文件，重命名為“sfarm.html”。然后在“modules”文件夾中，也將“devices.js”文件復(fù)制一份，改名為“sfarm.js”。當(dāng)然，每一個(gè)頁面上都要做好超級(jí)鏈接，這些都是最基礎(chǔ)的工作，不再贅述。

接下來，需要修改“sfarm.html”文件。核心工作是修改“

”和“

”之間的內(nèi)容。當(dāng)然，這要求懂一點(diǎn)HTML語法和Vue.js。我也是邊讀Vue.js教程，邊請(qǐng)教身邊的專家，然后照貓畫虎寫的，如圖4所示。

第二步：編寫js代碼

設(shè)計(jì)好網(wǎng)頁后，最難的工作肯定是編寫js代碼。因?yàn)樾枰獙懙膬?nèi)容有點(diǎn)多，這里重點(diǎn)介紹“sendMsg_af”的函數(shù)。這是供“sfarm.html”上的按鈕來使用的。如何實(shí)現(xiàn)“澆水”？其實(shí)就是發(fā)送一個(gè)內(nèi)容為“1”的消息（如圖5）。

第三步：效果測試

運(yùn)行SIoT，打開Web管理端，即可看到多了一個(gè)名為“智慧農(nóng)場”的欄目。點(diǎn)擊后，就會(huì)看到所有的設(shè)備都列出來了，在一個(gè)表格中顯示了最新的光照和土壤濕度數(shù)據(jù)。點(diǎn)擊“澆水”按鈕，就能給相應(yīng)的TopicID發(fā)送消息。

插件編寫給“虛谷物聯(lián)”帶來了新玩法

這個(gè)“智慧農(nóng)場”插件一經(jīng)展示，就贏得了很多教師的好評(píng)和關(guān)注，有希望提供開發(fā)教程的，也有提出新的需求的。毫無疑問，這種開發(fā)插件的形式，給“虛谷物聯(lián)”帶來了新拓展思路。例如：編寫一個(gè)校園氣象站的插件，在一個(gè)頁面上呈現(xiàn)最新的溫度、濕度、光照、風(fēng)向、風(fēng)速等信息;編寫一個(gè)會(huì)議室門禁管理插件，可以遠(yuǎn)程開門，可以遙控空調(diào)，還可以顯示攝像頭畫面;等等。

我始終認(rèn)為，只有在真實(shí)的情境中應(yīng)用，創(chuàng)客作品的制作、STEM項(xiàng)目的研究才顯得更有價(jià)值。給SIoT編寫插件的最重要意義在于，將技術(shù)門檻降低了，物聯(lián)網(wǎng)技術(shù)的應(yīng)用顯得越來越簡單，開發(fā)真實(shí)應(yīng)用不再困難。目前，SIoT的開發(fā)人員已經(jīng)準(zhǔn)備在下一版優(yōu)化代碼，讓編寫插件的技術(shù)難度變得更低。到那個(gè)時(shí)候，相信會(huì)有更多的中小學(xué)智慧校園系統(tǒng)中，運(yùn)行著中小學(xué)生自主編寫的各種智能應(yīng)用。