基于HBuilder快速開發移動端APP的設計與實現

許溜溜

摘要：隨著智能手機的普及，現代人們在生活中越來越依賴于智能手機，其中APP（即應用軟件）上架渠道的開放更是吸引無數廠商瘋狂開發自已的APP軟件，致使較多的程序員轉行學習如何開發APP軟件，學習流行的iOS與Andriod平臺就要學習兩套不同的開發環境、編譯打包等知識。HBuilder的出現，完美解決了開發中涉及的跨平臺，uni-app便是其中的開發框架，僅編寫一套代碼，即可覆蓋八個不同平臺。

關鍵詞：APP快速開發;uni-app;HBuilder;跨平臺開發

中圖分類號：TP311.52 文獻標識碼：A

文章編號：1009-3044（2020）10-0074-02

1背景

近年來，隨著智能手機的普及，手機系統的接口開放，越來越多的軟件APP出現在智能手機上，但APP的開發與應用卻異常復雜，就連開發環境的安裝讓很多技術人員卻步。HBuilder的出現，它所提供的開發工具有效地解決了入門難、開發難。本文利用HBuilder開發《中高職學生請假系統APP》為案例，介紹HBuilder的基本使用。

2現狀分析

目前較多中高職學校的學生請假管理系統采用傳統紙質或簡單電子請假系統審批，從學生請假上報，到最后請假條歸位到學生所在班級班干部統一管理，以便課堂教師查驗。這種傳統請假模式只適合規模較小的學校，現如今各地中高職學校擴招、建新校，如此請假模式已逐漸顯露弊端，也有部分中高職已開發了B/S模式的請假系統，但請假消息推送不主動，不能實時提醒教師審批，造成請假延時，信息閉塞等問題。

3系統功能設計

面對上述問題。本文擬設計一款基于HBuilder開發的手機端《中高職學生請假系統APP》，支持iOS、Android跨系統平臺，實時消息推送，操作簡單助能完善。

3.1DCloud的HBuilder介紹

DCloud，國內HTML5產業的領軍企業。該公司推出的IDE工具——HBulider，主推開發一次，同時生成APP、H5、小程序的亮點，吸引幾百萬的開發者用戶。

3.2uni-app介紹

uni-app是基于Vue.is框架所開發的跨平臺應用前端。

3.3系統框架及功能

本系統以Vue.is為前端框架，PHP語言開發后端，MySQL建立系統數據庫，具體結構如圖1所示。

4系統實現思路與關鍵技術研究

基于以上對系統框架的設計，系統的實現分為服務端和數據庫端及手機端三部分。手機端采用HBuilder開發。系統實現的關鍵技術包括以下幾點。

4.1服務端與手機端通信過程

4.1.1用戶登錄與請求

4.2客戶端消息推送

4.2.1通知欄消息實時推送

UniPush推送服務定義好的推送樣式、后續動作的推送方式，客戶端接收到后顯示在系統通知欄，用戶點擊通知欄消息啟動APP。

4.2.2推送客戶端標識的獲取

在應用安裝后第一次運行時調用plus.push.getClientInfo方法獲取客戶端標識，并將此標識提交到開發者的業務服務器進行注冊設備，使用戶登錄時綁定手機設備，達到消息推送。示例代碼如下：

這里需要注意的是第三方的消息推送會被阻擋。最好的方式就是按照廠商的要求接人各個推送服務。慶幸的事情，這部分DCloud（數字天堂）已經幫你做好了，只需要注冊下各個廠商的開發平臺，將appid和$ecYet登錄DCloud（數字天堂）后臺即可。

4.3服務端接收與推送

5結束語

本文檔利用HBuilder開發工具講解了APP的設計與開發，APP整體運行正常，后續還需要跟進與升級同時也存在一起問題。比如i0S安裝包還需要通過iOS開發者對安裝包進行簽名與驗證，或者需要i0S開發者賬號將安裝包上架到APP store上才能供所有人使用。