基于B/S結(jié)構(gòu)的物聯(lián)網(wǎng)應(yīng)用前端配置設(shè)計(jì)

周 炳，高美珍，洪家平

(1.湖北師范大學(xué)計(jì)算機(jī)科學(xué)與技術(shù)學(xué)院，湖北 黃石 435002；2.湖北師范大學(xué)物理與電子科學(xué)學(xué)院，湖北 黃石 435002；3.湖北師范大學(xué)數(shù)學(xué)與統(tǒng)計(jì)學(xué)院，湖北 黃石 435002)

基于B/S結(jié)構(gòu)的物聯(lián)網(wǎng)應(yīng)用前端配置設(shè)計(jì)

周 炳1，3，高美珍2，洪家平1

(1.湖北師范大學(xué)計(jì)算機(jī)科學(xué)與技術(shù)學(xué)院，湖北 黃石 435002；2.湖北師范大學(xué)物理與電子科學(xué)學(xué)院，湖北 黃石 435002；3.湖北師范大學(xué)數(shù)學(xué)與統(tǒng)計(jì)學(xué)院，湖北 黃石 435002)

物聯(lián)網(wǎng)上的傳感器采集的信息，匯集而形成了海量數(shù)據(jù)，當(dāng)用戶(hù)想要了解物聯(lián)網(wǎng)中某一設(shè)備的實(shí)時(shí)狀態(tài)信息或者是歷史數(shù)據(jù)信息時(shí)，如果直接通過(guò)操作數(shù)據(jù)庫(kù)，從海量的數(shù)據(jù)中選擇想要的數(shù)據(jù)，難度是相當(dāng)大的，所以一個(gè)好的應(yīng)用前端配置設(shè)計(jì)能有效的幫助用戶(hù)了解物聯(lián)網(wǎng)上設(shè)備的狀態(tài)信息。采用B/S 結(jié)構(gòu)模式，主要針對(duì)物聯(lián)網(wǎng)行業(yè)的應(yīng)用，設(shè)計(jì)了一種前端配置工具，通過(guò)該配置工具可以配置不同的數(shù)據(jù)視圖信息，以此來(lái)滿(mǎn)足用戶(hù)對(duì)不同設(shè)備信息的需求。

B/S 結(jié)構(gòu)；物聯(lián)網(wǎng)；應(yīng)用前端；配置工具

1 概述

物聯(lián)網(wǎng)產(chǎn)業(yè)發(fā)展的關(guān)鍵在于把現(xiàn)有的智能物件和子系統(tǒng)鏈接起來(lái)，實(shí)現(xiàn)應(yīng)用的大集成和管控營(yíng)一體化，要做到這一點(diǎn)，軟件和中間件將作為核心和靈魂起著至關(guān)重要的作用。而物聯(lián)網(wǎng)中間件處于物聯(lián)網(wǎng)的集成服務(wù)器端、感知層或傳輸層的嵌入式設(shè)備中，應(yīng)用服務(wù)器端中間件也稱(chēng)為物聯(lián)網(wǎng)業(yè)務(wù)基礎(chǔ)中間件，一般都是基于傳統(tǒng)的中間件構(gòu)建，同時(shí)加入設(shè)備連接和圖形化組態(tài)展示等模塊。因此，應(yīng)用服務(wù)器在整個(gè)物聯(lián)網(wǎng)行業(yè)中占有非常重要的地位。

應(yīng)用服務(wù)器是連接物聯(lián)網(wǎng)和用戶(hù)的橋梁，用戶(hù)可以通過(guò)用戶(hù)前端瀏覽器來(lái)訪問(wèn)應(yīng)用服務(wù)器，由于連入系統(tǒng)的設(shè)備千差萬(wàn)別，用戶(hù)可以根據(jù)自己的需求選擇配置工具來(lái)配置出所需要的數(shù)據(jù)視圖信息，這樣就可以讓用戶(hù)更好的了解和認(rèn)識(shí)物聯(lián)網(wǎng)。由此可見(jiàn)，應(yīng)用服務(wù)器在整個(gè)物聯(lián)網(wǎng)行業(yè)應(yīng)用起至關(guān)重要的作用，而一個(gè)好的應(yīng)用服務(wù)器的前端配置工具則更有畫(huà)龍點(diǎn)睛的效果。為此試圖設(shè)計(jì)一個(gè)基于B/S 結(jié)構(gòu)的物聯(lián)網(wǎng)行業(yè)應(yīng)用前端配置工具來(lái)解決上述問(wèn)題。

2 系統(tǒng)設(shè)計(jì)

