CN105867944A - Web前端数据操作层及其实现方法 - Google Patents

Web前端数据操作层及其实现方法 Download PDF

Info

Publication number
CN105867944A
CN105867944A CN201610248146.7A CN201610248146A CN105867944A CN 105867944 A CN105867944 A CN 105867944A CN 201610248146 A CN201610248146 A CN 201610248146A CN 105867944 A CN105867944 A CN 105867944A
Authority
CN
China
Prior art keywords
data
layer
json
configuration file
web front
Prior art date
Legal status (The legal status is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the status listed.)
Granted
Application number
CN201610248146.7A
Other languages
English (en)
Other versions
CN105867944B (zh
Inventor
周泽晨
邓必红
Current Assignee (The listed assignees may be inaccurate. Google has not performed a legal analysis and makes no representation or warranty as to the accuracy of the list.)
Yutong Bus Co Ltd
Original Assignee
Zhengzhou Yutong Bus Co Ltd
Priority date (The priority date is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the date listed.)
Filing date
Publication date
Application filed by Zhengzhou Yutong Bus Co Ltd filed Critical Zhengzhou Yutong Bus Co Ltd
Priority to CN201610248146.7A priority Critical patent/CN105867944B/zh
Publication of CN105867944A publication Critical patent/CN105867944A/zh
Application granted granted Critical
Publication of CN105867944B publication Critical patent/CN105867944B/zh
Active legal-status Critical Current
Anticipated expiration legal-status Critical

Links

Classifications

    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F8/00—Arrangements for software engineering
    • G06F8/20—Software design

Landscapes

  • Engineering & Computer Science (AREA)
  • Software Systems (AREA)
  • General Engineering & Computer Science (AREA)
  • Theoretical Computer Science (AREA)
  • Physics & Mathematics (AREA)
  • General Physics & Mathematics (AREA)
  • Management, Administration, Business Operations System, And Electronic Commerce (AREA)
  • Devices For Executing Special Programs (AREA)

Abstract

本发明涉及Web前端数据操作层及其实现方法，采用前端脚本加载器requirjs的json加载插件加载数据层配置文件DataAPIConfig.json，通过前端javascript MVVM框架angularjs的service封装数据层DataProvider，通过javascript的function apply实现AOP机制，注入到各数据访问方法，实现数据访问层被调用前以及调用后的统一业务逻辑处理。所述Web前端数据操作层方案通过json构造模拟数据，通过简单配置实现任意切换模拟数据、真实restful服务接口，符合promise规范，可在运行时动态修改模拟数据。

Description

Web前端数据操作层及其实现方法
技术领域
本发明涉及基于Web单页应用的数据操作层的实现方法。
背景技术
目前大多数的基于B/S(Browser/Server)的业务系统，均采用Server端生成动态业务数据，然后输出HTML到Browser端。数据层操作全部在Server端进行。这种方式的缺点在于，用户每做一次请求，都要重新刷新html页面，导致用户交互体验非常不好。因此，越来越多的业务系统采用了一种基于Ajax、Web Service的技术架构，Browser端统称为Web前端，通过javascript、ajax调用Server端提供的WebService接口，获取数据，提交数据。因此，Web前端与Server端的通讯转化为通过WebService接口形式，从而使数据层操作前移到了Web前端。在这种情况下，Web前端的开发工作从Server端独立出来。在开发过程中，经常会出现Server端接口未开发完成，Web前端无法继续进行的情况。
发明内容
本发明的目的是提供一套Web前端数据操作层实现方法，用以解决目前Web前端过于依赖Server端，导致开发效率不高的问题。
为实现上述目的，本发明的方案包括：
一种Web前端数据操作层的实现方法，步骤如下：
1)前端脚本加载器requirjs加载数据层配置文件；
2)通过前端javascript MVVM框架angularjs的service封装数据层DataProvider，通过javascript的function apply实现AOP机制，注入到各数据访问方法，实现数据访问层被调用前以及调用后的统一业务逻辑处理。
采用前端脚本加载器requirejs的json插件加载数据层配置文件 DataAPIConfig.json。
所述数据层配置文件DataAPIConfig.json的格式的定义包括：是否采用模拟数据，业务数据方法调用的后台WebService及其相关参数，以及业务数据方法对应的模拟数据。
所述数据层配置文件DataAPIConfig.json通过调用方法参数占位符，实现带有业务逻辑的模拟数据。
所述数据层配置文件DataAPIConfig.json配置是否缓存，如果是模拟数据，则在运行时动态修改模拟数据，实现业务逻辑的状态变化模拟。
一种Web前端数据操作层，包括：
1)前端脚本加载器requirjs加载数据层配置文件的模块；
2)通过前端javascript MVVM框架angularjs的service封装数据层DataProvider，通过javascript的function apply实现AOP机制，注入到各数据访问方法，实现数据访问层被调用前以及调用后的统一业务逻辑处理的模块。
采用前端脚本加载器requirejs的json插件加载数据层配置文件DataAPIConfig.json。
所述数据层配置文件DataAPIConfig.json的格式的定义包括：是否采用模拟数据，业务数据方法调用的后台WebService及其相关参数，以及业务数据方法对应的模拟数据。
所述数据层配置文件DataAPIConfig.json通过调用方法参数占位符，实现带有业务逻辑的模拟数据。
所述数据层配置文件DataAPIConfig.json，配置是否缓存，如果是模拟数据，则在运行时动态修改模拟数据，实现业务逻辑的状态变化模拟。
本发明为了解决目前Web前端过于依赖Server端，导致开发效率不高的问题，提出了一种Web前端数据操作层方案，旨在改善Web前端开发现状，提高开发效率。同时，也提出了一种对Server端WebService服务调用的统一封装管理。当Server端接口未开发完成的时候，Web前端可以通过本发明提供的方案，通过配置文件配置为模拟数据，并且在Web前端建立模拟数据json文件，从而实现对Server端的完整模拟。
而且本发明还可以通过动态修改模拟文件的数据，实现更加复杂的业务逻辑场景模拟。以及通过本使用信息提供的方案，完成不同调用参数对不同模拟数据文件的获取，进一步实现更加复杂的业务逻辑场景模拟。
附图说明
图1是Web前端数据操作层的结构原理图。
具体实施方式
下面结合附图对本发明做进一步详细的说明。
如图1所示的Web前端数据操作层的结构原理图，车辆运营管理系统包括DataProvider、DataAPIConfig.json、Simulate Data Json Files。这种车辆运营管理系统可以用于通勤车、公交车等领域。
采用前端脚本加载器requirjs的json加载插件加载数据层配置文件DataAPIConfig.json，通过前端javascript MVVM框架angularjs的service封装数据层DataProvider，通过javascript的function apply实现AOP机制，注入到各数据访问方法，实现数据访问层被调用前以及调用后的统一业务逻辑处理。所述Web前端数据操作层方案通过json构造模拟数据，通过简单配置实现任意切换模拟数据、真实restful服务接口，符合promise规范，可在运行时动态修改模拟数据。
其中，DataProvider主要是数据操作层的宿主代码，实现对DataAPIConfig.json配置文件的读取，生成数据操作调用方法，供UI层调用，通过promise规范与UI层通信。
DataAPIConfig.json主要是数据操作层的配置参数，包括数据操作层的公共配置、 Server端各WebService接口的配置。
Simulate Data Json Files主要是对Servre端各WebService接口的一对一模拟，通过json文件形式存放，通过模块加载器requirejs的json插件加载。
具体工作过程为：
(1)配置文件加载流程：Web前端页面在浏览器中加载，触发DataProvider的初始化。该初始化读取DataAPIConfig.json配置信息，完成相关配置信息的初始化工作。
(2)数据层调用方法生成流程：当配置文件加载完成后，DataProvider根据配置文件的配置，动态生成javascript调用方法，并且通过javascript apply机制，注入统一处理方法，实现对调用前的参数处理，数据返回后的数据错误码统一处理。
(3)UI调用流程：UI层根据实际需求，调用DataProvider生成的数据层调用方法。并且在开发过程中，可根据开发需求，随时更改DataAPIConfig.json，实现是否调用模拟数据的切换。如果切换到模拟数据方式，则需要先在Web前端建立SimulateDataJsonFi le。
以上给出了本发明涉及的具体实施方式，但本发明不局限于所描述的实施方式。在本发明给出的思路下，采用对本领域技术人员而言容易想到的方式对上述实施例中的技术手段进行变换、替换、修改，并且起到的作用与本发明中的相应技术手段基本相同、实现的发明目的也基本相同，这样形成的技术方案是对上述实施例进行微调形成的，这种技术方案仍落入本发明的保护范围内。

