宋東翔，王怡然

（1.德宏師范高等?？茖W(xué)校，云南德宏，678400；2.德宏職業(yè)學(xué)院，云南德宏，678400）

0 引言

隨著信息時(shí)代的發(fā)展，部分高校在教師招聘工作中使用高校教師招聘管理系統(tǒng)[1]來(lái)輔助完成招聘工作。通過(guò)研究發(fā)現(xiàn)，一部分高校的招聘系統(tǒng)存在一些問(wèn)題，給招聘工作造成困擾，包括：招聘系統(tǒng)在考生報(bào)名時(shí)系統(tǒng)的頁(yè)面卡頓，如果是報(bào)名的高峰期還會(huì)出服務(wù)器崩潰的情況，嚴(yán)重影響考生報(bào)考；報(bào)名過(guò)程中，管理員需要在進(jìn)行報(bào)名表的審核時(shí)需要查看考生提交的證明材料（以jpg圖片的畢業(yè)證、學(xué)位證、身份證等資料為主），但因部分考生不注意查看報(bào)名要求，上傳了大量與報(bào)名崗位不相關(guān)的證明材料，并且大多數(shù)的材料還不清晰，無(wú)法驗(yàn)證；有時(shí)一個(gè)考生的個(gè)人資料包就有幾十MB的大小，導(dǎo)致管理員打開(kāi)審核頁(yè)面等待考生所有信息加載的時(shí)間太長(zhǎng)（有時(shí)等待10分鐘），影響招聘工作的效率。綜合這些問(wèn)題，進(jìn)行分析發(fā)現(xiàn)主要問(wèn)題就是當(dāng)招聘過(guò)程中用戶同時(shí)操作產(chǎn)生高并發(fā)數(shù)[2]，有時(shí)同時(shí)上傳圖片操作，運(yùn)行服務(wù)器帶寬不夠，就造成了系統(tǒng)上傳文件緩慢。上傳文件大就造成運(yùn)行服務(wù)器存儲(chǔ)的單個(gè)資源[3]文件太大（例如上傳的圖片太大，瀏覽器加載都需要20秒甚至更長(zhǎng)的時(shí)間）。系統(tǒng)的很多功能需要和數(shù)據(jù)庫(kù)交互，所以不高效的數(shù)據(jù)庫(kù)查詢語(yǔ)句造成查詢時(shí)間過(guò)長(zhǎng)。部分考生在抱怨系統(tǒng)影響報(bào)名的同時(shí)擔(dān)心自己填寫(xiě)的信息、上傳的證明材料是否會(huì)出現(xiàn)錯(cuò)誤，導(dǎo)致自己報(bào)名失敗和自己的畢業(yè)證、學(xué)位證等重要信息會(huì)不會(huì)泄露等，所以系統(tǒng)安全性也存在問(wèn)題。綜合以上，本文針對(duì)某高校教師招聘管理體統(tǒng)，提出一種優(yōu)化方案，分別從系統(tǒng)架構(gòu)、軟件框架、數(shù)據(jù)庫(kù)、安全性等方面進(jìn)行優(yōu)化。本文的創(chuàng)新點(diǎn)是結(jié)合高校教師招聘管理系統(tǒng)實(shí)際運(yùn)行情況，針對(duì)問(wèn)題提出優(yōu)化方案，使用目前主流的vue+nodejs框架中的壓縮技術(shù)、數(shù)據(jù)庫(kù)優(yōu)化和圖像優(yōu)化等完成優(yōu)化。

1 優(yōu)化方案設(shè)計(jì)

