基于代碼自動生成技術的小程序輔助開發系統設計與實現

彭淑燕, 劉思聰

(江蘇經貿職業技術學院 智能工程技術學院，江蘇 南京 210046)

0 引言

目前越來越多的行業都開始將小程序作為其主要的流量入口。小程序作為一種典型的輕應用，具有免安裝、快速觸達用戶、用完即走等特點。作為最早提出的一種小程序，微信小程序截止到2019年底，已經積累了約500萬個應用，累計使用人數已經超過了9億人次。隨著微信小程序的使用范圍越來越廣，越來越多的開發者加入到了小程序的設計與開發當中。但是由于微信小程序開發具有自身獨特的體系架構，使得很多開發者需要重新學習相關的開發規范與語法。這樣就導致很多開發者的開發成本上升，從而不利于小程序的推廣與應用。

鑒于此，本文提出利用Java模板引擎并結合類反射技術來進行微信小程序代碼的自動生成，從而可以大幅提高小程序的開發速度，縮短小程序的發布周期。首先通過分析小程序中的常用功能，來構建出若干功能類。然后利用模板引擎來加載相關的源碼模板文件，最后依據不同的界面設計需求，利用反射技術來將相應的功能類配置信息加載至引擎模板中[1]，并最終通過模板引擎來編譯生成具體的小程序源碼。

通過上述系統，可以快速地根據不同的業務需求來搭配不同的邏輯組件，進而來構建相應的微信小程序App。而且由于該系統定義了一系列的公共接口，第三方開發人員也可以根據相關的接口規范來進行二次開發[2]。

1 系統架構設計

本文所設計系統遵循MVC架構規范，對于系統的視圖、控制、實體對象都進行了分層設計[3]。具體來說，該系統可由以下幾個模塊組成。

1.1 UI交互模塊

該模塊的作用主要是為用戶提供一個可視化的圖形交互界面，實現用戶的交互操作以及對后端數據進行可視化渲染。該模塊作為本系統的圖形化交互窗口，一方面將后臺數據以直觀的方式呈現給用戶，一方面也會將用戶的操作指令及相關數據通過API數據接口傳遞至其它模塊。具體的API數據接口格式如表1所示。

表1 API數據接口結構

1.2 響應控制模塊

該模塊的作用是對用戶的操作進行響應。該模塊可以調用模板引擎模塊，通過類反射技術來生成相應的小程序代碼。該模塊主要接收UI交互界面所傳遞的用戶數據。在獲取到用戶數據后，該模塊首先需要對數據進行格式解析。首先需要從接口數據的Data字段中獲得用戶數據。需要注意的是，由于本系統允許用戶傳遞空值數據(Null)，因此響應控制模塊需要先對用戶數據進行非空判定(Is_Null)。當確定上述數據不為空時，才對用戶數據進行格式解析。具體方法為首先對Data字段的值按@符進行分割，之后對獲取到的每一個鍵值再按冒號進行分割，之后將冒號右側的值作為最終的用戶數據，并進行處理。當用戶數據處理完畢后，如果沒有任何錯誤異常信息出現，則該模塊會對Status字段進行數據填充，具體值為200，同時對Msg字段賦值：“Success”。如果在上述過程中出現了異常錯誤信息，則終止整個響應流程，并為Status字段賦值為500，Msg字段賦值：“Fail”。其他情況，按照響應的代碼進行填充。如果該用戶操作不需要獲取后臺服務器數據，則Result字段不進行填充，直接按空值進行傳輸。否則，將相應的數據按照“Key1:Value1@Key2:Value2……”的形式進行填充。所有操作結束后，將上述API接口數據傳輸回UI交互模塊當中。UI交互模塊會自動解析上述API數據，并進行相應的界面渲染與響應。

1.3 對象操作模塊

該模塊主要對系統中的數據表進行對象關系映射(ORM)，從而將對數據庫的操作轉變為對系統實例對象的操作[4]。上述3個模塊之間存在著相互依賴關系。具體的系統架構設計如圖1所示。

圖1 系統架構設計圖

2 系統技術實現

2.1 UI交互模塊實現