Claims (10)

1.一种Web前端数据操作层的实现方法，其特征在于，步骤如下：
1)前端脚本加载器requirjs加载数据层配置文件；
2)通过前端javascript MVVM框架angularjs的service封装数据层DataProvider，通过javascript的function apply实现AOP机制，注入到各数据访问方法，实现数据访问层被调用前以及调用后的统一业务逻辑处理。
2.根据权利要求1所述的Web前端数据操作层的实现方法，其特征在于，采用前端脚本加载器requirejs的json插件加载数据层配置文件DataAPIConfig.json。
3.根据权利要求2所述的Web前端数据操作层的实现方法，其特征在于，所述数据层配置文件DataAPIConfig.json的格式的定义包括：是否采用模拟数据，业务数据方法调用的后台WebService及其相关参数，以及业务数据方法对应的模拟数据。
4.根据权利要求2所述的Web前端数据操作层的实现方法，其特征在于，所述数据层配置文件DataAPIConfig.json通过调用方法参数占位符，实现带有业务逻辑的模拟数据。
5.根据权利要求2所述的Web前端数据操作层的实现方法，其特征在于，所述数据层配置文件DataAPIConfig.json配置是否缓存，如果是模拟数据，则在运行时动态修改模拟数据，实现业务逻辑的状态变化模拟。
6.一种Web前端数据操作层，其特征在于，包括：
1)前端脚本加载器requirjs加载数据层配置文件的模块；
2)通过前端javascript MVVM框架angularjs的service封装数据层DataProvider，通过javascript的function apply实现AOP机制，注入到各数据访问方法，实现数据访问层被调用前以及调用后的统一业务逻辑处理的模块。
7.根据权利要求6所述的Web前端数据操作层，其特征在于，采用前端脚本加载器requirejs的json插件加载数据层配置文件DataAPIConfig.json。
8.根据权利要求7所述的Web前端数据操作层，其特征在于，所述数据层配置文件DataAPIConfig.json的格式的定义包括：是否采用模拟数据，业务数据方法调用的后台WebService及其相关参数，以及业务数据方法对应的模拟数据。
9.根据权利要求7所述的Web前端数据操作层，其特征在于，所述数据层配置文件DataAPIConfig.json通过调用方法参数占位符，实现带有业务逻辑的模拟数据。
10.根据权利要求7所述的Web前端数据操作层，其特征在于，所述数据层配置文件DataAPIConfig.json，配置是否缓存，如果是模拟数据，则在运行时动态修改模拟数据，实现业务逻辑的状态变化模拟。
CN201610248146.7A 2016-04-19 2016-04-19 Web前端数据操作层及其实现方法 Active CN105867944B (zh)

