舒遠(yuǎn)仲　黃文強(qiáng)　梅夢(mèng)喆

摘 要： 根據(jù)高校畢業(yè)生就業(yè)信息管理和服務(wù)工作需要，為方便畢業(yè)生和招聘單位信息交流，及時(shí)掌握就業(yè)信息，提高管理效率，提出了構(gòu)建基于HTML5的高校就業(yè)信息服務(wù)系統(tǒng)。采用ASP.NET+SQL Server 2008為開(kāi)發(fā)技術(shù)，詳細(xì)分析了系統(tǒng)需求，設(shè)計(jì)了系統(tǒng)框架 、功能結(jié)構(gòu)圖和后臺(tái)數(shù)據(jù)庫(kù)，實(shí)現(xiàn)了一個(gè)跨平臺(tái)的就業(yè)信息服務(wù)系統(tǒng)。

關(guān)鍵詞： 就業(yè)信息服務(wù)； 就業(yè)數(shù)據(jù)； HTML5技術(shù)； 跨平臺(tái)

中圖分類(lèi)號(hào)：TP311.5 文獻(xiàn)標(biāo)志碼：A 文章編號(hào)：1006-8228（2016）03-93-04

Design and realization of cross-platform graduate employment information

service system based on HTML5

Shu Yuanzhong， Huang Wenqiang， Mei Mengzhe

（College of Information Engineering， Nanchang Hangkong University， Nanchang， Jiangxi 330063， China）

Abstract： According to the needs of the college graduate employment information management and service， to facilitate the contact between graduates and the recruiters， timely get the employment information and improve the management efficiency， to construct a university employment information service system with HTML5 is put forward. Using the development technologies of ASP.NET and SQL Server 2008， the system requirements is analyzed in detail， the system framework， function structure and background database are designed， and the cross-platform employment information service system is realized.

Key words： employment information service； employment data； HTML5 technology； cross-platform

0 引言

近幾年來(lái)，高校畢業(yè)生人數(shù)增長(zhǎng)越來(lái)越快，就業(yè)形勢(shì)日益嚴(yán)峻。如何對(duì)高校畢業(yè)生提供準(zhǔn)確的就業(yè)信息服務(wù)，是目前高校亟待解決的問(wèn)題。各高校都有自己的就業(yè)信息服務(wù)系統(tǒng)，可為畢業(yè)生、企業(yè)和學(xué)校提供優(yōu)質(zhì)的就業(yè)信息服務(wù)。但是隨著互聯(lián)網(wǎng)技術(shù)的發(fā)展，之前的就業(yè)信息服務(wù)系統(tǒng)已經(jīng)無(wú)法滿(mǎn)足當(dāng)前各高校的需求。我們?cè)O(shè)計(jì)并實(shí)現(xiàn)一個(gè)跨平臺(tái)的高校畢業(yè)生就業(yè)信息服務(wù)平臺(tái)，實(shí)現(xiàn)信息共享，快速幫助畢業(yè)生就業(yè)，協(xié)助用人單位選到合適人才，使畢業(yè)生、企業(yè)、學(xué)校三者之間能夠在線(xiàn)交互，提高學(xué)校就業(yè)管理效率[1-2]。

在高校就業(yè)服務(wù)系統(tǒng)基礎(chǔ)上，應(yīng)用HTML5技術(shù)和ASP.NET技術(shù)，采用B/S結(jié)構(gòu)，利用HTML5跨平臺(tái)特性進(jìn)行系統(tǒng)設(shè)計(jì)與實(shí)現(xiàn)。該系統(tǒng)的應(yīng)用，能夠幫助畢業(yè)生靈活的、方便的、快速的了解就業(yè)信息，找到合適的用人單位，提高畢業(yè)生就業(yè)率。

1 系統(tǒng)分析

通過(guò)對(duì)各高校就業(yè)信息管理系統(tǒng)實(shí)際情況的調(diào)查，確定了就業(yè)信息管理系統(tǒng)幾個(gè)基本要求：學(xué)生憑學(xué)號(hào)登錄，企業(yè)須先注冊(cè)才能登錄，以保證信息安全；實(shí)現(xiàn)就業(yè)統(tǒng)計(jì)，實(shí)現(xiàn)企業(yè)與學(xué)生的互動(dòng)功能；界面設(shè)計(jì)要美觀(guān)，操作要方便，信息要及時(shí)更新；系統(tǒng)運(yùn)行要穩(wěn)定，安全要有保證。

