基于Node.js技术的报表信息管理平台设计与实现
2019-02-12 08:24刘娴，刘泽骁，荀丽丹
无线互联科技 2019年24期
刘娴，刘泽骁，荀丽丹
摘 要：文章利用Node.js框架進行报表信息管理平台的开发，实现对不同类型报表信息的填写、查询、导出等操作。系统前端采用Vue-cli构建前端工程项目，Element组件设计页面;后端采用Java语言，数据库采用MySQL数据库。利用其高效、实时响应的特点，提高办公效率。
关键词：Node.js;vue;报表管理
1 报表信息管理平台简介
信息技术的发展是为了改变人们的工作与生活，使生活变得更快捷，本文提出的报表信息管理平台，是为了方便教师对不同类型的报表信息进行填写、查询、导出，为日常工作带来便利。
目前，Web前端技术正处于高峰发展时期，系统开发更注重用户的体验，因此，本系统采用了Node.js技术。Node.js作为近年来Web前端技术发展的重要框架，通过本项目的研究，开发人员从理论上对该框架的运行机制与原理能有一个深入的了解;将该技术在教科研成果报表信息平台上加以应用，有助于掌握Express框架的应用，利用其高效、实时响应的特点提高办公效率[1]。
2 系统总体设计
前端主流框vue，Node.js作为中间层负责数据的处理和模板的控制，后端编程语言Java。采用前后端分离的架构模式，前端负责展现和交互逻辑，Node.js作为中间层负责数据的处理和模板的控制，后端负责业务逻辑[2]。
系统的主要用户包括普通用户、系部管理员、超级管理员3个模块，主要功能包括报表信息的管理、用户信息的管理、数据信息的导入导出。
系统的数据库设计主要实体包括用户、部门、权限、科研报表、技能报表5个。考虑到科研和技能的差异性，需要设计两张表来进行数据存储。数据库设计ER架构如图1所示。
3 系统设计实现
3.1 系统整体架构
系统前端采用Vue-cli构建前端工程项目，Element组件设计页面;后端采用Java语言，数据库采用MySQL数据库;系统采用MVVM架构模式，在双向数据绑定中View和Model不再需要手动的绑定输入监听和手动的将数据展示在View上，提高了View和Model之间转换的开发效率。
系统部署在内网服务器中，内网服务器需安装MySQL组件、Tomcat服务器，将前后端代码打包放入Tomcat服务器中，启动Tomcat服务后可以访问系统。
3.2 数据库的实现
在MySQL命令界面中，输入数据表的相关SQL语句即可创建，以用户信息表为例的创建语句核心代码如下：
CREATE TABLE `userinfo` （
`id` int（11） NOT NULL AUTO_INCREMENT，
`workNum` varchar（20） NOT NULL，
`uName` varchar（10） NOT NULL，
`uPassword` varchar（20） NOT NULL，
`departmentId` int（11） NOT NULL，
`roleId` varchar（11） NOT NULL，
PRIMARY KEY （`id`），
UNIQUE KEY `workNum_Un` （`workNum`），
KEY `department_fk` （`departmentId`），
KEY `role_fk` （`roleId`），
CONSTRAINT `department_fk` FOREIGN KEY （`departmentId`） REFERENCES `department` （`id`）
） ENGINE=InnoDB AUTO_INCREMENT=62 DEFAULT CHARSET=utf8;
3.3 后端API接口的实现
创建类实现Servlet接口，实现service方法在web.xml进行servlet的配置。用户登录接口配置的代码如下：
3.4 前端获取API接口
在Vue项目中使用axios库来调用API接口，它是基于promise的http库，可运行在浏览器端和Node.js中。在接口中数据以JSON的格式进行传输，获取用户是否成功登录的代码如下：
let params = {
workNum： this.user.workNum，
upassword： this.user.upassword，
};
this.$axios.post（‘/api/LoginServlet，params）
.then（（res） => {
if（res.data.code === 0）{
sessionStorage.setItem（‘accessToken ， this.user.workNum）;
this.$message（{
message： ‘登錄成功！，
type： ‘success
}）;
setTimeout（（） => {
this.$router.push（{path： ‘/index}）;
}， 500）;
}else{
this.$message.error（“账号或密码错误”）;
}
}）.catch（（res） => {
this.message.error（“服务器请求错误”）
}）
4 结语
选择Node.js作为本系统的开发框架，考虑其自带HTTP模块，使用Node.js可以很容易地实现HTTP服务器。同时Node.js还提供了文件操作等系统级API，可以用来开发本地应用。结合这两点（服务器+本地应用）可以实现基于Node.js的带本地中间层的B/S结构，能够更快速、更便捷地架构一个简洁、精美、易操作且高效的系统。
作者简介：刘娴（1983— ），女，江苏南京人，讲师，学士;研究方向：软件技术。
图1 数据库设计ER架构
[参考文献]
[1]吴春玲，刘广伟，程淑伟.基于Node.js的河道排污监测管理平台的设计与实现[J].工业控制计算机，2018（10）：121-122.
[2]朱晓阳，刘苑如，范仲言.基于Node.js的学习平台后端系统设计与实现[J].电脑知识与技术，2019（13）：116-118.
Design and implementation of report information management platform based on Node.js technology
Liu Xian， Liu Zexiao， Xun Lidan
（Nanjing Institute of Mechanical and Technology， Nanjing 210000， China）
Abstract：This paper uses the Node.js framework to develop the report information management platform， which can complete， query and export different types of report information. The system front-end uses Vue cli to build the front-end project， and the element component design page. The back end uses Java language， and the database uses MySQL database. Using the characteristics of Node.jss high efficiency and real-time response to improve office efficiency.
Key words：Node.js; vue; information management
