基于Node.js與微信小程序的活動管理平臺①

李正仁,周凱虎,王全貴,蘇 萌

1(中國地質大學(北京)能源學院,北京 100083)

2(中國地質大學(北京)地球物理與信息技術學院,北京 100083)

3(中國地質大學(北京)信息工程學院,北京 100083)

1 引言

運隨著時代的發(fā)展,大學生課余活動不斷豐富、多種多樣,活動種類主要包括：網(wǎng)絡活動、志愿活動、體育文化活動、學習交流活動、職業(yè)規(guī)劃與心理健康課外活動等[1].且目前大多數(shù)供大學生報名參與活動的預約方式主要為：通過問卷星系統(tǒng)制作調(diào)查問卷、指定手機App預約、公眾號跳轉網(wǎng)頁預約、人工預約等,存在功能受限、定制性差、面向對象單一、負責人工作量大等問題.

微信小程序作為一種不需要安裝即可使用的應用程序,方便簡潔.對用戶而言,微信小程序同微信相掛鉤,“掃一掃”即可打開應用,使用起來極為方便；對于開發(fā)者而言,開發(fā)及使用不受系統(tǒng)環(huán)境限制；此外,微信小程序亦可與公眾號完美嵌合,適合高校學生活動的組織、宣傳與預約,為同學們獲取信息參與及組織活動提供了極大的便利,可借助社團、學生組織快速推廣使用,可實現(xiàn)快速覆蓋在校學生,以幫助高校學生工作更好地開展,打造高校特色化活動管理系統(tǒng)[2].

2 系統(tǒng)研究依據(jù)

2.1 系統(tǒng)優(yōu)勢

微信小程序依附于微信國民級的聊天工具,具有“打開即用、用完即走、不用下載”的特點[3],以及微信10億用戶的天然優(yōu)勢,它的靈活性讓它可以基于場景聚合各種服務.微信小程序是一種全新的連接用戶與服務的方式,它可以在微信內(nèi)被便捷地獲取和傳播,同時具有出色的使用體驗[4,5].

2.2 改需求與可行性分析

與現(xiàn)有類似研究相比,已上線的具有預約功能的小程序與應用程序功能較為單一,頁面繁雜,用戶體驗與信息保密性差[6-10].結合高校需求,活動管理平臺功能需包括完整的用戶功能、活動功能與管理員功能的同時,結合高校學生活動特色與活動組織模式,設計并完善平臺功能,滿足以下功能需求：

(1)活動管理平臺需具有較高的安全性,保障用戶隱私的同時需滿足微信小程序接口請求的安全性要求,故通過郵箱驗證、前后端分離、HTTPS協(xié)議與RESTful API接口通信滿足安全性需要[11-14]；

(2)用戶端、活動組織方端、管理員端分離,有效避免權限越界、隱私泄露等問題,用戶端采用微信小程序框架開發(fā),管理員與活動組織方端采用Node.js+express+MongoDB框架開發(fā)；

(3)營造良好的用戶交互體驗,采用嵌入式JavaScript模板引擎EJS,借助Semantic-UI+jQurey插件進行頁面開發(fā),實現(xiàn)布局、樣式美觀且統(tǒng)一[15,16],采用視口viewport渲染方法實現(xiàn)各類設備頁面自適應；

(4)提供連續(xù)穩(wěn)定服務,部署云端服務器時采用PM2進程管理工具,永久保持應用程序活躍,無需停機即可重新加載程序,同時進行終端性能監(jiān)控、自動重啟、負載均衡以及服務器重啟自動部署等運維功能[17].

3 系統(tǒng)框架概述

3.1 微信小程序框架

微信小程序在技術構架上可分為視圖層、邏輯層、系統(tǒng)層3個部分(圖1),可使用微信云服務平臺提供的API進行核心業(yè)務開發(fā),實現(xiàn)快速上線和迭代,同時與開發(fā)者搭建的云服務相互兼容,互不排斥[5].微信小程序開發(fā)過程中另一關鍵技術為組件化開發(fā),使UI界面在設計風格上達到統(tǒng)一,降低了微信小程序的升級、維護難度,保證了用戶體驗質量[5].

圖1 微信小程序App service邏輯層示意圖

3.2 Node.js+express+MongoDB后端框架

