基于HTML5的高校易交流平臺的設(shè)計與實現(xiàn)

何星宇，孫 瑜（通信作者）

（云南師范大學(xué) 云南 昆明 650500）

0 引言

隨著移動互聯(lián)網(wǎng)的快速發(fā)展和移動智能設(shè)備的普及，基于HTML5技術(shù)的移動交流平臺大量涌現(xiàn)，強(qiáng)大的功能、便捷的特性使其成為了高校信息交流的重要工具。傳統(tǒng)高校信息交流平臺中，以第三方為信息傳播媒介，通過“信息＋交流”的業(yè)務(wù)模式基本滿足了大學(xué)生群體信息交流需求，但總體來看依然存在諸多問題。（1）信息時效性：依托于第三方發(fā)布的信息無法保證其時效性，會使部分信息失去價值。（2）信息安全性：信息的匿名發(fā)布無形中提高了信息風(fēng)險。（3）信息查詢：當(dāng)用戶在查詢歷史信息時，龐大的信息數(shù)據(jù)量讓查找成為困難。近年來，大學(xué)生信息交流平臺的開發(fā)技術(shù)逐漸從傳統(tǒng)的B/S架構(gòu)向著適用于移動端使用的APP轉(zhuǎn)變[1]?；诖吮尘暗囊苿有畔⒔涣骷夹g(shù)作為一種新的學(xué)習(xí)模式，可以為移動交流提供高質(zhì)量的移動信息交流資源設(shè)計和相關(guān)研究[2]。近幾年智能終端系統(tǒng)的發(fā)展，興起了python語言開發(fā)、混合開發(fā)模式下的手機(jī)APP開發(fā)以及少部分高成本安卓原生開發(fā)等技術(shù)，如何在縮短開發(fā)時間的前提下保證開發(fā)產(chǎn)品的質(zhì)量，是目前亟需解決的一大問題。

1 系統(tǒng)開發(fā)環(huán)境

本文開發(fā)過程基于Windows 10系統(tǒng)進(jìn)行，采用SSM框架，這一框架主要為運用在企業(yè)開發(fā)過程中，適用于許多主流的運用系統(tǒng)中。以Hbuilder為開發(fā)平臺，在移動應(yīng)用開發(fā)過程中，Hbuilder是一項很具優(yōu)勢的集成開發(fā)軟件。Hbuilder建設(shè)了最全面的HTML以及網(wǎng)頁瀏覽器擴(kuò)展的強(qiáng)大語法庫，讓開發(fā)的過程變得更加精準(zhǔn)。選擇HTML5[3]為語言來編寫程序，大幅增加了適應(yīng)移動終端設(shè)備的功能。表1具體介紹了開發(fā)過程中所有工具及其開發(fā)環(huán)境，可供參考。

表1 操作工具及相關(guān)信息

2 高校易交流APP需求分析

2.1 高校易交流APP概述

高校易交流APP的需求主要來自在校大學(xué)生，目前的大學(xué)群體對兼職、找工作、找對象、失物招領(lǐng)等方面有著顯著需求?，F(xiàn)存的信息交流平臺存在諸多不便的地方，例如：信息的交互性差、龐大的數(shù)據(jù)量讓查找成為困難、信息的準(zhǔn)確性難以確定、信息存在明顯延時等。通過對高校APP的設(shè)計與開發(fā)，希望能夠解決目前現(xiàn)存高校信息交流平臺中存在的問題，提高信息的安全性以及平臺與用戶的交互性，給高校在讀學(xué)生帶來最大的交流便利。

2.2 高校易交流APP可行性分析

所謂可行性分析，就是分析高校易交流APP能否通過最小的代價來實現(xiàn)其最大的價值。就經(jīng)濟(jì)可行性上來說，易交流APP并未選用Native開發(fā)模式，大大節(jié)約了開發(fā)的成本，且在APP后期的運營上，只需要選用價格合適的服務(wù)器即可，在開發(fā)過程中采用了當(dāng)前主流的開源代碼以及框架，這在最大程度上降低了后期運維的復(fù)雜度；就技術(shù)可行性上來說，網(wǎng)絡(luò)上有許多現(xiàn)成的開源代碼和現(xiàn)成的開發(fā)框架，基本具備綠色、直觀、可視化的特點，能最大程度降低了開發(fā)難度，縮短了開發(fā)周期。綜上分析，高校易交流APP具備技術(shù)上的可行性。