Priority Applications (1)

Application Number Priority Date Filing Date Title
CN201610248146.7A CN105867944B (zh) 2016-04-19 2016-04-19 Web前端数据操作层及其实现方法

Applications Claiming Priority (1)

Application Number Priority Date Filing Date Title
CN201610248146.7A CN105867944B (zh) 2016-04-19 2016-04-19 Web前端数据操作层及其实现方法

Publications (2)

Publication Number Publication Date
CN105867944A true CN105867944A (zh) 2016-08-17
CN105867944B CN105867944B (zh) 2019-10-22

Family

ID=56633310

Family Applications (1)

Application Number Title Priority Date Filing Date
CN201610248146.7A Active CN105867944B (zh) 2016-04-19 2016-04-19 Web前端数据操作层及其实现方法

Country Status (1)

Country Link
CN (1) CN105867944B (zh)

Cited By (6)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN106598575A (zh) * 2016-11-30 2017-04-26 武汉斗鱼网络科技有限公司 一种前端数据模拟的实现方法及系统
CN108965451A (zh) * 2018-07-31 2018-12-07 南京中铁信息工程有限公司 一种警务云计算平台统一运维运营平台系统
CN109448427A (zh) * 2018-11-09 2019-03-08 易的物联科技无锡有限公司 一种面向各类停车场的智慧停车管理的系统
CN111597110A (zh) * 2020-04-27 2020-08-28 五八有限公司 页面测试方法、装置、电子设备及存储介质
CN112612460A (zh) * 2020-12-28 2021-04-06 北京锐安科技有限公司 接口的封装和调用方法、电子设备、及存储介质
CN113157333A (zh) * 2021-03-25 2021-07-23 中国电子科技集团公司第二十九研究所 一种新型态势标绘插件前端集成架构

Citations (3)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN104199725A (zh) * 2014-09-27 2014-12-10 上海瀚之友信息技术服务有限公司 一种服务接口数据模拟方法和系统
CN105138448A (zh) * 2014-06-05 2015-12-09 北京畅游天下网络技术有限公司 一种在前端测试页面的方法和装置
US20160094497A1 (en) * 2014-09-26 2016-03-31 Oracle International Corporation Building message relationships for offline operation of an enterprise application