Express是一個基于Node.js的服務端開發(fā)框架,擁有強大的路由、多模塊支持等特性[18].采用Promise函數(shù)作為抽象異步處理對象以及對其進行各種操作的組件,避免層層嵌套回調(diào),將復雜的異步處理輕松地進行模式化.MongoDB為分布式文件存儲的非關系型數(shù)據(jù)庫,具有良好的數(shù)據(jù)安全性,高并發(fā)、高拓展、速度快、成本低[19-21].同時便于微信小程序以及前后端的通訊,采用以統(tǒng)一的接口為Web、IOS和Android前、后端提供便捷通信服務的RESTful API,提供豐富的功能接口的同時充分保障數(shù)據(jù)的安全性[13].

4 系統(tǒng)設計與實現(xiàn)

4.1 系統(tǒng)數(shù)據(jù)流分析

微信小程序的數(shù)據(jù)主要包括用戶個人信息與活動數(shù)據(jù).用戶在小程序端發(fā)生的交互動作與活動方與活動管理平臺的交互是業(yè)務的數(shù)據(jù)來源,根據(jù)用戶使用行為和系統(tǒng)的架構分析,業(yè)務流的數(shù)據(jù)處理主要由客戶端和活動管理平臺完成[6].

如圖2所示,用戶可以通過微信小程序端請求活動信息并發(fā)送個人信息,進行活動預約與取消等操作.活動管理平臺接收到用戶的行為請求,在控制層進行相應的業(yè)務處理,并將處理結果以頁面展示的方式返回給用戶.在用戶成功預約活動后,活動管理平臺會將參加者姓名、人數(shù)等信息以頁面展示的形式反饋給活動方,并提供導出Excel數(shù)據(jù)表等拓展功能按鈕,使活動方能及時在活動管理平臺了解活動開展情況.當活動方需要修改活動信息或活動狀態(tài)時,活動方可對已發(fā)布的活動進行修改.系統(tǒng)管理員可實時監(jiān)控用戶與活動方行為,查看操作記錄并進行相關管理操作.

4.2 系統(tǒng)功能介紹

活動管理平臺開發(fā)以RESTful API為通信橋梁的微信小程序用戶端與Web活動方與管理員后端,根據(jù)大學生活動現(xiàn)狀、活動組織者需求定制功能,如圖3.

基礎功能包括：單場次活動發(fā)布與預約、隱藏活動、取消預約、一鍵簽到、缺勤標記、活動場次、預約量、瀏覽量、參與率等數(shù)據(jù)分析統(tǒng)計、個人活動詳情與主頁、注冊與校網(wǎng)郵箱激活驗證、登錄與cookie、頭像、信息綁定、修改與找回密碼等功能.

圖2 系統(tǒng)業(yè)務數(shù)據(jù)流示意圖

圖3 活動管理平臺功能示意圖

高級功能包括：多場次日期預約型活動發(fā)布與預約、分頁與標簽、二維碼掃一掃簽到、定時開啟活動預約通道、預約信息導出Excel數(shù)據(jù)表、權限分級與權限管理、信用分與信用管理、多類型搜索等；其余基本實現(xiàn)框架或即將實現(xiàn)的功能：活動評論、話題發(fā)布、活動室占用情況查詢與狀態(tài)變更等.

4.3 特色功能介紹

(1)郵箱驗證：郵箱驗證功能借助express框架nodemailer組件實現(xiàn).通過該功能可以確保注冊用戶為高校師生,充分保證用戶隱私安全.未驗證的用戶登錄時,將跳轉至激活驗證頁(圖4),發(fā)送驗證郵件后可于郵箱查收(見圖5).找回密碼功能與驗證激活功能實現(xiàn)方式類似.該模塊關鍵代碼如下：

圖4 驗證頁面激活

圖5 郵箱驗證郵件圖

(2)二維碼相關功能：二維碼相關功能包括二維碼分享與二維碼簽到(圖6)兩部分,通過express框架qr-image組件與cookie結合實現(xiàn),具有定時失效、免登錄簽到等特性.管理員開始活動后可以通過二維碼簽到功能進行簡單便捷的簽到操作.該模塊關鍵代碼如下：

圖6 簽到二維碼頁面

二維碼簽到頁面自動刷新功能需于前端代碼文件中標簽中添加代碼實現(xiàn),如下：