以某高校教師招聘管理系統(tǒng)為例，未優(yōu)化前系統(tǒng)系統(tǒng)分為服務(wù)端和客戶端。存在的問(wèn)題為：部分頁(yè)面打開(kāi)時(shí)加載時(shí)間超過(guò)5s、注冊(cè)頁(yè)面使用判斷用戶名是否被注冊(cè)的功能時(shí)，數(shù)據(jù)庫(kù)的查詢時(shí)間超過(guò)5s和用戶上傳圖片太多時(shí)，管理員審核查看信息就需要等待所有圖片被加載出來(lái)，浪費(fèi)很長(zhǎng)時(shí)間，有時(shí)等待1分鐘。針對(duì)這些問(wèn)題，提出優(yōu)化方案。如圖1所示，分別在系統(tǒng)架構(gòu)的服務(wù)端和客服端[4]進(jìn)行優(yōu)化。原系統(tǒng)客服端使用Vue2.6.0來(lái)構(gòu)建，Vue-CLI 3.0來(lái)進(jìn)行系統(tǒng)前端的打包發(fā)布。服務(wù)端使用Nginx靜態(tài)資源服務(wù)器來(lái)部署，數(shù)據(jù)庫(kù)使用MySQL數(shù)據(jù)庫(kù)，圖片上傳使用multer組件。優(yōu)化方案為在客戶端中的Vue-CLI 3.0打包配置gzip，服務(wù)端Nginx的設(shè)置中開(kāi)啟配置gzip和HTTPS[5]，gzip目的是減少網(wǎng)頁(yè)單個(gè)資源文件的大小，減少頁(yè)面加載時(shí)間；HTTPS是提高資源傳輸?shù)陌踩?。服?wù)端優(yōu)化MySQL的查詢接口，減少部分頁(yè)面查詢功能返回值的等待時(shí)間。服務(wù)器端的multer組件中加入圖片壓縮,目的是對(duì)客戶端上傳的圖片進(jìn)行壓縮后存儲(chǔ)在服務(wù)端，系統(tǒng)再調(diào)用圖片時(shí)，可以減少考生和管理員查看報(bào)名信息時(shí)網(wǎng)頁(yè)圖片加載時(shí)間。

圖1 系統(tǒng)架構(gòu)優(yōu)化

2 具體優(yōu)化

■2.1 gzip壓縮設(shè)置優(yōu)化

為了提升系統(tǒng)運(yùn)行速度，在軟件開(kāi)發(fā)過(guò)程中的打包發(fā)布環(huán)節(jié)就使用gzip壓縮進(jìn)行優(yōu)化。gzip是一種壓縮技術(shù),經(jīng)過(guò)gzip壓縮后前端的當(dāng)個(gè)資源頁(yè)面大小可以減小30%左右，壓縮后，系統(tǒng)頁(yè)面的加載時(shí)間就快很多。使用gzip需要系統(tǒng)（客戶端）和服務(wù)器端共同支持gzip，主流的chrome瀏覽器和nginx服務(wù)器都支持gzip。本文的某高校教師招聘系統(tǒng)在軟件開(kāi)發(fā)過(guò)程中使用Vue-CLI 3.0打包發(fā)布系統(tǒng)代碼，加入gzip優(yōu)化，首先需要加入compressionwebpack-plugin組件，在文件vue.config.js中配置導(dǎo)入compression-webpack-plugin，在configureWebpack 文件中配置如下代碼：

在服務(wù)器nginx中，首先在nginx中下載gzip的模塊，在nginx配置文件中打開(kāi)配置項(xiàng)gzip on，如果需要開(kāi)啟gizp的更能多功能，也可以開(kāi)啟更多的gzip詳細(xì)配置項(xiàng)。

■2.2 開(kāi)啟HTTPS協(xié)議

因考生進(jìn)行報(bào)名時(shí)需要上傳jpg圖片格式的畢業(yè)證、學(xué)位證、身份證等資料，為了保證數(shù)據(jù)傳輸時(shí)的安全性，需要使用HTTPS協(xié)議。HTTPS是一種通過(guò)計(jì)算機(jī)網(wǎng)絡(luò)進(jìn)行安全通信的傳輸協(xié)議，利用SSL/TLS建立全信道和加密數(shù)據(jù)包，由HTTP進(jìn)行通信。目的是提供對(duì)網(wǎng)站服務(wù)器的身份認(rèn)證，同時(shí)保護(hù)交換數(shù)據(jù)的隱私與完整性。配置HTTPS，首先需要去服務(wù)器商申請(qǐng)證書(shū)（本文是在阿里云通過(guò)dhszzp.top域名申請(qǐng)免費(fèi)的HTTPS證書(shū)，為5998765_ww wdhszzptop.key和5998765_wwwdhszzptop.pem）。HTTPS證書(shū)需要在服務(wù)器端被讀取，然后服務(wù)器端開(kāi)啟HTTPS服務(wù)。本文把證書(shū)上傳到nginx服務(wù)器中，在服務(wù)器端的app.js文件中加入如下代碼，開(kāi)啟端口為1011的HTTPS服務(wù)。

