基于Kotlin微信公眾招生預報名程序的設計與實現(xiàn)

武永嬌　李丹

摘要：移動互聯(lián)網(wǎng)視域下，遠程教育招生的報名方式形式多樣，如基于線下現(xiàn)場采集信息填報、基于線上 PC 端網(wǎng)頁填報等。隨著微信的快速發(fā)展，據(jù)統(tǒng)計2022年 1月，我國的微信用戶近10億人。報名系統(tǒng)的個性化、移動化、便捷化是招生工作者與報名學生所期盼的。本論述以甘肅開放大學開放教育學院為例，結(jié)合遠程招生報名工作實際需求和發(fā)展趨勢，參照以往信息服務模式，研究利用目前流行的微信開發(fā) Kotlin 語言，對遠程招生報名信息服務需求分析，完成微信公眾招生預報名系統(tǒng)設計，推進開放教育招生現(xiàn)代化管理進程。

關鍵詞：Kotlin;微信公眾;OCR 技術(shù)

中圖分類號：TP393文獻標志碼：A

1 開放教育報名系統(tǒng)情況分析

目前，遠程教育報名方式基本采取兩種模式（以甘肅開放大學開放教育學院為例）：第一種報名方式是學生提前填表，工作人員收集整理學生的填報信息表及證件材料，工作人員依據(jù)填報及提供材料錄入到報名系統(tǒng)中;第二種報名方式是學生到現(xiàn)場提供相關數(shù)據(jù)信息，工作人員錄入報名系統(tǒng)，現(xiàn)場確認。報名系統(tǒng)基于 B/S 模式，全國報名都在國家開放大學指定的同一個平臺中。平臺具有界面友好、易于掌握、操作簡單、功能齊備、應用廣泛、保密性等優(yōu)點，但不能支持移動版，不能滿足預報名信息采集，也無法與目前流行的微信公眾平臺對接。為了解決以上不足，深入研究微信公眾平臺開發(fā)語言及環(huán)境，結(jié)合現(xiàn)有招生報名系統(tǒng)的開發(fā)特點，選取基于 Kotlin 作為開發(fā)環(huán)境，完成微信公眾招生預報名系統(tǒng)設計與實現(xiàn)，經(jīng)過測試，運行穩(wěn)定良好。

2 Kotlin技術(shù)的概述分析

Kotlin 是由 JetBrains 設計開發(fā)并開源，是一種屬于靜態(tài)類型的編程語言，其運行在 Java 虛擬機上。Kotlin可以編譯成 Java 字節(jié)碼，也可以編譯成 JavaScript，方便在沒有 JVM 的設備上運行，在 Google I/O 2017中， Google 宣布 Kotlin 成為 Android 官方開發(fā)語言[1-2] 。

選擇 Kotlin 作為開發(fā)語言，原因如下：

（1） 更具簡潔性：可以大大減少代碼的行數(shù)，特別是樣板代碼數(shù)量減少。

（2） 更具安全性：通過object.equals（“test”），簡單避免整個類的異常等錯誤，如空指針。

（3）互操作性強：瀏覽器和 Android、JVM 的現(xiàn)有庫得到充分利用。

（4） 更加友好的工具界面：工具調(diào)出可以通過命令行或者 Java IDE 任意構(gòu)建使用。

（5）利于平臺之間兼容性：現(xiàn)有的招生報名系統(tǒng)基于 Java 開發(fā)，Kotlin 作為開發(fā)語言，便于與現(xiàn)有報名系統(tǒng)對接。

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

3.1 邏輯架構(gòu)設計

本論述設計的微信公眾招生預報名程序遵從了一套從設計到組件的WeUI規(guī)范的 Web 程序。小程序借助宿主環(huán)境提供的能力，Kotlin 可以完成許多普通網(wǎng)頁無法完成的功能。例如獲取用戶信息、微信支付等，小程序提供了多個 API 。多數(shù) API 的回調(diào)都是異步，有效處理好代碼邏輯的異步問題。邏輯主要部分構(gòu)成：主體部分+各個頁面，主體部分主要用于微信小程序核心的配置，各個頁面主要用于不同業(yè)務場景[3]。當通過文件app.json對主體部分完成配置后，可以進行各類業(yè)務的開發(fā)了，也就是進入了開發(fā)者的主操作頁面。小程序頁面設計基本上也是遵循 Kotlin 環(huán)境下的 MVC 結(jié)構(gòu)進行構(gòu)建。微信公眾招生預報名程序設計邏輯架構(gòu)如圖 1所示。