按照這些基本要求，將用戶(hù)分為三類(lèi)：管理員、學(xué)生和企業(yè)。管理員擁有最高權(quán)限，管理學(xué)生和企業(yè)、系統(tǒng)角色管理、就業(yè)工作統(tǒng)計(jì)和系統(tǒng)維護(hù)等。學(xué)生用戶(hù)主要是填寫(xiě)簡(jiǎn)歷和查看招聘信息等。企業(yè)用戶(hù)主要是發(fā)布招聘信息和查看學(xué)生簡(jiǎn)歷等。系統(tǒng)能根據(jù)學(xué)生的專(zhuān)業(yè)和特長(zhǎng)推薦就業(yè)單位，能根據(jù)企業(yè)需求推薦畢業(yè)生。

2 系統(tǒng)設(shè)計(jì)

本系統(tǒng)主要以Microsoft Visual Studio 2010為開(kāi)發(fā)平臺(tái)，用SQL Server 2008 作為后臺(tái)管理數(shù)據(jù)庫(kù)，應(yīng)用ASP.NET技術(shù)和HTML5技術(shù)，再結(jié)合C#語(yǔ)言和JavaScript腳本語(yǔ)言進(jìn)行開(kāi)發(fā)。

2.1 系統(tǒng)功能模塊設(shè)計(jì)

根據(jù)對(duì)高校的就業(yè)管理需求分析，將高校就業(yè)管理信息系統(tǒng)分為前臺(tái)管理和后臺(tái)管理。前臺(tái)主要是信息展示，后臺(tái)根據(jù)用戶(hù)權(quán)限，設(shè)計(jì)相應(yīng)的功能模塊。詳細(xì)的就業(yè)管理系統(tǒng)功能結(jié)構(gòu)如圖1所示。

3 數(shù)據(jù)庫(kù)設(shè)計(jì)

本系統(tǒng)采用SQL Server 2008 數(shù)據(jù)庫(kù)，它的許多新特性和關(guān)鍵問(wèn)題的改進(jìn)，以及完整的企業(yè)級(jí)技術(shù)與工具，為系統(tǒng)功能的實(shí)現(xiàn)提供了便利。

以下簡(jiǎn)要介紹重要數(shù)據(jù)表功能。

⑴ 學(xué)生簡(jiǎn)歷表。主要用來(lái)記錄學(xué)生的個(gè)人信息，包括學(xué)生編號(hào)、姓名、性別、出生日期、家庭地址、政治面貌、身體健康、身高、體重、聯(lián)系電話(huà)、電子郵箱、QQ、學(xué)歷、外語(yǔ)等級(jí)、計(jì)算機(jī)等級(jí)、專(zhuān)業(yè)、名族、獎(jiǎng)勵(lì)情況、個(gè)人愛(ài)好、技能專(zhuān)長(zhǎng)、社會(huì)實(shí)踐、自我評(píng)價(jià)等字段。其中，學(xué)生編號(hào)為主字段。

⑵ 學(xué)生就業(yè)意向表。主要用來(lái)記錄學(xué)生期望的就業(yè)職位信息，包括意向編號(hào)、職位類(lèi)型、求職類(lèi)型、希望職位、工作地點(diǎn)、工作時(shí)間、薪水、備注等字段。其中意向編號(hào)為主字段。

⑶ 用人單位信息表。主要用來(lái)記錄用人單位的信息，包括單位編號(hào)、用戶(hù)名、密碼、單位名稱(chēng)、單位性質(zhì)、單位規(guī)模、單位地址、電子郵箱、執(zhí)照編號(hào)、法人代表、注冊(cè)日期、注冊(cè)資金、行業(yè)類(lèi)別、聯(lián)系電話(huà)、郵政編碼、單位簡(jiǎn)介等字段。其中，單位編號(hào)為主字段。

⑷ 用人單位崗位專(zhuān)業(yè)素質(zhì)需求表。主要用來(lái)記錄用人單位選擇符合該崗位的學(xué)生信息，包括：需求編號(hào)、專(zhuān)業(yè)、學(xué)歷、技能專(zhuān)長(zhǎng)、成績(jī)、外語(yǔ)等級(jí)、備注等字段。其中需求編號(hào)為主字段。

⑸ 角色表。主要用來(lái)記錄不同角色的信息，包括角色編號(hào)、角色名、角色序號(hào)等字段。其中角色編號(hào)為主字段。

4 系統(tǒng)關(guān)鍵技術(shù)與功能實(shí)現(xiàn)

4.1 系統(tǒng)架構(gòu)與主要技術(shù)