本系統采用B/S結構，該架構模式具有系統平臺依賴度低、部署靈活、能夠實現系統功能熱更新等優點。在UI交互模塊中包含了所有的系統可視化頁面，上述頁面都是基于HTML，CSS以及VUE前端框架開發而成的。具體而言，在上述頁面當中，HTML確定了頁面的基本框架布局結構，利用DIV元素作為頁面布局的框架模塊，首先設置每個功能模塊的空間位置。之后通過設置不同DIV元素的空間定位屬性，來確定不同功能模塊之間的空間相對位置。在確定了模塊間的空間相對位置后，使用CSS樣式來對頁面整體結構進行外觀美化。當靜態頁面搭建完成后，再基于VUE框架的模板功能(Template)，將靜態頁面按功能模塊的不同劃分至不同的模板當中。當頁面對后臺數據進行渲染時，將上述功能模板按需進行組合，并最終與后臺數據一起構成完整的動態渲染頁面內容。具體過程如圖2所示。

圖2 UI交互模塊實現原理圖

2.2 響應控制模塊實現

響應控制模塊的實現主要基于Java語言的SpringBoot框架來實現。該模塊的作用主要是用來響應前端用戶請求，處理傳輸數據以及向前端頁面傳輸后臺數據。該模塊中每一類用戶請求都會被單獨抽象為一個獨立的Java類。每一類中都包含以下幾個基本操作響應函數：(1)add；(2)update；(3)delete；(4)find。除此以外，每個響應類中，還包含若干特殊函數，用來響應用戶的不同操作請求。每個用戶響應類中都會添加SpringBoot的用戶響應注解(RequestMapping)。通過該注解，可以將用戶的操作與響應類中的相關函數關聯起來，從而可以實現對用戶操作的響應[7]。

當前端頁面傳遞的數據被用戶響應類獲取后，會首先將上述數據保存至一個String類型的變量當中，之后利用split工具函數對Data字段中的數據按冒號進行解析，并將解析后的數據保存到一個臨時數組變量當中。如果獲取到的解析結果長度值小于2時，則判定當前用戶沒有向后臺響應函數傳遞數據。反之，則從臨時數組變量中獲取第2個位置上的數據，該數據即為用戶數據。獲得用戶數據后，繼續利用split函數來按“@”符進行格式解析。解析后得到數據均被保存于臨時數組變量當中，之后所有用戶數據均以冒號為特征符號進行二次解析，并將解析后的數據傳入響應的適配器類(Adaptive)中進行進一步的處理。如果用戶數據需要存儲至數據庫時，則響應的適配器類調用后臺對象操作模塊中的相關方法來進行數據庫操作。另一方面，如果用戶數據需要結合模板引擎(Volicity)來生成相關的小程序代碼時，響應控制模塊也會調用模板引擎的相關方法，在類反射器的幫助下，向代碼模板中填充相關的實例數據，并最終生成小程序代碼[8]。生成的相關代碼以壓縮包的形式向用戶提供。需要注意的是，當使用模板引擎進行代碼生成時，需要首先確保用戶傳遞的數據能夠被正確的實例化，要點是用戶數據必須含有完整路徑的Java類名，否則用戶數據無法完成實例化操作，最終會導致小程序代碼生成失敗。具體流程如圖3所示。

圖3 響應控制模塊工作流程圖

2.3 對象操作模塊實現

該模塊主要基于Spring Data JPA框架技術[5-6]來實現對象-關系映射(ORM)。在本系統中主要抽象出了12種代碼模板對象，并且支持用戶進行代碼模板的自定義操作。具體的代碼模板對象如表2所示。

表2 代碼模板列表

上述模板對象，均通過JPA框架存儲于系統數據庫中。可以按需進行模塊組合。

3 總結

小程序作為一種典型的輕應用，具有免安裝、快速觸達用戶、用完即走等特點，使其應用范圍越來越廣，越來越多的開發者加入到了小程序的設計與開發當中。但是由于小程序開發具有自身獨特的體系架構，而且目前各大公司均推出了自己的小程序平臺，使得很多開發者需要重新學習相關的開發規范與語法。這樣就導致很多開發者的開發成本上升，小程序應用的開發周期拉長，從而不利于小程序的推廣與應用。本研究所提出的基于Java模板引擎并結合類反射技術來進行小程序代碼的自動生成系統，可以大幅提高小程序的開發速度，縮短小程序的發布周期。經過一系列的實踐檢驗，發現該系統能夠穩定，高效地進行小程序的開發工作，達到了本研究的設計目的，性能穩定、高效。這也為以后的小程序開發提供了一種新的設計思路。