主體部分主要由3 個文件構(gòu)成：

（1） 文件 app.js：微信小程序的邏輯文件，即微信小程序的注冊代碼位于 app.js，初始化可產(chǎn)生 APP。

（2） 文件app.json：負責配置小程序，即頁面框架位于 app.js 。如窗口界面、導航欄目、頁面地址 http/https 的頁面請求跳轉(zhuǎn)等。

（3）文件app.wxss：主要提供公共樣式及其相應樣式的配置。

頁面由以下4 個文件構(gòu)成[3-4]：

（1） 文件js：主要負責完成頁面邏輯，相當于小程序控制層（C）。

（2） 文件wxml：主要負責頁面結(jié)構(gòu)生成及展示，相當于小程序的視圖層（V） ，支持數(shù)據(jù)的綁定、模板自定義、引用外部、回調(diào)事件、渲染列表等。

（3）文件wxss：主要存放頁面樣式表，前端樣表，可以對wxml的展示起到輔助作用。

（4） 文件json：主要是頁面的相關配置，如一些頁面顯示數(shù)據(jù)的配置。

3.2 功能模塊設計

在對實際報名業(yè)務數(shù)據(jù)的分析與歸納的基礎上，對系統(tǒng)功能模塊進行了設計，用戶關注微信公眾號后，進入不同菜單欄目查閱，如專業(yè)介紹、收費標準、報名流程等。點擊現(xiàn)在報名欄目，填報相關報名信息，生成預報名登記表，并進行核對確認，完成報名。微信公眾招生預報名程序功能架構(gòu)如圖2 所示。

3.2.1專業(yè)介紹

主要顯示開放教育招生簡章中開設的專業(yè)類別，共涉及98個專業(yè)的概況、優(yōu)勢、特色、專業(yè)涉及到的課程等情況，為報名者提供重要的專業(yè)信息選擇參考。

3.2.2收費標準

顯示根據(jù)專業(yè)規(guī)則每個專業(yè)的收費計算及收費項目的解讀。

3.2.3報名資料

詳細介紹專科、本科報名需要的相關材料及特殊專業(yè)的要求，如包括畢業(yè)證件、同等學歷證明、學信網(wǎng)電子注冊表及照片等;特殊專業(yè)如護理學、藥學、藥品經(jīng)營與管理等專業(yè)所需提交的資料說明等。

3.2.4報名流程

動態(tài)流程圖顯示從咨詢報名到正式入學前的所有環(huán)節(jié)工作，此模塊嵌入了問答庫，整理歸納了報名過程中咨詢出現(xiàn)頻率較高的問題，以一問一答的形式呈現(xiàn)，為報名者提供了便捷，同時也緩解了招生咨詢工作的壓力。

3.2.5現(xiàn)在報名

此功能模塊是招生預報名程序的核心模塊，報名的主要信息錄入的入口菜單，此功能模塊主要包括5 個信息區(qū)：

（1） 基本信息，可以點擊身份證識別按鈕（文中3.3.2）讀取基本信息并映射到相應的信息框;

（2） 報名信息，選填申報的層次類型、專業(yè)及教學點等信息;

（3）最高學歷，主要填報現(xiàn)有的最高學歷基本信息，包括畢業(yè)學校、專業(yè)名稱、畢業(yè)證書編號及畢業(yè)時間等等;

（4） 核對簽字，根據(jù)填報信息在后臺生成《國家開放大學報名登記表》，并以網(wǎng)頁電子版形式呈現(xiàn)，方便報名者核對，如果無誤簽字（3.3.3手寫簽名的實現(xiàn)）確認，如果某一項信息有誤，點擊進入相應模塊修改，直至正確填報;

（5）數(shù)據(jù)分析，此模塊供后臺管理人員分析預報名及報名專業(yè)人員分布情況，便于預測分析報名趨勢。3.3 關鍵技術(shù)實現(xiàn)

微信公眾預招生報名報名系統(tǒng)基于微信小程序，前端開發(fā)語言采用 Kotlin 語言。

3.3.1接口描述

支持對二代居民身份證正反面所有8 個字段進行結(jié)構(gòu)化識別，包括姓名、性別、民族、出生日期、住址、身份證號、簽發(fā)機關、有效期限，識別準確率超過99%;支持身份證正面頭像檢測，并返回頭像切片的 base64編碼及位置信息。同時，支持對用戶上傳的身份證圖片進行圖像風險和質(zhì)量檢測，可識別圖片是否為復印件或臨時身份證，是否被翻拍或編輯，是否存在正反顛倒、模糊、欠曝、過曝等質(zhì)量問題。