■2.3 查詢接口優(yōu)化

系統(tǒng)在運(yùn)行過(guò)程中需要和數(shù)據(jù)庫(kù)進(jìn)行大量交互，通過(guò)排查使用查詢功能等待時(shí)間超過(guò)5s，其中的頁(yè)面為：(1)注冊(cè)頁(yè)面的input用戶名輸入框在考生輸入用戶名后系統(tǒng)會(huì)實(shí)時(shí)查詢用戶名是否被注冊(cè)；(2)添加報(bào)名表頁(yè)面的判斷考生是否已經(jīng)提交了報(bào)名表，如提交就不能再次提交。檢查頁(yè)面的代碼發(fā)現(xiàn)不存在導(dǎo)致等待時(shí)間過(guò)長(zhǎng)的問(wèn)題，檢查服務(wù)端的判斷用戶名是否被使用和判斷考生是否已經(jīng)提交過(guò)報(bào)名表功能接口時(shí)發(fā)現(xiàn)，數(shù)據(jù)庫(kù)查詢語(yǔ)句使用的是select ＊ from usre where username=”判斷用戶名”和select ＊ from baoming where username=”判斷用戶名”。通過(guò)分析，兩個(gè)查詢接口的返回值只需要一個(gè)布爾值，但是查詢語(yǔ)句中查詢了當(dāng)前用戶的全部信息。綜合分析為查詢了不必要的信息影響了系統(tǒng)，優(yōu)化方案為修改查詢語(yǔ)句為select count（username） as count from usre where username='判斷用戶名'和select count（username）as count from from baoming where username='判斷用戶名'。修改接口的返回值為查詢成功返回true，查詢失敗返回false。

■2.4 圖片壓縮優(yōu)化

考生在系統(tǒng)的客戶端填報(bào)報(bào)名表時(shí)，其中一項(xiàng)是提交證明材料，原系統(tǒng)開(kāi)發(fā)時(shí)考慮考生自己掃描的證明材料圖片為了保證清晰度，要求上傳材料必須為jpg格式，大小不超1MB，但是當(dāng)多個(gè)考生上傳的圖片數(shù)量多時(shí)，影響系統(tǒng)運(yùn)行。通過(guò)優(yōu)化，要求客戶端上傳的圖片在保證清晰度的情況壓縮到300KB左右，圖片壓縮優(yōu)化的具體流程如圖2所示，考生提交證明材料圖片，判斷上傳材料是否為jpg格式，大小不超1MB，如果不符合條件，重新上傳。符合條件圖片上傳到服務(wù)中，服務(wù)器中使用multer組件來(lái)接收?qǐng)D片，multer組件的作用是根據(jù)路徑設(shè)置存儲(chǔ)圖片，但不改變圖片大小。在處理圖片的業(yè)務(wù)邏輯中加入image組件，設(shè)置組件的屬性值：size為400，quality為50，draw和save和原來(lái)的圖片路徑一致。壓縮后的圖片會(huì)覆蓋考生上傳的圖片。壓縮之后，前端的考生和管理員查看報(bào)名信息時(shí)頁(yè)面加載的就是壓縮后的圖片。

圖2 圖片壓縮優(yōu)化流程圖

■2.5 報(bào)名功能優(yōu)化

填寫(xiě)報(bào)名信息，點(diǎn)擊側(cè)邊欄報(bào)名信息查看招聘崗位，選擇崗位點(diǎn)擊報(bào)名。報(bào)名頁(yè)面整合所有基礎(chǔ)的報(bào)名表項(xiàng)，設(shè)置有紅色＊號(hào)的必須填寫(xiě)項(xiàng)目。政治面貌為無(wú)時(shí)，加入時(shí)間可以不填寫(xiě)。