2.1 系統(tǒng)總體設(shè)計(jì)

物聯(lián)網(wǎng)技術(shù)的重要基礎(chǔ)和核心仍舊是互聯(lián)網(wǎng)，物聯(lián)網(wǎng)上的傳感器不間斷的采集數(shù)據(jù)，數(shù)據(jù)信息量極其龐大，形成了海量信息。如圖1 所示，是物聯(lián)網(wǎng)應(yīng)用系統(tǒng)整體結(jié)構(gòu)原理圖，圖中，物聯(lián)網(wǎng)上的傳感器如簡(jiǎn)單感知節(jié)點(diǎn)(SSN)或者射頻設(shè)備(SM)將采集到得數(shù)據(jù)信息不間斷地傳送到高級(jí)感知節(jié)點(diǎn)(ASN)，這些信息再通過(guò)網(wǎng)絡(luò)傳輸?shù)较鄳?yīng)的行業(yè)應(yīng)用數(shù)據(jù)庫(kù)服務(wù)器。

如圖2是一般物聯(lián)網(wǎng)應(yīng)用系統(tǒng)軟件結(jié)構(gòu)原理框圖，由圖可見(jiàn)， 該系統(tǒng)由三個(gè)部分組成， 分別是客戶(hù)端瀏覽器，Web 應(yīng)用服務(wù)器和數(shù)據(jù)庫(kù)服務(wù)器。

圖1 物聯(lián)網(wǎng)應(yīng)用系統(tǒng)整體結(jié)構(gòu)原理圖

在物聯(lián)網(wǎng)中，應(yīng)用層是不可缺少的重要的一部分，它是物聯(lián)網(wǎng)和用戶(hù)的接口，它要與行業(yè)需求相結(jié)合，實(shí)現(xiàn)物聯(lián)網(wǎng)的智能應(yīng)用。當(dāng)用戶(hù)想要了解某一設(shè)備的實(shí)時(shí)狀態(tài)數(shù)據(jù)信息或者是歷史數(shù)據(jù)信息時(shí)，如果直接通過(guò)操作數(shù)據(jù)庫(kù)，從大量的數(shù)據(jù)中來(lái)選擇想要的數(shù)據(jù)這是相當(dāng)麻煩的，這樣也極不安全，也不利于對(duì)數(shù)據(jù)庫(kù)的管理。所以一個(gè)好的應(yīng)用前端能有效的幫助用戶(hù)了解設(shè)備的狀態(tài)信息，通過(guò)設(shè)計(jì)一些前端配置工具來(lái)配置出用戶(hù)所需要的不同的數(shù)據(jù)信息圖，清晰簡(jiǎn)潔的讓用戶(hù)通過(guò)應(yīng)用前端及時(shí)了解該應(yīng)用中設(shè)備的狀態(tài)，這樣更有利于設(shè)備的正常運(yùn)行和及時(shí)的故障處理，有效降低設(shè)備的運(yùn)營(yíng)成本，提高運(yùn)行效率。

本文要研究的就是B/S 前端應(yīng)用配置工具模塊，即圖2中的管理員配置模塊，從圖2中看出，它屬于Web 應(yīng)用服務(wù)器的一個(gè)部分，Web 應(yīng)用服務(wù)器主要分成三個(gè)功能模塊：用戶(hù)登錄模塊，管理員配置模塊和用戶(hù)應(yīng)用模塊。其中管理員配置模塊和用戶(hù)應(yīng)用管理模塊間的關(guān)系是：管理員配置模塊通過(guò)使用配置工具配置視圖并生成用戶(hù)應(yīng)用管理模塊所需要的數(shù)據(jù)視圖，生成的這些數(shù)據(jù)視圖可以供不同的用戶(hù)調(diào)用、查詢(xún)，滿(mǎn)足不同用戶(hù)的數(shù)據(jù)需求。

2.2 前端應(yīng)用配置工具模塊(管理員配置模塊)的設(shè)計(jì)

只有當(dāng)用戶(hù)的權(quán)限為超級(jí)管理員時(shí)才可以使用前端應(yīng)用配置工具模塊，即管理員配置模塊，高級(jí)用戶(hù)和普通用戶(hù)都不能使用此模塊。前端應(yīng)用配置功能模塊結(jié)構(gòu)圖如圖3所示。