3.3.2基于 OCR 身份證識別接口的實現(xiàn)

身份證識別 OCR 技術(shù)，只需幾秒，即可獲得身份信息，并且識別速度快，識別率高方便報名者或工作人員及時準確地錄入身份信息，提高工作效率及正確率。圖片支持使用img參數(shù)實時上傳，也支持使用img_url參數(shù)傳送圖片地址，由微信后臺下載圖片進行識別。文件大小限制：小于4 M 。獲取 access token，可參考微信公眾平臺公開接口關鍵技術(shù)。

首先，自定義文件 profunc.js，實現(xiàn)函數(shù)并封裝。 OCR 身份證識別接口字段定義見表1 所列。

其次，在小程序頁面引用，需要傳入access_token。

const cwx = require（'profunc.js'）;//在小程序頁面引入該js文件

...

ocridcard（）{

var that = this;

cwx.OcrIdCard （that.data.access_token）.then

（function（_res）{

var trdata =_res.data.words_result;

console.log（trdata）

that.setData （{

name：trdata['姓名'] .words，

idcard：trdata['公民身份號碼'] .words，userloc：trdata['住址'] .words

...

}）

}）

}

最后，OCR 身份證識別實現(xiàn)運行效果如圖3 所示。

3.3.3手寫簽名的實現(xiàn)

在微信小程序中實現(xiàn)手寫，通常采用筆鋒以及筆跡模擬效果，會因為實時計算較多的貝塞爾曲線而產(chǎn)生卡頓，效果不理想。所以本論述設計使用 canvas 組件實現(xiàn)。將用戶的輸入想象成為一只筆。要畫的簽名是由很多點構(gòu)成的，點與點之間形成曲線連接。由于是在自定義組件中使用，所以要注意獲取 canvas 的時候的 this 指向問題。如果不調(diào)用SelectorQuery的In 方法，那么就在自定義組件獲取不到 canvas，因為這個時候指向的父組件。下面是實現(xiàn)過程部分關鍵代碼。

Component（{

/**組件的初始數(shù)據(jù)*/

data：{

canvasName：'#handWriting'，

ctx：''，

canvasWidth：0，

canvasHeight：0，

startPoint：{

x：0，

y：0，

}，

selectColor：'black'，

lineColor：'#1A1A1A'，//顏色

lineSize：1.5，//筆記倍數(shù)

radius：5，//畫圓的半徑

}，

ready（）{

let canvasName = this.data.canvasName;

let query = wx.createSelectorQuery（）.in（this）;//獲取自定義組件的SelectQuery對象

query.select （canvasName）

.fields（{ node：true，size：true }）

.exec（（res）=>{

const canvas = res[0].node;

const ctx = canvas.getContext（'2d'）;

//獲取設備像素比

const dpr = wx.getSystemInfoSync（）.pixelRatio;

//縮放設置 canvas 畫布大小，防止筆跡錯位canvas.width = res[0].width * dpr;

canvas.height = res[0].height * dpr;

ctx.scale（dpr，dpr）;

ctx.lineJoin="round";

this.setData （{ctx}）;

}）;

query.select （'.handCenter'）.boundingClientRect （rect =>{

console.log（'rect'，rect）;

this.setData （{

canvasWidth：rect.width，

canvasHeight：rect.height

}）;

}）.exec（）;

}，

//省略以下代碼......

}）;

3.3.4系統(tǒng)安全設計

系統(tǒng)安全性設計可以從網(wǎng)絡傳輸安全、數(shù)據(jù)存儲安全、文件存儲安全、掃二維碼安全、微信開放接口安全、小程序釣魚風險及數(shù)據(jù)泄露隱患進行分析。系統(tǒng)安全設計原理如圖4 所示。其中，原生實現(xiàn)層承載小程序依賴的具體操作，由微信 APP 支撐實現(xiàn)，包括 tbs 內(nèi)核、JSAPI 框架、初始化小程序配置、功能接口實現(xiàn)等，主要的安全措施保障有以下幾個方面：

（1） 開發(fā)框架上繼承了微信成熟的 JSAPI 框架和底層的 TBS 瀏覽器內(nèi)核[5];

