基于B/S结构的物联网应用前端配置设计

周 炳，高美珍，洪家平

(1.湖北师范大学计算机科学与技术学院，湖北 黄石 435002；2.湖北师范大学物理与电子科学学院，湖北 黄石 435002；3.湖北师范大学数学与统计学院，湖北 黄石 435002)

基于B/S结构的物联网应用前端配置设计

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

(1.湖北师范大学计算机科学与技术学院，湖北 黄石 435002；2.湖北师范大学物理与电子科学学院，湖北 黄石 435002；3.湖北师范大学数学与统计学院，湖北 黄石 435002)

物联网上的传感器采集的信息，汇集而形成了海量数据，当用户想要了解物联网中某一设备的实时状态信息或者是历史数据信息时，如果直接通过操作数据库，从海量的数据中选择想要的数据，难度是相当大的，所以一个好的应用前端配置设计能有效的帮助用户了解物联网上设备的状态信息。采用B/S 结构模式，主要针对物联网行业的应用，设计了一种前端配置工具，通过该配置工具可以配置不同的数据视图信息，以此来满足用户对不同设备信息的需求。

B/S 结构；物联网；应用前端；配置工具

1 概述

物联网产业发展的关键在于把现有的智能物件和子系统链接起来，实现应用的大集成和管控营一体化，要做到这一点，软件和中间件将作为核心和灵魂起着至关重要的作用。而物联网中间件处于物联网的集成服务器端、感知层或传输层的嵌入式设备中，应用服务器端中间件也称为物联网业务基础中间件，一般都是基于传统的中间件构建，同时加入设备连接和图形化组态展示等模块。因此，应用服务器在整个物联网行业中占有非常重要的地位。

应用服务器是连接物联网和用户的桥梁，用户可以通过用户前端浏览器来访问应用服务器，由于连入系统的设备千差万别，用户可以根据自己的需求选择配置工具来配置出所需要的数据视图信息，这样就可以让用户更好的了解和认识物联网。由此可见，应用服务器在整个物联网行业应用起至关重要的作用，而一个好的应用服务器的前端配置工具则更有画龙点睛的效果。为此试图设计一个基于B/S 结构的物联网行业应用前端配置工具来解决上述问题。

2 系统设计

2.1 系统总体设计

物联网技术的重要基础和核心仍旧是互联网，物联网上的传感器不间断的采集数据，数据信息量极其庞大，形成了海量信息。如图1 所示，是物联网应用系统整体结构原理图，图中，物联网上的传感器如简单感知节点(SSN)或者射频设备(SM)将采集到得数据信息不间断地传送到高级感知节点(ASN)，这些信息再通过网络传输到相应的行业应用数据库服务器。

如图2是一般物联网应用系统软件结构原理框图，由图可见， 该系统由三个部分组成， 分别是客户端浏览器，Web 应用服务器和数据库服务器。

图1 物联网应用系统整体结构原理图

在物联网中，应用层是不可缺少的重要的一部分，它是物联网和用户的接口，它要与行业需求相结合，实现物联网的智能应用。当用户想要了解某一设备的实时状态数据信息或者是历史数据信息时，如果直接通过操作数据库，从大量的数据中来选择想要的数据这是相当麻烦的，这样也极不安全，也不利于对数据库的管理。所以一个好的应用前端能有效的帮助用户了解设备的状态信息，通过设计一些前端配置工具来配置出用户所需要的不同的数据信息图，清晰简洁的让用户通过应用前端及时了解该应用中设备的状态，这样更有利于设备的正常运行和及时的故障处理，有效降低设备的运营成本，提高运行效率。

本文要研究的就是B/S 前端应用配置工具模块，即图2中的管理员配置模块，从图2中看出，它属于Web 应用服务器的一个部分，Web 应用服务器主要分成三个功能模块：用户登录模块，管理员配置模块和用户应用模块。其中管理员配置模块和用户应用管理模块间的关系是：管理员配置模块通过使用配置工具配置视图并生成用户应用管理模块所需要的数据视图，生成的这些数据视图可以供不同的用户调用、查询，满足不同用户的数据需求。

2.2 前端应用配置工具模块(管理员配置模块)的设计

只有当用户的权限为超级管理员时才可以使用前端应用配置工具模块，即管理员配置模块，高级用户和普通用户都不能使用此模块。前端应用配置功能模块结构图如图3所示。