由圖3可以看出，應(yīng)用配置工具模塊主要包括二個(gè)部分：應(yīng)用配置和視圖配置。應(yīng)用配置包括應(yīng)用管理功能和協(xié)議配置功能。應(yīng)用管理功能中，超級(jí)管理員可以增加和刪除應(yīng)用，對(duì)應(yīng)用進(jìn)行管理；協(xié)議配置功能中，超級(jí)管理員可以添加和刪除應(yīng)用的有關(guān)協(xié)議，這些協(xié)議是用來(lái)解析從服務(wù)分發(fā)服務(wù)器(SDS)轉(zhuǎn)發(fā)過(guò)來(lái)的簡(jiǎn)單感知節(jié)點(diǎn)(SSN)或者射頻設(shè)備(SM)的數(shù)據(jù)報(bào)文，并將數(shù)據(jù)存入應(yīng)用數(shù)據(jù)庫(kù)服務(wù)器。視圖配置包括應(yīng)用視圖管理、文件管理、菜單設(shè)置和腳本設(shè)置。視圖管理功能中，管理員可以根據(jù)相應(yīng)應(yīng)用，配置綁定視圖顯示SSN/SM數(shù)據(jù)信息，可以配置的視圖類(lèi)型包括歷史數(shù)據(jù)視圖、實(shí)時(shí)狀態(tài)視圖，曲線視圖和支持用戶(hù)自定義視圖等多種不同形式的數(shù)據(jù)視圖；文件管理功能支持上傳和管理js/css/jpg/png等格式的文檔，方便管理員對(duì)應(yīng)用視圖所需要的js腳本和css腳本進(jìn)行管理；菜單設(shè)置功能可以設(shè)置相應(yīng)的應(yīng)用操作菜單。高級(jí)用戶(hù)和普通用戶(hù)在查看時(shí)只能查看到與這里設(shè)置的菜單相對(duì)應(yīng)的視圖和數(shù)據(jù)信息；腳本管理與設(shè)置功能支持對(duì)提交后的數(shù)據(jù)在后臺(tái)隱式處理后生成指令，再發(fā)送到設(shè)備。雖然前端js也支持直接發(fā)送指令到設(shè)備，但是因?yàn)閖s腳本是在客戶(hù)端運(yùn)行，代碼是顯式的，同時(shí)也是不安全的，所以此功能就是為了提高系統(tǒng)的安全性能，需要在后臺(tái)進(jìn)行指令的整理，再發(fā)送指令。

3 前端應(yīng)用配置工具模塊(管理員配置模塊)的實(shí)現(xiàn)

應(yīng)用配置包括應(yīng)用管理功能和協(xié)議配置功能。應(yīng)用管理功能中，超級(jí)管理員可以對(duì)應(yīng)用進(jìn)行管理，包括添加應(yīng)用、刪除應(yīng)用和修改應(yīng)用。下面的代碼是添加新應(yīng)用的部分代碼段：

public function action_add()

{

// 查詢(xún)所有公司

$data['companies']= Service_Company::getAllShort();

# SOAP應(yīng)用目錄

$serverSoapDir = Kohana::$config->load('config.server_soap_dir');

$data['serverSoapDir']= rtrim($serverSoapDir, '/').DIRECTORY_SEPARATOR;

# SOAP應(yīng)用接口

$data['soapHostUrl']= 'http://'.$_SERVER['SERVER_NAME'].

($_SERVER["SERVER_PORT"]!='80'?':'.$_SERVER["SERVER_PORT"]:'').'/soap/';

$view = View::factory('manage/application/add')->set($data)->set('do', 'add');

22

$this->response->body($view);

}

這里主要以應(yīng)用配置中協(xié)議配置這部分為例來(lái)介紹，協(xié)議配置功能中，超級(jí)管理員可以添加和刪除相關(guān)應(yīng)用的有關(guān)協(xié)議，對(duì)協(xié)議進(jìn)行配置和管理，本系統(tǒng)只支持XML格式的協(xié)議。如圖4所示，當(dāng)管理員要進(jìn)行協(xié)議配置時(shí)，點(diǎn)擊“協(xié)議配置”，就會(huì)出現(xiàn)管理員對(duì)協(xié)議進(jìn)行管理的操作界面，包括添加、刪除協(xié)議。當(dāng)管理員要添加新的協(xié)議時(shí)，顯示出如圖4所示的操作界面。添加新協(xié)議的主要部分代碼如下：