系統(tǒng)開(kāi)發(fā)必須考慮用戶(hù)使用方便。我們采用B/S結(jié)構(gòu)[3-4]和以MVC模式為基礎(chǔ)的ASP.NET MVC的Web應(yīng)用程序框架[5-6]。其中MVC模式主要包括三部分：視圖（View）、模型（Model）和控制器控制器（Controller），各部分負(fù)責(zé)不同的功能，方便了后期的修改與維護(hù)，同時(shí)也大大提高了開(kāi)發(fā)效率。

HTML5技術(shù)實(shí)際上是由HTML5、CSS3和JavaScript組合而成的，其設(shè)計(jì)目的是：在移動(dòng)設(shè)備上支持多媒體。HTML5不僅提供了新元素支持的功能，如video、audio、和canvas標(biāo)記，更重要的是添加了對(duì)腳本和布局之間的原生交互能力。

jQuery EasyUI框架是基于JQuery的一個(gè)前臺(tái)ui界面的插件，支持HTML5，雖簡(jiǎn)單，但功能強(qiáng)大，為開(kāi)發(fā)人員節(jié)省時(shí)間。特別是EasyUI支持兩種渲染方式，javascript方式（如：$（'#p'）.panel（{...}））和html標(biāo)記方式（如：class="easyui-panel"）。jQuery EasyUI提供了用于創(chuàng)建跨瀏覽器網(wǎng)頁(yè)的完整的組件組合，包括功能強(qiáng)大的datagrid（數(shù)據(jù)網(wǎng)絡(luò)）、treegrid（樹(shù)形表格）、panel（面板）、combo（下拉組合）等等。

4.2 實(shí)現(xiàn)數(shù)據(jù)庫(kù)連接

由微軟創(chuàng)建的活動(dòng)數(shù)據(jù)對(duì)象（Active Data Object，ADO）應(yīng)用程序接口提供了一個(gè)易于使用的OLE-DB功能接口，可以從腳本語(yǔ)言（如VBScript和JScript）中進(jìn)行調(diào)用。ADO.NET提供了簡(jiǎn)化的接口，還提供了數(shù)據(jù)集的抽象概念和允許斷開(kāi)連接的數(shù)據(jù)訪(fǎng)問(wèn)[7-8]。此次系統(tǒng)應(yīng)用的就是ADO.NET接口。

當(dāng)系統(tǒng)執(zhí)行數(shù)據(jù)庫(kù)連接操作時(shí)，首先運(yùn)用Connection類(lèi)建立與設(shè)定數(shù)據(jù)庫(kù)的連接，然后應(yīng)用Command對(duì)象ExecuteNonQuery（）方法或者ExecuteReader（）方法來(lái)執(zhí)行數(shù)據(jù)庫(kù)的添加、刪除、修改、插入等命令。打開(kāi)與數(shù)據(jù)庫(kù)的連接，使用Open（）方法。關(guān)閉數(shù)據(jù)庫(kù)的連接，使用Close（）方法。使用完數(shù)據(jù)庫(kù)要記得關(guān)閉，不然影響運(yùn)行效率。ADO.NET數(shù)據(jù)庫(kù)操作圖如圖2所示。

4.3 視頻播放

在HTML5中，新增了兩個(gè)元素—video元素和audio元素。Video元素專(zhuān)門(mén)用來(lái)播放網(wǎng)絡(luò)上的視頻或電影，而Audio元素專(zhuān)門(mén)用來(lái)播放網(wǎng)絡(luò)上的音頻數(shù)據(jù)，使用這兩個(gè)元素就不需要使用第三方插件（如Flash），只要使用能夠支持HTML5的瀏覽器即可。

在本系統(tǒng)中，把video應(yīng)用在高校就業(yè)信息服務(wù)系統(tǒng)前臺(tái)頁(yè)面中，展示高校就業(yè)指導(dǎo)視頻和高校宣傳片視頻，相比之前HTML4代碼中必須使用object和embed元素，而且還要為這兩個(gè)元素添加許多屬性和參數(shù)，使多媒體播放技術(shù)顯得代碼冗長(zhǎng)而笨拙。Video元素就能完美解決這一問(wèn)題，關(guān)鍵代碼如下[9]：

4.4 圖形繪制

在頁(yè)面中放置一個(gè)canvas元素就非常直觀(guān)和簡(jiǎn)單，canvas元素不僅可以繪制圖形與圖像，還可以繪制出文字，使得字體更加炫酷。代碼如下：

width="200" height="200">