（2） 開發(fā)者可以通過后臺控制進行配置，保護小程序關鍵信息的安全問題，如域名信息等;

（3）通用網(wǎng)絡傳輸使用 Https，并對訪問域名進行校驗控制，無法抵御攻擊者在本地安裝代理證書實施中間人攻擊的威脅，通用 request 網(wǎng)絡請求僅支持采用 https，包含校驗域名、url、發(fā)起請求和處理響應結(jié)果等。

（4） DataBase （ DB） 文件通過關鍵字（Key，Value）形式存放本地數(shù)據(jù)，從而數(shù)據(jù)的安全保護可以繼承微信的數(shù)據(jù)庫相關加密安全防護策略;

（5）本地文件存儲采用 HashMap 映射機制進行文件定位，文件存儲在外部存儲，本身通過自定義算法實現(xiàn)完整性校驗;

（6）由于微信小程序阻止嵌入url跳轉(zhuǎn)，同時控制域名訪問，使得釣魚風險在一定程度上減輕，仿冒釣魚小程序依靠于微信平臺的審核監(jiān)管能力來監(jiān)測;

（7） 由于是在微信平臺中運行，小程序自身仍需對敏感數(shù)據(jù)進行安全防護，敏感數(shù)據(jù)、能力相關接口需要在后臺進行鑒權(quán)。通常可校驗openid、IP 地址、自定義登陸態(tài)等信息。鑒權(quán)邏輯放在后臺進行。接口返回的明文數(shù)據(jù)會進行簽名校驗，需要依賴登錄session_key;接口返回的敏感數(shù)據(jù)會通過密文返回，解密算法依賴登錄session_key。攻擊者無法獲知用戶的session_key進行破解，竊取用戶數(shù)據(jù)。

4 運行測試

功能運行測試目的是檢測預招生報名小程序的功能及數(shù)據(jù)流轉(zhuǎn)是否正確。根據(jù)設計時期的需求文檔和具體功能實現(xiàn)預期測試即可。通過測試微信預報名程序各功能比較完善，達到預期目標，首先通過微信公眾號，關注甘肅開放大學開放教育學院，或者掃描公眾號二維碼，進入新生報名界面，懸浮式菜單可以查閱專業(yè)介紹、收費標準、報名流程等報名相關宣傳信息，點擊現(xiàn)在報名菜單進入報名環(huán)節(jié)。填報功能部分運行界面如圖5 所示。

5 結(jié)束語

本論述從學校遠程招生報名工作需求出發(fā)，結(jié)合現(xiàn)在報名系統(tǒng)實際情況，為了更好的與現(xiàn)有系統(tǒng)進行兼容，采用現(xiàn)階段比較受歡迎的 Kotlin 語言，開發(fā)了微信公眾平臺的預報名小程序，使用戶（學生）能夠清楚的了解到相關專業(yè)信息、報名流程及完成在線報名，并且可以隨時查看自己的報名情況和修改相關信息，管理者在后臺也可以查閱預報名的專業(yè)數(shù)據(jù)分布情況。經(jīng)反復測試及試運行，此程序已經(jīng)進入正式運行階段，達到了預期的真正意義上的個性化、移動化、便捷化開發(fā)目的，有助于報名工作的開展與推進。

參考文獻：

[1]方倍工作室. 企業(yè)微信公眾平臺開發(fā)實戰(zhàn)：再小的個體也有自己的品牌[M]. 北京：機械工業(yè)出版社，2017.

[2]王龍軍，鄧浩瀾，羅國宇.Kotlin 在圖書館館內(nèi)空氣質(zhì)量檢測 Android 系統(tǒng)網(wǎng)絡通信的應用[J]. 電腦編程技巧與維護，2021（2）：82-83.

[3]黃鴻達. 混凝土生產(chǎn)過程數(shù)據(jù)采集和故障行為分析方法研究[D]. 廣州：暨南大學，2020.

[4]江波. 電子技術(shù)實驗室儀器管理系統(tǒng)設計與應用[J]. 電子技術(shù)與軟件工程，2020（22）：49-50.

[5]梁偉智. 關于依托于微信小程序的高校新生預報到系統(tǒng)設計研究[J]. 數(shù)碼世界，2018（11）：71.

[6]薛玉蕊. 新時代面對高職院校成人繼續(xù)教育發(fā)展轉(zhuǎn)型的思考[J]. 科教文匯（中旬刊），2021（10）：142-144.