Public function action_add(){

$do = Arr::get ($_POST, 'do');

if ($do) {

try {

$ApplicationID = Arr::get($_POST, 'ApplicationID');

$ApplicationID = basename($ApplicationID);

if (empty($ApplicationID)) throw new Exception ('找不到應(yīng)用參數(shù)');

Upload::$default_directory= Kohana::$cache_dir; //默認(rèn)保存文件夾

$allowed = array('xml');

$file = $_FILES ['Filedata'];

$array = Validation::factory ($_FILES);

$array->rule ('Filedata', 'Upload::not_empty')

->rule('Filedata', 'Upload::valid')

->rule ('Filedata', 'Upload::type', array(':value', $allowed));

# 保存xml

if ($array->check())

{ // '上傳成功';

$file_path = Upload::save ($file);

} else {

# 處理上傳失敗

$errors = $array->errors ('upload');

throw new Exception( '上傳文件失敗，' . $errors['Filedata']);

}

圖4 添加新協(xié)議的界面截圖

4 結(jié)語(yǔ)

物聯(lián)網(wǎng)信息技術(shù)將會(huì)隨著互聯(lián)網(wǎng)的快速發(fā)展而越來(lái)越成熟，用戶(hù)對(duì)設(shè)備數(shù)據(jù)的需求也會(huì)越來(lái)越多，本文研究的應(yīng)用前端配置工具基本實(shí)現(xiàn)了用戶(hù)對(duì)不同數(shù)據(jù)視圖信息的配置與管理功能。隨著物聯(lián)網(wǎng)信息技術(shù)的發(fā)展，應(yīng)用前端作為物聯(lián)網(wǎng)和用戶(hù)的接口，更完美更成熟的前端配置工具一定能夠給用戶(hù)配置出良好的前端Web 界面，滿(mǎn)足不同用戶(hù)的前端需求。

[1]藍(lán) 科,全錦琪,劉洪宇,等. 一種可配置的可視化流程的設(shè)計(jì)[J].信息通信，2015,(7):64～65.

[2]孫衛(wèi)琴,精通Struts：基于MVC 的JavaWeb 設(shè)計(jì)與開(kāi)發(fā)[M]北京：電子工業(yè)出版社，2005.

[3]洪家平,周 炳,高美珍.基于單片機(jī)的觸摸屏在電子艾灸儀中的應(yīng)用研究[J].湖北師范學(xué)院學(xué)報(bào)(自然科學(xué)版)，2016,(2):13～17.

[4]雷聚超,繆 治．ActiveForm 構(gòu)建B/S、C/S 的混合結(jié)構(gòu)[J].計(jì)算機(jī)與數(shù)字工程，2011,(1):6～9.

[5]吳 鵬.MVC 模式與Struts 架構(gòu)的研究[J].軟件導(dǎo)刊，2010,(8):41～44.

[6]高美珍,洪家平. 基于藍(lán)牙的防丟失報(bào)警器的設(shè)計(jì)與實(shí)現(xiàn)[J].湖北師范學(xué)院學(xué)報(bào)(自然科學(xué)版)，2016,(1):16～19.

[7]樊 琦,余衛(wèi)東,陳文輝,等. ACME2.0采集前端軟件升級(jí)改進(jìn)研究[J].測(cè)井技術(shù)，2014,(2):211～215.

[8]王鳳玲.基于PHP+MYSQL 的新聞發(fā)布系統(tǒng)的研究與實(shí)現(xiàn)[J].計(jì)算機(jī)應(yīng)用與軟件，2012,(2):30～34.

The design of the front-end configuration for the application ofthe Internet of things based on the B/S structure

ZHOU Bing1,3，GAO Mei-zhen2，HONG Jia-ping1

(1 College of computer science and techloge, Hubei normal university Hubei huangshi 435002 china)(2 College of Physics and electron science, Hubei normal university Hubei huangshi 435002 china)(3 College of mathematics and statistcs, Hubei normal university Hubei huangshi 435002 china)

Information collected from time to time in the Internet of Things sensor transmitted over the network, Because of its very large number, forming a mass of information. When users want to know a device real-time status information or historical information in the Internet of Things, by directly manipulating the database from the large amounts of data to select the desired data, it is almost impossible to achieve. Therefore, a good application front-end can effectively help users understand the device status information (such as temperature, humidity, voltage, current, etc.). This article is based mainly on the B/S structure can be design front-end configuration tool for the networking industry, through the front-end configuration tool, we can configure different view of the data information to meet users different needs of different devices.

B/S structure；internet of things application front-end；configuration tool

2016—11—18

周炳(1992— ) ，男，湖北武漢人，碩士研究生，主要研究方向?yàn)樾畔⑴c智能計(jì)算.

洪家平(1964— )，男，湖北仙桃人，教授.

TP635

B

2096-3149(2017)02- 0033-05

10.3969/j.issn.2096-3149.2017.02.008