Web前端數(shù)據(jù)操作層及其實(shí)現(xiàn)方法
【專利摘要】本發(fā)明涉及Web前端數(shù)據(jù)操作層及其實(shí)現(xiàn)方法,采用前端腳本加載器requirjs的json加載插件加載數(shù)據(jù)層配置文件DataAPIConfig.json,通過前端javascript MVVM框架angularjs的service封裝數(shù)據(jù)層DataProvider,通過javascript的function apply實(shí)現(xiàn)AOP機(jī)制,注入到各數(shù)據(jù)訪問方法,實(shí)現(xiàn)數(shù)據(jù)訪問層被調(diào)用前以及調(diào)用后的統(tǒng)一業(yè)務(wù)邏輯處理。所述Web前端數(shù)據(jù)操作層方案通過json構(gòu)造模擬數(shù)據(jù),通過簡(jiǎn)單配置實(shí)現(xiàn)任意切換模擬數(shù)據(jù)、真實(shí)restful服務(wù)接口,符合promise規(guī)范,可在運(yùn)行時(shí)動(dòng)態(tài)修改模擬數(shù)據(jù)。
【專利說明】
Web前端數(shù)據(jù)操作層及其實(shí)現(xiàn)方法
技術(shù)領(lǐng)域
[0001]本發(fā)明涉及基于Web單頁應(yīng)用的數(shù)據(jù)操作層的實(shí)現(xiàn)方法。
【背景技術(shù)】
[0002]目前大多數(shù)的基于B/S(Browser/Server)的業(yè)務(wù)系統(tǒng),均采用Server端生成動(dòng)態(tài)業(yè)務(wù)數(shù)據(jù),然后輸出HTML到Browser端。數(shù)據(jù)層操作全部在Server端進(jìn)行。這種方式的缺點(diǎn)在于,用戶每做一次請(qǐng)求,都要重新刷新html頁面,導(dǎo)致用戶交互體驗(yàn)非常不好。因此,越來越多的業(yè)務(wù)系統(tǒng)采用了一種基于Ajax、Web Service的技術(shù)架構(gòu),Browser端統(tǒng)稱為Web前端,通過javascript、ajax調(diào)用Server端提供的WebService接口,獲取數(shù)據(jù),提交數(shù)據(jù)。因此,Web前端與Server端的通訊轉(zhuǎn)化為通過WebService接口形式,從而使數(shù)據(jù)層操作前移到了Web前端。在這種情況下,Web前端的開發(fā)工作從Server端獨(dú)立出來。在開發(fā)過程中,經(jīng)常會(huì)出現(xiàn)Server端接口未開發(fā)完成,Web前端無法繼續(xù)進(jìn)行的情況。
【發(fā)明內(nèi)容】
[0003]本發(fā)明的目的是提供一套Web前端數(shù)據(jù)操作層實(shí)現(xiàn)方法,用以解決目前Web前端過于依賴Server端,導(dǎo)致開發(fā)效率不高的問題。
[0004]為實(shí)現(xiàn)上述目的,本發(fā)明的方案包括:
[0005]—種Web前端數(shù)據(jù)操作層的實(shí)現(xiàn)方法,步驟如下:
[0006]I)前端腳本加載器requir js加載數(shù)據(jù)層配置文件;
[0007]2 )通過前端 javascript MVVM 框架 an gu I ar j s 的 s e r v i c e 封裝數(shù)據(jù)層DataProvider,通過javascript的funct1n apply實(shí)現(xiàn)AOP機(jī)制,注入到各數(shù)據(jù)訪問方法,實(shí)現(xiàn)數(shù)據(jù)訪問層被調(diào)用前以及調(diào)用后的統(tǒng)一業(yè)務(wù)邏輯處理。
[0008]采用前端腳本加載器re q u i r e j s的j s ο η插件加載數(shù)據(jù)層配置文件DataAPIConfig.json0
[0009]所述數(shù)據(jù)層配置文件DataAPIConfig.json的格式的定義包括:是否采用模擬數(shù)據(jù),業(yè)務(wù)數(shù)據(jù)方法調(diào)用的后臺(tái)WebService及其相關(guān)參數(shù),以及業(yè)務(wù)數(shù)據(jù)方法對(duì)應(yīng)的模擬數(shù)據(jù)。
[0010]所述數(shù)據(jù)層配置文件DataAPIConfig.json通過調(diào)用方法參數(shù)占位符,實(shí)現(xiàn)帶有業(yè)務(wù)邏輯的模擬數(shù)據(jù)。
[0011 ]所述數(shù)據(jù)層配置文件DataAPIConf ig.json配置是否緩存,如果是模擬數(shù)據(jù),則在運(yùn)行時(shí)動(dòng)態(tài)修改模擬數(shù)據(jù),實(shí)現(xiàn)業(yè)務(wù)邏輯的狀態(tài)變化模擬。
[0012]一種Web前端數(shù)據(jù)操作層,包括:
[0013]I)前端腳本加載器requirjs加載數(shù)據(jù)層配置文件的模塊;
[0014]2 )通過前端 javascript MVVM 框架 an gu I ar j s 的 s e r v i c e 封裝數(shù)據(jù)層DataProvider,通過javascript的funct1n apply實(shí)現(xiàn)AOP機(jī)制,注入到各數(shù)據(jù)訪問方法,實(shí)現(xiàn)數(shù)據(jù)訪問層被調(diào)用前以及調(diào)用后的統(tǒng)一業(yè)務(wù)邏輯處理的模塊。
[0015]采用前端腳本加載器r e q u i r e j s的j s ο η插件加載數(shù)據(jù)層配置文件DataAPIConfig.json0
[ΟΟ??]所述數(shù)據(jù)層配置文件DataAPIConf ig.json的格式的定義包括:是否采用模擬數(shù)據(jù),業(yè)務(wù)數(shù)據(jù)方法調(diào)用的后臺(tái)WebService及其相關(guān)參數(shù),以及業(yè)務(wù)數(shù)據(jù)方法對(duì)應(yīng)的模擬數(shù)據(jù)。
[0017]所述數(shù)據(jù)層配置文件DataAPIConfig.json通過調(diào)用方法參數(shù)占位符,實(shí)現(xiàn)帶有業(yè)務(wù)邏輯的模擬數(shù)據(jù)。
[0018]所述數(shù)據(jù)層配置文件DataAPIConfig.json,配置是否緩存,如果是模擬數(shù)據(jù),則在運(yùn)行時(shí)動(dòng)態(tài)修改模擬數(shù)據(jù),實(shí)現(xiàn)業(yè)務(wù)邏輯的狀態(tài)變化模擬。
[0019]本發(fā)明為了解決目前Web前端過于依賴Server端,導(dǎo)致開發(fā)效率不高的問題,提出了一種Web前端數(shù)據(jù)操作層方案,旨在改善Web前端開發(fā)現(xiàn)狀,提高開發(fā)效率。同時(shí),也提出了一種對(duì)Server端WebService服務(wù)調(diào)用的統(tǒng)一封裝管理。當(dāng)Server端接口未開發(fā)完成的時(shí)候,Web前端可以通過本發(fā)明提供的方案,通過配置文件配置為模擬數(shù)據(jù),并且在Web前端建立模擬數(shù)據(jù)json文件,從而實(shí)現(xiàn)對(duì)Server端的完整模擬。
[0020]而且本發(fā)明還可以通過動(dòng)態(tài)修改模擬文件的數(shù)據(jù),實(shí)現(xiàn)更加復(fù)雜的業(yè)務(wù)邏輯場(chǎng)景模擬。以及通過本使用信息提供的方案,完成不同調(diào)用參數(shù)對(duì)不同模擬數(shù)據(jù)文件的獲取,進(jìn)一步實(shí)現(xiàn)更加復(fù)雜的業(yè)務(wù)邏輯場(chǎng)景模擬。
【附圖說明】
[0021 ]圖1是Web前端數(shù)據(jù)操作層的結(jié)構(gòu)原理圖。
【具體實(shí)施方式】
[0022]下面結(jié)合附圖對(duì)本發(fā)明做進(jìn)一步詳細(xì)的說明。
[0023]如圖1所示的Web前端數(shù)據(jù)操作層的結(jié)構(gòu)原理圖,車輛運(yùn)營(yíng)管理系統(tǒng)包括DataProvider、DataAPIConf ig.json、Simulate Data Json Files。這種車輛運(yùn)營(yíng)管理系統(tǒng)可以用于通勤車、公交車等領(lǐng)域。
[0024]采用前端腳本加載器re q u i r j s的j s ο η加載插件加載數(shù)據(jù)層配置文件DataAPIConfig.json,通過前端 javascript MVVM 框架 angular js的 service封裝數(shù)據(jù)層DataProvider,通過javascript的funct1n apply實(shí)現(xiàn)AOP機(jī)制,注入到各數(shù)據(jù)訪問方法,實(shí)現(xiàn)數(shù)據(jù)訪問層被調(diào)用前以及調(diào)用后的統(tǒng)一業(yè)務(wù)邏輯處理。所述Web前端數(shù)據(jù)操作層方案通過json構(gòu)造模擬數(shù)據(jù),通過簡(jiǎn)單配置實(shí)現(xiàn)任意切換模擬數(shù)據(jù)、真實(shí)restful服務(wù)接口,符合promise規(guī)范,可在運(yùn)行時(shí)動(dòng)態(tài)修改模擬數(shù)據(jù)。
[0025]其中,DataProvider主要是數(shù)據(jù)操作層的宿主代碼,實(shí)現(xiàn)對(duì)DataAPIConf ig.json配置文件的讀取,生成數(shù)據(jù)操作調(diào)用方法,供UI層調(diào)用,通過promise規(guī)范與UI層通信。
[0026]DataAPIConfig.json主要是數(shù)據(jù)操作層的配置參數(shù),包括數(shù)據(jù)操作層的公共配置、Server端各WebService接口的配置。
[0027]Simulate Data Json Files主要是對(duì)Servre端各WebService接口的一對(duì)一模擬,通過json文件形式存放,通過模塊加載器require js的json插件加載。
[0028]具體工作過程為:
[0029](I)配置文件加載流程:Web前端頁面在瀏覽器中加載,觸發(fā)DataProvider的初始化。該初始化讀取DataAPIConfig.json配置信息,完成相關(guān)配置信息的初始化工作。
[0030](2)數(shù)據(jù)層調(diào)用方法生成流程:當(dāng)配置文件加載完成后,DataProvider根據(jù)配置文件的配置,動(dòng)態(tài)生成javascript調(diào)用方法,并且通過javascript apply機(jī)制,注入統(tǒng)一處理方法,實(shí)現(xiàn)對(duì)調(diào)用前的參數(shù)處理,數(shù)據(jù)返回后的數(shù)據(jù)錯(cuò)誤碼統(tǒng)一處理。
[0031](3)UI調(diào)用流程:UI層根據(jù)實(shí)際需求,調(diào)用DataProvider生成的數(shù)據(jù)層調(diào)用方法。并且在開發(fā)過程中,可根據(jù)開發(fā)需求,隨時(shí)更改DataAPIConf ig.json,實(shí)現(xiàn)是否調(diào)用模擬數(shù)據(jù)的切換。如果切換到模擬數(shù)據(jù)方式,則需要先在Web前端建立SimulateDataJsonFi Ie0
[0032]以上給出了本發(fā)明涉及的【具體實(shí)施方式】,但本發(fā)明不局限于所描述的實(shí)施方式。在本發(fā)明給出的思路下,采用對(duì)本領(lǐng)域技術(shù)人員而言容易想到的方式對(duì)上述實(shí)施例中的技術(shù)手段進(jìn)行變換、替換、修改,并且起到的作用與本發(fā)明中的相應(yīng)技術(shù)手段基本相同、實(shí)現(xiàn)的發(fā)明目的也基本相同,這樣形成的技術(shù)方案是對(duì)上述實(shí)施例進(jìn)行微調(diào)形成的,這種技術(shù)方案仍落入本發(fā)明的保護(hù)范圍內(nèi)。
【主權(quán)項(xiàng)】
1.一種Web前端數(shù)據(jù)操作層的實(shí)現(xiàn)方法,其特征在于,步驟如下: 1)前端腳本加載器requirjs加載數(shù)據(jù)層配置文件; 2)通過前端javascriptMVVM框架angularjs的service封裝數(shù)據(jù)層DataProvider,通過javascript的funct1n apply實(shí)現(xiàn)AOP機(jī)制,注入到各數(shù)據(jù)訪問方法,實(shí)現(xiàn)數(shù)據(jù)訪問層被調(diào)用前以及調(diào)用后的統(tǒng)一業(yè)務(wù)邏輯處理。2.根據(jù)權(quán)利要求1所述的Web前端數(shù)據(jù)操作層的實(shí)現(xiàn)方法,其特征在于,采用前端腳本加載器require js的json插件加載數(shù)據(jù)層配置文件DataAPIConfig.json ο3.根據(jù)權(quán)利要求2所述的Web前端數(shù)據(jù)操作層的實(shí)現(xiàn)方法,其特征在于,所述數(shù)據(jù)層配置文件DataAPIConfig.json的格式的定義包括:是否采用模擬數(shù)據(jù),業(yè)務(wù)數(shù)據(jù)方法調(diào)用的后臺(tái)WebService及其相關(guān)參數(shù),以及業(yè)務(wù)數(shù)據(jù)方法對(duì)應(yīng)的模擬數(shù)據(jù)。4.根據(jù)權(quán)利要求2所述的Web前端數(shù)據(jù)操作層的實(shí)現(xiàn)方法,其特征在于,所述數(shù)據(jù)層配置文件DataAPIConfig.json通過調(diào)用方法參數(shù)占位符,實(shí)現(xiàn)帶有業(yè)務(wù)邏輯的模擬數(shù)據(jù)。5.根據(jù)權(quán)利要求2所述的Web前端數(shù)據(jù)操作層的實(shí)現(xiàn)方法,其特征在于,所述數(shù)據(jù)層配置文件DataAPIConfig.json配置是否緩存,如果是模擬數(shù)據(jù),則在運(yùn)行時(shí)動(dòng)態(tài)修改模擬數(shù)據(jù),實(shí)現(xiàn)業(yè)務(wù)邏輯的狀態(tài)變化模擬。6.一種Web前端數(shù)據(jù)操作層,其特征在于,包括: 1)前端腳本加載器requirjs加載數(shù)據(jù)層配置文件的模塊; 2)通過前端javascript MVVM 框架 angular js的 service 封裝數(shù)據(jù)層 DataPro vider,通過javascript的funct1n apply實(shí)現(xiàn)AOP機(jī)制,注入到各數(shù)據(jù)訪問方法,實(shí)現(xiàn)數(shù)據(jù)訪問層被調(diào)用前以及調(diào)用后的統(tǒng)一業(yè)務(wù)邏輯處理的模塊。7.根據(jù)權(quán)利要求6所述的Web前端數(shù)據(jù)操作層,其特征在于,采用前端腳本加載器require js的json插件加載數(shù)據(jù)層配置文件DataAPIConfig.json。8.根據(jù)權(quán)利要求7所述的Web前端數(shù)據(jù)操作層,其特征在于,所述數(shù)據(jù)層配置文件DataAPIConfig.json的格式的定義包括:是否采用模擬數(shù)據(jù),業(yè)務(wù)數(shù)據(jù)方法調(diào)用的后臺(tái)WebService及其相關(guān)參數(shù),以及業(yè)務(wù)數(shù)據(jù)方法對(duì)應(yīng)的模擬數(shù)據(jù)。9.根據(jù)權(quán)利要求7所述的Web前端數(shù)據(jù)操作層,其特征在于,所述數(shù)據(jù)層配置文件DataAPIConfig.json通過調(diào)用方法參數(shù)占位符,實(shí)現(xiàn)帶有業(yè)務(wù)邏輯的模擬數(shù)據(jù)。10.根據(jù)權(quán)利要求7所述的Web前端數(shù)據(jù)操作層,其特征在于,所述數(shù)據(jù)層配置文件DataAPIConfig.json,配置是否緩存,如果是模擬數(shù)據(jù),則在運(yùn)行時(shí)動(dòng)態(tài)修改模擬數(shù)據(jù),實(shí)現(xiàn)業(yè)務(wù)邏輯的狀態(tài)變化模擬。
【文檔編號(hào)】G06F9/44GK105867944SQ201610248146
【公開日】2016年8月17日
【申請(qǐng)日】2016年4月19日
【發(fā)明人】周澤晨, 鄧必紅
【申請(qǐng)人】鄭州宇通客車股份有限公司