上傳本人圖片點(diǎn)擊上傳欄的“+”號(hào)選擇個(gè)人證件照上傳。如果上傳失誤，可再次點(diǎn)擊圖片，即可再次選擇圖片替換已上傳失誤的圖片。證明材料圖片欄點(diǎn)擊“選擇文件”按鈕選擇學(xué)位證、畢業(yè)證、身份證等證明圖片，然后點(diǎn)擊“點(diǎn)擊上傳”進(jìn)行上傳。如需刪除失誤上傳的證明材料，點(diǎn)擊圖片右上角的“×”刪除。出生年月加入時(shí)間有時(shí)間控件，無(wú)需手動(dòng)輸入，點(diǎn)擊輸入框，彈出時(shí)間列表，選擇表上方雙箭頭進(jìn)行年月的選擇，往左年份越大，往右年份越小。點(diǎn)擊表上方單箭頭進(jìn)行月份的選擇，往左月份越大，往右月份越小。設(shè)置身份證和聯(lián)系方式必須為18位和11位。

■2.6 審核功能優(yōu)化

管理員可以查看所有通過(guò)初審?fù)ㄟ^(guò)的招聘者報(bào)名信息，為了結(jié)合管理員日常的審核習(xí)慣和方便審核，系統(tǒng)把報(bào)名信息設(shè)計(jì)為一張類似word的報(bào)名表，對(duì)應(yīng)招聘者提交的報(bào)名信息證明材料在報(bào)名表的下方每行一張圖片顯示。管理員可以很清晰直觀的審核信息，年紀(jì)較大的管理員不會(huì)因?yàn)檗k公環(huán)境切換為網(wǎng)絡(luò)平臺(tái)而感到不適應(yīng)。并且審核時(shí)只需選擇通過(guò)和不通過(guò)的下拉列表，附上審核說(shuō)明就完成審核。

3 實(shí)驗(yàn)結(jié)果

實(shí)驗(yàn)使用的是經(jīng)過(guò)優(yōu)化的某高校教師招聘管理系統(tǒng)，詳細(xì)配置參數(shù)是：服務(wù)器：阿里云ecs.s6-c1m2.small、操作系統(tǒng)：Alibaba Cloud Linux 2.1903 LTS 64位、No deJS：12.0.1、Vue：2.6.1、Vue-CLI：3.0、multer：1.4.2、MyS QL：5.7.1。設(shè)置gzip之后，系統(tǒng)前端打包后的部分資源大小如圖3所示，dist/static/js/chunk-47ce0732.889cd10a.js文件在壓縮之前有1524.56KiB，使用gzip壓縮后，大小為473.07KiB，減小了近3倍，之后的文件也壓縮了3-4倍。

圖3 系統(tǒng)前端打包發(fā)布資源詳細(xì)圖

在chrome瀏覽器中輸入https://dhszzp.top域名訪問(wèn)，瀏覽器驗(yàn)證證書(shū)有效，連接是安全的。通過(guò)測(cè)試系統(tǒng)注冊(cè)頁(yè)面的判斷用戶名是否被使用接口和報(bào)名頁(yè)面考生是否已經(jīng)提交報(bào)名表功能查詢接口，結(jié)果如表1所示。

表1 用戶名判斷和報(bào)名表判斷優(yōu)化前后加載時(shí)間表（單位ms）

4 總結(jié)與展望

通過(guò)優(yōu)化后的某高校教師招聘管理系統(tǒng)，在前端打包發(fā)布的頁(yè)面資源文件大小平均減小近3倍，數(shù)據(jù)庫(kù)查詢功能接口的等待時(shí)間不超過(guò)300ms，上傳圖片在保證圖片質(zhì)量的同時(shí)壓縮到300kb左右，管理員審核時(shí)的等待時(shí)間平均不超過(guò)3s，HTTPS協(xié)議成功開(kāi)啟，保證了系統(tǒng)信息的安全性，減少考生和管理員審核等待時(shí)間，提升報(bào)名操作體驗(yàn)，全面提升高校教師招聘工作的效率。但是系統(tǒng)還是存在一些缺陷，例如一個(gè)管理員審核所有報(bào)名信息，可能會(huì)出現(xiàn)管理員惡意篡改報(bào)名信息，后期研究使用區(qū)塊鏈的可追溯和不可篡改特性優(yōu)化系統(tǒng)。