2.3 高校易交流APP需求分析

2.3.1 高校易交流APP功能性需求分析

本文的需求分析主要采用問卷調(diào)查的方式和根據(jù)以往高校信息交流平臺的需求使用情況來進(jìn)行分析的，問卷調(diào)查一共發(fā)放了180份，數(shù)據(jù)包含了大一至大四的樣本，主要圍繞著用戶對功能的需求以及建設(shè)意見來進(jìn)行，關(guān)鍵數(shù)據(jù)如圖1所示。

圖1 信息分類、信息需求、使用意愿、現(xiàn)狀問卷調(diào)查結(jié)果

根據(jù)需求分析，設(shè)計上將高校易交流APP進(jìn)行了功能模塊上的劃分，主要設(shè)置有用戶注冊、登錄、發(fā)布信息、刪除信息、搜索信息、評論、點贊等功能，旨在設(shè)計一款具有交互性的交流APP。一份完整的APP，不僅僅需要滿足功能性的需求，更需要滿足非功能性的需求。對于功能性需求來說，用例圖能夠更加直觀地進(jìn)行展示，非功能性描述主要通過文字的分析來進(jìn)行。針對問卷調(diào)查的結(jié)果分析，設(shè)計了以下的用例圖。如圖2所示。

圖2 易交流平臺功能性需求分析

新用戶可以進(jìn)行注冊，注冊成功后即可使用登錄、發(fā)布信息、搜索信息、評論、點贊等功能。除此之外，用戶還可以在個人中心進(jìn)行信息管理。

2.3.2 高校易交流APP非功能性需求分析

APP開發(fā)出來最終要服務(wù)的是用戶，良好的用戶體驗感能夠讓APP得到長久的使用。非功能需求分析是客戶對系統(tǒng)的使用感受的體現(xiàn)。本文主要從安全性和可用性兩個方面進(jìn)行分析。

從APP的安全性方面來分析，APP的受眾主要為高校在讀的學(xué)生，采用MySQL5.7進(jìn)行用戶個人信息的存儲，確保用戶的個人信息不被隨意地泄露出去。

從APP的可用性方面來分析，在開發(fā)過程中用戶界面嚴(yán)格地按照標(biāo)準(zhǔn)的APP界面標(biāo)準(zhǔn)來進(jìn)行設(shè)計與實現(xiàn)的，簡潔美觀的操作界面、良好的交互性符合大眾日常對手機(jī)移動應(yīng)用的使用習(xí)慣，讓用戶更加容易上手使用，優(yōu)秀的可用性讓軟件更能夠普及使用。

3 易交流APP功能模塊設(shè)計

APP的總體設(shè)計主要是對整體進(jìn)行概括及抽象，其中包含了各個部分的聯(lián)系。對APP進(jìn)行整體的設(shè)計有利于提高整體的工作性能。高校易交流平臺采用了MVC標(biāo)準(zhǔn)來進(jìn)行設(shè)計，大大減少了各個部分之間的干擾，從而最大程度提高系統(tǒng)的整體性能。圖3為易交流APP的總體設(shè)計圖。

圖3 總體設(shè)計圖

3.1 需求模塊分析

問卷調(diào)查不同用戶的需求，將需求劃分為三個模塊。以下對三個模塊進(jìn)行具體的分析。

3.1.1 用戶模塊

用戶模塊主要是直線用戶注冊、用戶登錄、用戶注銷、用戶密碼更改等功能。主要的功能描述如表2所示。

表2 用戶模塊功能描述

3.1.2 信息模塊

信息模塊主要包括發(fā)布信息、瀏覽信息、信息分類、信息檢索、刪除信息等操作。主要的功能描述如表3所示。

表3 信息模塊功能描述

3.1.3 圖文模塊

