基于Kotlin微信公眾招生預(yù)報(bào)名程序的設(shè)計(jì)與實(shí)現(xiàn)

武永嬌　李丹

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

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

中圖分類號(hào)：TP393文獻(xiàn)標(biāo)志碼：A

1 開(kāi)放教育報(bào)名系統(tǒng)情況分析

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

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

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

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

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

（2） 更具安全性：通過(guò)object.equals（“test”），簡(jiǎn)單避免整個(gè)類的異常等錯(cuò)誤，如空指針。

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

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

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

3 系統(tǒng)的設(shè)計(jì)與實(shí)現(xiàn)

3.1 邏輯架構(gòu)設(shè)計(jì)

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

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

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

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

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

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

（1） 文件js：主要負(fù)責(zé)完成頁(yè)面邏輯，相當(dāng)于小程序控制層（C）。

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

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

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

3.2 功能模塊設(shè)計(jì)

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

3.2.1專業(yè)介紹

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

3.2.2收費(fèi)標(biāo)準(zhǔn)

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

3.2.3報(bào)名資料

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

3.2.4報(bào)名流程

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

3.2.5現(xiàn)在報(bào)名

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

（1） 基本信息，可以點(diǎn)擊身份證識(shí)別按鈕（文中3.3.2）讀取基本信息并映射到相應(yīng)的信息框;

（2） 報(bào)名信息，選填申報(bào)的層次類型、專業(yè)及教學(xué)點(diǎn)等信息;

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

（4） 核對(duì)簽字，根據(jù)填報(bào)信息在后臺(tái)生成《國(guó)家開(kāi)放大學(xué)報(bào)名登記表》，并以網(wǎng)頁(yè)電子版形式呈現(xiàn)，方便報(bào)名者核對(duì)，如果無(wú)誤簽字（3.3.3手寫(xiě)簽名的實(shí)現(xiàn)）確認(rèn)，如果某一項(xiàng)信息有誤，點(diǎn)擊進(jìn)入相應(yīng)模塊修改，直至正確填報(bào);

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

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

3.3.1接口描述

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

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

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

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

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

const cwx = require（'profunc.js'）;//在小程序頁(yè)面引入該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['公民身份號(hào)碼'] .words，userloc：trdata['住址'] .words

...

}）

}）

}

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

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

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

}，

ready（）{

let canvasName = this.data.canvasName;

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

query.select （canvasName）

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

.exec（（res）=>{

const canvas = res[0].node;

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

//獲取設(shè)備像素比

const dpr = wx.getSystemInfoSync（）.pixelRatio;

//縮放設(shè)置 canvas 畫(huà)布大小，防止筆跡錯(cuò)位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)安全設(shè)計(jì)

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

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

（2） 開(kāi)發(fā)者可以通過(guò)后臺(tái)控制進(jìn)行配置，保護(hù)小程序關(guān)鍵信息的安全問(wèn)題，如域名信息等;

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

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

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

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

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

4 運(yùn)行測(cè)試

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

5 結(jié)束語(yǔ)

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

參考文獻(xiàn)：

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

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

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

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

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

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