由图3可以看出，应用配置工具模块主要包括二个部分：应用配置和视图配置。应用配置包括应用管理功能和协议配置功能。应用管理功能中，超级管理员可以增加和删除应用，对应用进行管理；协议配置功能中，超级管理员可以添加和删除应用的有关协议，这些协议是用来解析从服务分发服务器(SDS)转发过来的简单感知节点(SSN)或者射频设备(SM)的数据报文，并将数据存入应用数据库服务器。视图配置包括应用视图管理、文件管理、菜单设置和脚本设置。视图管理功能中，管理员可以根据相应应用，配置绑定视图显示SSN/SM数据信息，可以配置的视图类型包括历史数据视图、实时状态视图，曲线视图和支持用户自定义视图等多种不同形式的数据视图；文件管理功能支持上传和管理js/css/jpg/png等格式的文档，方便管理员对应用视图所需要的js脚本和css脚本进行管理；菜单设置功能可以设置相应的应用操作菜单。高级用户和普通用户在查看时只能查看到与这里设置的菜单相对应的视图和数据信息；脚本管理与设置功能支持对提交后的数据在后台隐式处理后生成指令，再发送到设备。虽然前端js也支持直接发送指令到设备，但是因为js脚本是在客户端运行，代码是显式的，同时也是不安全的，所以此功能就是为了提高系统的安全性能，需要在后台进行指令的整理，再发送指令。

3 前端应用配置工具模块(管理员配置模块)的实现

应用配置包括应用管理功能和协议配置功能。应用管理功能中，超级管理员可以对应用进行管理，包括添加应用、删除应用和修改应用。下面的代码是添加新应用的部分代码段：

public function action_add()

{

// 查询所有公司

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

# SOAP应用目录

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

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

# SOAP应用接口

$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);

}

这里主要以应用配置中协议配置这部分为例来介绍，协议配置功能中，超级管理员可以添加和删除相关应用的有关协议，对协议进行配置和管理，本系统只支持XML格式的协议。如图4所示，当管理员要进行协议配置时，点击“协议配置”，就会出现管理员对协议进行管理的操作界面，包括添加、删除协议。当管理员要添加新的协议时，显示出如图4所示的操作界面。添加新协议的主要部分代码如下：

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 ('找不到应用参数');

Upload::$default_directory= Kohana::$cache_dir; //默认保存文件夹

$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 添加新协议的界面截图

4 结语

物联网信息技术将会随着互联网的快速发展而越来越成熟，用户对设备数据的需求也会越来越多，本文研究的应用前端配置工具基本实现了用户对不同数据视图信息的配置与管理功能。随着物联网信息技术的发展，应用前端作为物联网和用户的接口，更完美更成熟的前端配置工具一定能够给用户配置出良好的前端Web 界面，满足不同用户的前端需求。

[1]蓝 科,全锦琪,刘洪宇,等. 一种可配置的可视化流程的设计[J].信息通信，2015,(7):64～65.

[2]孙卫琴,精通Struts：基于MVC 的JavaWeb 设计与开发[M]北京：电子工业出版社，2005.

[3]洪家平,周 炳,高美珍.基于单片机的触摸屏在电子艾灸仪中的应用研究[J].湖北师范学院学报(自然科学版)，2016,(2):13～17.

[4]雷聚超,缪 治．ActiveForm 构建B/S、C/S 的混合结构[J].计算机与数字工程，2011,(1):6～9.

[5]吴 鹏.MVC 模式与Struts 架构的研究[J].软件导刊，2010,(8):41～44.

[6]高美珍,洪家平. 基于蓝牙的防丢失报警器的设计与实现[J].湖北师范学院学报(自然科学版)，2016,(1):16～19.

[7]樊 琦,余卫东,陈文辉,等. ACME2.0采集前端软件升级改进研究[J].测井技术，2014,(2):211～215.

[8]王凤玲.基于PHP+MYSQL 的新闻发布系统的研究与实现[J].计算机应用与软件，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— ) ，男，湖北武汉人，硕士研究生，主要研究方向为信息与智能计算.

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

TP635

B

2096-3149(2017)02- 0033-05

10.3969/j.issn.2096-3149.2017.02.008