Patent Citations (3)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN105138448A (zh) * 2014-06-05 2015-12-09 北京畅游天下网络技术有限公司 一种在前端测试页面的方法和装置
US20160094497A1 (en) * 2014-09-26 2016-03-31 Oracle International Corporation Building message relationships for offline operation of an enterprise application
CN104199725A (zh) * 2014-09-27 2014-12-10 上海瀚之友信息技术服务有限公司 一种服务接口数据模拟方法和系统

Non-Patent Citations (1)

* Cited by examiner, † Cited by third party
Title
PUSRI: "Angular-mock之使用$httpBackend服务测试$http", 《HTTPS://SEGMENTFAULT.COM/A/1190000003716613》 *

Cited By (8)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN106598575A (zh) * 2016-11-30 2017-04-26 武汉斗鱼网络科技有限公司 一种前端数据模拟的实现方法及系统
CN108965451A (zh) * 2018-07-31 2018-12-07 南京中铁信息工程有限公司 一种警务云计算平台统一运维运营平台系统
CN109448427A (zh) * 2018-11-09 2019-03-08 易的物联科技无锡有限公司 一种面向各类停车场的智慧停车管理的系统
CN111597110A (zh) * 2020-04-27 2020-08-28 五八有限公司 页面测试方法、装置、电子设备及存储介质
CN111597110B (zh) * 2020-04-27 2024-02-27 五八有限公司 页面测试方法、装置、电子设备及存储介质
CN112612460A (zh) * 2020-12-28 2021-04-06 北京锐安科技有限公司 接口的封装和调用方法、电子设备、及存储介质
CN113157333A (zh) * 2021-03-25 2021-07-23 中国电子科技集团公司第二十九研究所 一种新型态势标绘插件前端集成架构
CN113157333B (zh) * 2021-03-25 2022-09-02 中国电子科技集团公司第二十九研究所 一种态势标绘插件前端集成系统

Also Published As

Publication number Publication date
CN105867944B (zh) 2019-10-22

Similar Documents

Publication Publication Date Title
CN105867944A (zh) Web前端数据操作层及其实现方法
CN102591961B (zh) 一种制作数据图表的方法及系统
CN103809975B (zh) 智能云表单的实现方法
CN103092621B (zh) 一种图表生成的方法及装置
CN106293664A (zh) 代码生成方法及装置
CN107045438B (zh) 一种应用顶层视图处理方法、装置及组件
CN104965757A (zh) 虚拟机热迁移的方法、虚拟机迁移管理装置及系统
CN104572091B (zh) 应用软件实现方法、装置以及计算机设备
CN103179133B (zh) 基于实体类的客户端与服务器通信的方法
CN105446799A (zh) 一种计算机系统中进行规则管理的方法及系统
CN103150154B (zh) 一种应用程序插件的实现方法及装置
CN109032590B (zh) 一种可视化开发环境的配置方法、装置、终端及存储介质
CN105912339A (zh) 一种数控系统中应用的开发与集成方法及系统
CN101937335B (zh) 一种生成Widget图标的方法、Widget摘要文件的生成方法及Widget引擎
CN104133676A (zh) 一种基于脚本的功能执行方法和设备
CN112084446A (zh) 一种网页编辑方法、编辑器、电子设备和可读存储介质
CN107483412B (zh) 一种HTML5 web worker迁移方法及系统
CN107562428A (zh) 基于规则的自适应软件界面布局方法及系统
CN102541544B (zh) 树形控件的处理方法、装置及系统
CN107678863A (zh) 页面组件通讯方法及装置
CN106406884A (zh) 基于.net mvc模式web后台管理应用系统应用的基础开发框架
CN106293658A (zh) 一种界面组件生成方法及其设备
CN102141917A (zh) 基于IronPython脚本语言的多业务联动实现方法
CN103019819A (zh) 一种基于插件机制的动态库统一调度方法
CN103544154A (zh) 一种数据格式转换的方法

Legal Events

Date Code Title Description
C06 Publication
PB01 Publication
C10 Entry into substantive examination
SE01 Entry into force of request for substantive examination
GR01 Patent grant
GR01 Patent grant
CP03 Change of name, title or address
CP03 Change of name, title or address

Address after: 450061 Yudao Road, Guancheng District, Zhengzhou City, Henan Province

Patentee after: Yutong Bus Co., Ltd

Address before: 450016 Yutong Industrial Zone, eighteen Li River, Henan, Zhengzhou

Patentee before: Zhengzhou Yutong Bus Co., Ltd