圖文模塊是為了發(fā)布圖文結(jié)合的長篇文章而設(shè)計的模塊，功能上主要包括圖文發(fā)布功能、點贊功能、留言功能。主要的功能描述如表4所示。

表4 圖文模塊功能描述

APP的總體設(shè)計主要是對整體進(jìn)行概括及抽象，其中包含了各個部分的聯(lián)系[4]。對APP進(jìn)行整體的設(shè)計有利于提高整體的工作性能。高校易交流平臺采用了MVC標(biāo)準(zhǔn)來進(jìn)行設(shè)計，大大減少了各個部分之間的干擾，從而最大程度提高系統(tǒng)的整體性能。

3.2 數(shù)據(jù)庫設(shè)計

在高校易交流APP進(jìn)行總體設(shè)計的過程中，數(shù)據(jù)庫的設(shè)計是必不可缺的一個部分[5]，數(shù)據(jù)庫是支撐APP運行的關(guān)鍵。本文參照數(shù)據(jù)庫設(shè)計時的標(biāo)準(zhǔn)進(jìn)行設(shè)計，主要從概念設(shè)計和邏輯設(shè)計兩個部分來進(jìn)行設(shè)計。

3.2.1 數(shù)據(jù)庫概念設(shè)計

是高校易交流APP E-R圖的設(shè)計，其中包括了實體、關(guān)系以及屬性。本E-R圖主要的實體有普通用戶實體、文章分類實體、圖文結(jié)合實體、soulmate實體、失物招領(lǐng)實體、招聘信息共享實體、點贊實體、留言實體等。在每一個實體中都有屬性[6]，由于篇幅有限，在文章中僅僅畫出了關(guān)鍵的屬性。E-R圖可以將各個實體之間完整地連接起來。

圖4 E-R圖

3.2.2 數(shù)據(jù)庫邏輯設(shè)計

數(shù)據(jù)庫的概念設(shè)計主要是構(gòu)建出數(shù)據(jù)庫表的模型[7]，在MySQL中進(jìn)行實際操作時起著關(guān)鍵的指導(dǎo)作用。本文選用信息表進(jìn)行具體闡述，如表5所示。

表5 信息表

4 系統(tǒng)功能測試

本章重點描述各個模塊的測試，展示最終的效果。

4.1 登錄、注冊、主界面設(shè)置

用戶數(shù)注冊的功能設(shè)置賬號密碼的格式及進(jìn)行有效校驗。為了防止用戶注冊結(jié)束后出現(xiàn)忘記密碼的情況，特別設(shè)置了賬戶密碼的提示，檢驗用戶密碼是否符合設(shè)定的格式，密碼復(fù)雜度的設(shè)定有效提高了用戶密碼的安全性，防止出現(xiàn)密碼泄露的風(fēng)險；用戶進(jìn)行登錄時需要輸入用戶名和密碼。僅已經(jīng)注冊成功的用戶可以成功登錄；高校易交流APP的首頁展示了用戶名稱、日期以及APP和核心功能的入口。如圖5所示。

圖5 注冊、登錄、主界面測試

4.2 APP內(nèi)各模塊測試

圖6 為APP主要功能測試，主要包括遇見你的soulmate模塊、招聘信息共享模塊、失物招領(lǐng)模塊、圖文共傳模塊、信息分類匯總模塊，除了以上模塊功能測試外，還對點贊、評論、搜索等基礎(chǔ)操作進(jìn)行了測試，測試結(jié)果顯示，APP功能皆正常且便捷。

圖6 各功能模塊測試

5 總結(jié)與展望

本文針對高校大學(xué)生對便捷信息交流APP的需求，設(shè)計出了一款初步可以簡單使用的APP。設(shè)計與實現(xiàn)過程中，依舊存在不足。從目前APP實現(xiàn)的功能來看，只能提供初步使用。為了實現(xiàn)與用戶更好的交互發(fā)展，還需要做到：進(jìn)一步完善信息類型；提高與用戶的交互性；將學(xué)號作為登錄方式，提高信息安全性；完善信息發(fā)布的基本功能等。