使用canvas元素制作圖表，把個(gè)人簡(jiǎn)介和單位介紹呈現(xiàn)在圖表中，以直觀(guān)、簡(jiǎn)單、清晰的信息，讓學(xué)生或企業(yè)爽心悅目。系統(tǒng)中的前臺(tái)文字，也可以用canvas元素進(jìn)行字體設(shè)計(jì)，頁(yè)面會(huì)更美觀(guān)。在就業(yè)數(shù)據(jù)統(tǒng)計(jì)中，利用canvas進(jìn)行圖形渲染和繪制機(jī)制，設(shè)計(jì)餅狀圖、柱狀圖、折線(xiàn)圖等圖形組件，并且提供組件定義設(shè)置方式，支持圖表類(lèi)型齊全。在HTML5技術(shù)支持下，可以實(shí)現(xiàn)跨平臺(tái)圖表框架[10]。

4.5 跨平臺(tái)

HTML5技術(shù)的優(yōu)點(diǎn)在于可以進(jìn)行跨平臺(tái)的使用，現(xiàn)在的智能移動(dòng)終端的普及，以及移動(dòng)互聯(lián)網(wǎng)產(chǎn)業(yè)的快速發(fā)展，越來(lái)越多的人傾向于移動(dòng)端。但是目前不同的移動(dòng)設(shè)備存在著不同的操作系統(tǒng)平臺(tái)，開(kāi)發(fā)過(guò)程中就要開(kāi)發(fā)不同版本的程序，對(duì)于開(kāi)發(fā)者無(wú)疑增加了開(kāi)發(fā)難度和維護(hù)成本?？缙脚_(tái)開(kāi)發(fā)技術(shù)很好的解決了這一問(wèn)題，而且開(kāi)發(fā)成本低于本地應(yīng)用，不同的操作系統(tǒng)上可以擁有統(tǒng)一的用戶(hù)交互體驗(yàn)，對(duì)于開(kāi)發(fā)者而言，將可以把更多的精力專(zhuān)注于創(chuàng)意和應(yīng)用本身[11-12]。

4.6 安全性[13-14]

HTML5是下一代的Web應(yīng)用，它具有許多新的特性，但是新特性的應(yīng)用，也會(huì)帶來(lái)安全性的隱患。比如HTML5中引入新的元素audio、video和新的屬性onerror、autofocus等，由于新的元素和屬性能夠觸發(fā)JavaScript腳本執(zhí)行，如果不對(duì)這些新的元素和屬性的參數(shù)進(jìn)行嚴(yán)格過(guò)濾，那么就有可能引起跨站漏洞。

HTML5的存儲(chǔ)技術(shù)不在使用cookie，而是被Web Storage所取代，使得更加方便Web應(yīng)用，也解決了客戶(hù)端應(yīng)用數(shù)據(jù)存儲(chǔ)問(wèn)題，但是也帶來(lái)了安全的隱患，容易引起信息的泄露。

Web Storage分為sessionStorage和localStorage，localStorage的API都是通過(guò)Javascript提供的，這樣攻擊者可以通過(guò)XSS攻擊竊取信息，所以預(yù)防Web Storage攻擊的辦法如下：第一，不要把重要的數(shù)據(jù)存儲(chǔ)在客戶(hù)端中，而應(yīng)保存在服務(wù)器端；第二，用戶(hù)會(huì)話(huà)還是應(yīng)當(dāng)使用cookie存儲(chǔ)，如果用本地存儲(chǔ)，很容易使得sessionID被竊取，而cookie中的HTTPonly標(biāo)簽可以保護(hù)會(huì)話(huà)的信息。

4.7 系統(tǒng)實(shí)現(xiàn)

高校就業(yè)信息服務(wù)系統(tǒng)開(kāi)發(fā)采用的是ASP.NET MVC框架，利用三層架構(gòu)即表示層、業(yè)務(wù)邏輯層和數(shù)據(jù)訪(fǎng)問(wèn)層，三者之間相互協(xié)作，模型層實(shí)現(xiàn)業(yè)務(wù)邏輯，通過(guò)控制層把業(yè)務(wù)數(shù)據(jù)提交給視圖層進(jìn)行顯示。本系統(tǒng)分層架構(gòu)的時(shí)序圖如圖3所示，從中就可以看出各個(gè)組件之間的交互順序，它清晰、全面地反映出系統(tǒng)中對(duì)象之間的動(dòng)態(tài)協(xié)助。

