基于Vue+Spring Boot校園求職學習平臺的設計與實現(xiàn)

顧茗思懿 王會鮮

摘要：應屆畢業(yè)生與招聘單位之間一直存在著校園求職難與招聘難這一矛盾沖突。該文通過對畢業(yè)生校園求職與招工單位校園招聘的需求進行分析，采用前后端分離的web開發(fā)模式，設計了一個基于Vue和Spring Boot的校園求職學習平臺，幫助畢業(yè)生做好求職準備、減少公司校園招聘成本。該平臺實現(xiàn)公司概況介紹、筆試題目參考、論壇經(jīng)驗分享和內推崗申請等核心功能，具有易維護、易拓展、易于實現(xiàn)等優(yōu)點。

關鍵詞：校園求職;學習平臺;Vue;Spring Boot

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

文章編號：1009-3044（2020）33-0094-03

開放科學（資源服務）標識碼（OSID）：

1 背景

每當提到校園招聘，“求職難、招聘難”便一直是應屆畢業(yè)生與招聘單位（公司）之間遇到的矛盾沖突問題[1]。學生們普遍無筆試、面試及工作經(jīng)驗，對各公司的概況知之甚少，而各類招聘網(wǎng)站（國內傾向綜合類招聘，如?？途W(wǎng);國外注重社交類招聘，如Linkedln、Milkround）信息分散、資料老舊且無針對性[2J，這些原因導致了招聘單位每年校招都會收到大量無效、不匹配的簡歷，嚴重浪費求職學生及招聘單位的資源。為了有效解決這一問題，本文設計和實現(xiàn)了一個基于Vue+ Spring Boot的校園求職學習平臺，通過學習、論壇、個人中心功能模塊，為學生提供更全面的公司信息與筆試、面試經(jīng)驗分享與討論的服務，既能多方位提升學生綜合能力，也幫助招聘單位在校園招聘時更好、更快選定適合自己的員工，降低人力成本。

2 校園求職學習平臺的總體設計

2.1 體系架構設計

本校園求職學習平臺使用B/S體系架構，采用前后端主流的輕量級框架[3]進行開發(fā)實現(xiàn)，用戶只需通過瀏覽器即可訪問、使用本平臺。前端負責控制頁面跳轉、調用接口，通過Yam安裝與緩存Vue+ Element UI項目[4]，用SASS編寫頁面樣式，并采用axios進行異步請求同步化處理，幫助后端完成許多數(shù)據(jù)處理工作，減輕服務器壓力。后端則負責業(yè)務邏輯，通過Maven創(chuàng)建了Spring Boot項目[5]，幫助自動安裝、管理了許多依賴配置，Spring Boot將Tomcat服務器集成于Web容器中提供核心層服務，包含了控制層、業(yè)務層以及數(shù)據(jù)訪問層。這種前后端分離的開發(fā)模式不僅可以解耦提高性能和擴展性，還因為分工明確使得能夠快速定位到bug，提高開發(fā)效率且降低維護成本。最底層則是負責提供數(shù)據(jù)存儲服務的MySQL數(shù)據(jù)庫。本平臺體系架構如圖1所示。

2.2 功能結構設計

本平臺使用涉及三類用戶：學生用戶、公司用戶與管理員。根據(jù)各類用戶及校園求職學習平臺的實際需求，按照模塊化思想，將平臺按照用戶類型及其工作業(yè)務流程劃分成七大功能模塊。學生用戶所能使用的功能將是本平臺核心功能，包含：以公司信息、面試錦集、他人評價和內推崗模塊為核心的學習模塊，以帖子模塊、評論模塊為核心的論壇模塊，以及全面管理學生用戶個人相關信息及收藏信息的個人中心模塊。管理員用戶則能對整個平臺數(shù)據(jù)進行維護與管理，主要功能有公司管理（包括公司信息、題庫、崗位與簡歷）、用戶管理以及論壇管理（包括帖子與評論）。公司用戶則通過管理員用戶的授權，對本平臺中涉及該公司的所有信息進行相應操作，如更新公司簡介、發(fā)布招聘崗位、求職簡歷下載等。

1）注冊登錄模塊。用于驗證和判斷用戶角色。用戶需先進行注冊，而后使用已注冊的賬號信息登錄至本平臺，進入主頁面。平臺會進行訪問攔截，未登錄者無法使用平臺功能。

2）學習模塊。主要以知識卡片形式，圍繞公司簡潔精煉地展示公司信息概要，并提供他人評價、試題、內推崗投遞與郵件提醒等服務。

3）論壇模塊。本模塊主要包括帖子與評論兩大部分。學生用戶可進行發(fā)帖、搜貼、收藏帖子和發(fā)表評論等一系列操作，且為了打造綠色和諧的網(wǎng)絡環(huán)境，發(fā)帖與評論時平臺會對發(fā)布的內容進行審核。

4）個人中心模塊。學生用戶可至個人中心查看與完善個人信息、修改密碼、上傳并下載簡歷以及查看帖子收藏情況。

5）用戶管理模塊。管理員可對所有用戶進行管理，包括用戶的增刪查改、角色權限的分配等。

6）公司管理模塊。管理員可對公司信息進行管理。公司員工登錄后只能查看與編輯本公司信息，包括發(fā)布內推崗位及瀏覽、下載收到的簡歷等。

7）論壇管理模塊。管理員可對論壇帖子、評論等內容進行管理。

圖2為本平臺學生用戶和管理員用戶的核心功能及其子功能模塊結構。

2.3 數(shù)據(jù)庫的設計

校園求職學習平臺的數(shù)據(jù)庫采用MySQL數(shù)據(jù)庫。由于平臺數(shù)據(jù)量會比較大，考慮到數(shù)據(jù)庫后期維護需要，以及數(shù)據(jù)庫運行、搜索效率的穩(wěn)定保障，數(shù)據(jù)庫設計盡量采用分表設計。本平臺涉及實體對象有用戶、公司、內推崗、他人評價、試題、簡歷、帖子和評論，根據(jù)其彼此之間聯(lián)系設計的數(shù)據(jù)庫數(shù)據(jù)表共有14張，包括用戶信息表、公司表、公司類型表、他人評價表、內推崗位表、崗位類型表、公司參考試題與答案表、簡歷信息表、投遞情況表、帖子版塊表、帖子基本信息表、帖子內容表、帖子收藏表以及帖子評論表。

3 校園求職學習平臺的核心功能模塊實現(xiàn)

3.1 注冊登錄模塊

為保障平臺的安全性，用戶只有登錄成功后才能使用平臺功能。用戶首先需要注冊賬號。前端可通過定義rules并結合正則表達式對表單字段進行校驗，當未輸入必填字段或輸入有誤時，都能及時反饋提示響應信息。注冊成功后可使用已注冊信息登錄至平臺首頁，為防止用戶惡意頻繁注冊或登錄，前端封裝了滑塊驗證組件，需驗證通過才能進行下一步操作。若用戶忘記密碼，可點擊“忘記密碼”，輸入用戶名與注冊郵箱，通過身份驗證后即可成功進入主頁。圖3為本平臺學生用戶登錄后的主頁面，學生用戶可在該頁面使用導航欄中的所有功能。

3.2 學習模塊

本模塊的數(shù)據(jù)是利用Groovy爬蟲[6]拉勾網(wǎng)所得，通過Json-Slurper方法對JSON數(shù)據(jù)進行解析，并轉換成ArrayList對象逐條遍歷插入數(shù)據(jù)庫。由于公司信息數(shù)據(jù)量較大，搜索功能使用了Lucene分布式搜索引擎[7]，先建立索引再進行分詞搜索，能夠高性能支持千萬級數(shù)據(jù)搜索量。他人評價功能調用了awe-some-danmaku組件從而以視頻彈幕形式播放，便于用戶快速瀏覽。在面試錦集模塊中，頁面會跳轉至該公司試題頁面，通過前端v-show語句即可實現(xiàn)答案的隱藏與顯示。在內推崗位模塊中，點擊工作列表即可按崗位所在城市以及崗位類型分類查看內推崗信息，頁面效果如圖4所示。該模塊前端使用了El-ement UI提供的el-radio-group實現(xiàn)城市、類型標簽的選擇，并通過computed方法綁定計算屬性，隨著用戶選擇標簽的變化而顯示不同的內推崗位。點擊“投遞簡歷”后，平臺會同時發(fā)送郵件提醒公司用戶及時查收預覽，公司用戶可登錄平臺查看相應投遞信息。

3.3 論壇模塊

本模塊的發(fā)帖功能調用了mavon_editor[8]提供的markdown編輯器組件，用戶可在左邊進行帖子內容的編輯，右邊會同步展示編輯效果，使用十分方便。點擊“發(fā)帖”后，前端會將mark-down的內容轉換為html格式傳遞給后端，而后端接收到內容后，會先接入百度AI提供的內容審核API，對帖子內容包括圖片進行過濾審核，內容合規(guī)才會將帖子存人數(shù)據(jù)庫并提示發(fā)帖成功。

瀏覽時，用戶可輸入帖子標題進行關鍵詞模糊搜索或按帖子板塊分類找尋想要的帖子并查看詳情。收藏帖子的動態(tài)效果引入了Font Awesome圖標庫并結合Animate.css動畫庫來實現(xiàn)，而評論時的表情包則通過循環(huán)列表生成選擇框，并利用正則匹配轉化將后端存人的表情字符串回顯出來。為確保本平臺前端打包部署后圖片顯示正常，需使用require（“路徑”）的方式使得Webpack編譯后能找到對應的模塊組件。

3.4 個人中心模塊

在該模塊，學生用戶可進行修改或完善個人信息（含密碼更新）、簡歷上傳、帖子收藏等操作，頁面效果如圖5所示。在信息修改頁面中，地區(qū)選擇功能使用Element UI的el-cascader來實現(xiàn)二級聯(lián)動下拉菜單來選擇所在城市，前端需先獲取后端所提供的JSON格式的城市信息并解析，而后通過getChecked-Nodes方法獲取菜單valueld對應的label城市名并顯示出來。為防范物理文件感染且方便數(shù)據(jù)庫備份與移植，本平臺簡歷上傳功能，會將用戶上傳的簡歷轉換為二進制流文件，隨后進行Base64編碼并轉換成字符串，再將字符串以BLOB類型存人數(shù)據(jù)庫。

4 結束語

本校園求職學習平臺以MySQL作為核心數(shù)據(jù)庫，前端主要通過Vue搭建腳手架并結合Element UI做出響應式布局的平臺，后端主要采用Spring Boot框架并結合Maven及MyBatis-Plus來構建項目，不僅簡化了開發(fā)流程、使代碼更模塊化，也更便于后期的維護和優(yōu)化。該平臺可以為畢業(yè)生和招聘單位提供一個綜合信息平臺，學生可以了解公司、崗位與面試流程，分享與討論求職經(jīng)驗，并不斷成長進步，進而尋找到合適崗位;招聘單位則可優(yōu)先進行人才的初步培養(yǎng)和識別，簽約理想的人才，并減少不必要的人力、物力資源消耗。在今后的研究過程中，還需要對平臺的性能、安全等方面做進一步優(yōu)化與提升。

參考文獻：

[1]劉溢，張潔，黃瀚賢，等.校園網(wǎng)絡招聘存在的問題及對策探討[J].價值工程，2020，39（7）：240-242.

[2]劉楨.嚴峻就業(yè)形式下校園招聘困境及對策研究[J].智庫時代，2019（42）：25，28.

[3]王建，羅政，張希，等.Web項目前后端分離的設計與實現(xiàn)[J].軟件工程，2020，23（4）：22-24.

[4]呂英華.漸進式JavaScript框架Vue.js的全家桶應用[J].電子技術與軟件工程，2019（22）：39-40.

[5]王丹，孫曉宇，楊路斌，等，基于SpringBoot的軟件統(tǒng)計分析系統(tǒng)設計與實現(xiàn)[J].軟件工程，2019，22（3）：40-42.

[6]楊哲.基于Groovy的分布式網(wǎng)絡爬蟲系統(tǒng)的設計與實現(xiàn)[D].成都：西南交通大學，2010.

[7]崔曜華.基于Lucene的分布式搜索引擎的研究與實現(xiàn)[D].南京：東南大學，2018.

[8]王辰，劉曉鑫，曹曉燕，等.基于Vue.js平臺的Markdown標記語言插件的研究與實現(xiàn)[J].科技風，2018（35）：82，85.

【通聯(lián)編輯：謝媛媛】

作者簡介：顧茗思懿（1998-），女，上海人，本科在讀;王會鮮（1980-），女，河南鄢陵人，講師，博士，主要研究方向為信息系統(tǒng)與數(shù)據(jù)處理。