(3)導出Excel數(shù)據(jù)表：活動預約數(shù)據(jù)導出Excel數(shù)據(jù)表功能通過express框架excel-export模塊實現(xiàn),管理員可將活動預約信息導出為Excel數(shù)據(jù)表,極大地提高了工作效率與數(shù)據(jù)統(tǒng)計與分析能力.

該模塊關鍵代碼如下：

在該模塊代碼編寫時需要注意應添加代碼res.setHeader('Content-Type','application/vnd.open xmlformats；charset=utf-8')以準許漢字輸出.

(4)單場次活動與日期預約(多場次)活動：根據(jù)大活動管理需求,定制開發(fā)單場次活動與日期預約活動兩大類活動的發(fā)布、預約與管理功能.兩類活動均可選定時、隱藏、信用值要求、人數(shù)限制、預約通道的開啟與關閉、一鍵簽到等定制化功能,方便快捷,應用場景多樣.并可根據(jù)相關技術進一步開發(fā)活動室占用情況查詢等深度定制化功能,如圖7和圖8所示.

(5)并Web端頁面自適應：采用視口viewport渲染方法實現(xiàn)各類設備頁面自適應——移動瀏覽器在渲染W(wǎng)eb頁面時,首先在視圖viewport中渲染網(wǎng)頁元素,由于移動端屏幕比較小,需要把viewport中內(nèi)容屏幕整體縮小,然后再顯示到屏幕中[21].

于前端代碼文件中標簽中添加代碼：

圖7 單場次活動管理頁面

圖8 多場次活動管理頁面

4.4 微信小程序用戶端功能介紹

微信小程序端基礎功能由活動模塊、預約模塊、用戶模塊及收藏模塊組成,通過HTTPS RESTful API調(diào)取云服務端數(shù)據(jù)[13],各模塊間相互獨立又緊密相連.

活動模塊可獲得所有現(xiàn)可預約的活動信息,并根據(jù)條件篩選后呈現(xiàn)給用戶(圖9)；預約模塊用于用戶進行預約等相關操作,同時實現(xiàn)活動提醒等功能；用戶模塊用于綁定與修改用戶信息(圖10),實現(xiàn)微信一鍵登錄；同時與用戶模塊緊密相聯(lián)的收藏模塊可以顯示相關活動.用戶端借助微信小程序云服務平臺實現(xiàn)模板消息、活動提醒、綁定公眾號、一鍵跳轉等創(chuàng)新性功能,極大地提升了用戶體驗.

圖9 活動頁面

5 系統(tǒng)應用效果

5.1 微服務器測試與上線

平臺利用樹莓派本地微型服務器,部署Node測試環(huán)境,申請云數(shù)據(jù)庫Mlab,實現(xiàn)系統(tǒng)測試,進行試運行,并結合樹莓派的硬件特點,安裝VNC Server幫助開發(fā)與維護.試運行過程中搜集用戶的反饋與建議,提高用戶體驗度的同時可進行后臺數(shù)據(jù)分析.

5.2 阿里云云服務器上線

平臺目前使用阿里云輕量應用服務器,使用Ubuntu 16.04系統(tǒng)部署生產(chǎn)環(huán)境并注冊域名,申請并部署SSL協(xié)議[11],便于用戶訪問的同時保障信息與數(shù)據(jù)安全,為使用HTTPS服務的RESTful API的微信小程序提供請求接口.截止2019年3月20日,活動管理平臺已有2163名用戶成功注冊,活動組織方共發(fā)布活動91場次,預約總量達4273人次,瀏覽量已突破44 000人次,如圖11所示.

圖10 用戶信息頁面

圖11 截止2019.3.20統(tǒng)計數(shù)據(jù)

6 結語

基于Node.js與微信小程序的活動管理平臺可供各個高校學生組織、社團推廣使用,以解決類似學生工作增加活動組織者負擔等問題.同時,該平臺的推廣使用可大幅度提高學生與活動管理者線上信息查詢、線上活動預約、參與活動、管理活動的便捷性,將學生活動預約及管理平臺與同學們的日常生活融入到一起,便于實現(xiàn)活動預約的系統(tǒng)化,減輕學生工作負擔,為活動管理者與參與者提供便利,從而提高高?；顒庸芾硇畔⒒?以助力高校通過各類活動培養(yǎng)擔當民族復興大任的時代新人.