系統(tǒng)用戶(hù)通過(guò)視圖頁(yè)面輸入數(shù)據(jù)并提交請(qǐng)求，ASP.NET MVC框架的路由映射組件接收該請(qǐng)求并進(jìn)行解析，通過(guò)ControllerFactory轉(zhuǎn)到相應(yīng)控制器中的Action方法，Action方法調(diào)用相應(yīng)的業(yè)務(wù)邏輯組件處理該請(qǐng)求，業(yè)務(wù)邏輯組件通過(guò)調(diào)用相應(yīng)的數(shù)據(jù)訪(fǎng)問(wèn)組件獲得業(yè)務(wù)數(shù)據(jù)，數(shù)據(jù)訪(fǎng)問(wèn)組件直接對(duì)數(shù)據(jù)庫(kù)進(jìn)行操作，該請(qǐng)求處理后的結(jié)果數(shù)據(jù)返回給控制器，控制器調(diào)用相應(yīng)的視圖，輸出顯示，則該用戶(hù)請(qǐng)求響應(yīng)結(jié)束。

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

本文通過(guò)需求分析、系統(tǒng)設(shè)計(jì)、數(shù)據(jù)庫(kù)設(shè)計(jì)、HTML5的研究等，實(shí)現(xiàn)了基于HTML5高校就業(yè)信息服務(wù)管理系統(tǒng)，基本能夠達(dá)到預(yù)期的目標(biāo)，系統(tǒng)能夠正常使用，方便了就業(yè)工作人員，大大提高了高校畢業(yè)工作的效率，同時(shí)也使得學(xué)生能及時(shí)了解到最新招聘信息，企業(yè)用戶(hù)能夠招聘到所需要的人才。隨著高校畢業(yè)生人數(shù)逐年增加，亟需就業(yè)系統(tǒng)的管理。未來(lái)就業(yè)系統(tǒng)若能夠與移動(dòng)端相結(jié)合，將會(huì)使學(xué)生更加方便、快捷的了解招聘信息。

參考文獻(xiàn)（References）：

[1] 王洋，朱方.對(duì)高校就業(yè)信息網(wǎng)建設(shè)問(wèn)題的分析及建議[J].北

京城市學(xué)院學(xué)報(bào)，2008.4：48-52

[2] 彭宇.畢業(yè)生就業(yè)信息網(wǎng)的總體設(shè)計(jì)[J].中山大學(xué)學(xué)報(bào)（自然

科學(xué)版），2009.48：201-203，206

[3] 蘭義湧.基于 B/S 結(jié)構(gòu)的高校就業(yè)工作信息化建設(shè)[J].中央

民族大學(xué)學(xué)報(bào)（自然科學(xué)版），2010.19（1）：63-66

[4] 游金崇.基于B/S模式的高校畢業(yè)生就業(yè)信息服務(wù)平臺(tái)設(shè)計(jì)[J].

西安電子科技大學(xué)，2014.

[5] 李園，陳世平.MVC設(shè)計(jì)模式在ASP.NET平臺(tái)中的應(yīng)用[J].

計(jì)算機(jī)工程與設(shè)計(jì)，2009.30（13）：3180-3184

[6] 秦冠男.基于ASP.NET MVC框架的IT管理系統(tǒng)的設(shè)計(jì)[J].

上海交通大學(xué)，2012.

[7] 楊嵩，劉新偉.數(shù)據(jù)庫(kù)連接[J].西南工業(yè)大學(xué)學(xué)報(bào)，2003.12（3）.

[8] 王能斌.數(shù)據(jù)庫(kù)系統(tǒng)原理[J].電子工業(yè)出版社，2000.

[9] 鄭培純.基于HTML5的多媒體播放網(wǎng)站[J].吉林大學(xué)，2014.

[10] 趙嵐.基于HTML5的跨平臺(tái)圖表框架的設(shè)計(jì)與實(shí)現(xiàn)[J].華

中科技大學(xué)，2014.

[11] 李張永，陳和平，顧進(jìn)廣.跨平臺(tái)移動(dòng)Web開(kāi)發(fā)框架與數(shù)據(jù)

交互方法[J].計(jì)算機(jī)工程與設(shè)計(jì)，2014，35（05）：1827-1832

[12] 常聞?dòng)?基于HTML5跨平臺(tái)技術(shù)在視頻點(diǎn)播系統(tǒng)中的研

究與應(yīng)用[J].東華大學(xué)，2013.

[13] 孫松柏.HTML5安全研究[J].計(jì)算機(jī)應(yīng)用與軟件，2013.30

（3）：1-6

[14] 華晨，施化吉.客戶(hù)端HTML5的安全研究[J].電子設(shè)計(jì)工

程，2014.22（22）：11-13