楊曉亮 呂靜峰

摘 要：隨著移動通信技術的發(fā)展，越來越多的人使用移動終端進行通信和工作。普通高校的服務對象是在校大學生，他們是當前社會的主流力量，也是手機用戶的大群體，所以，普通高校對現(xiàn)有網(wǎng)站服務的升級換代，有著重要的意義。本文結合學院現(xiàn)有教務管理系統(tǒng)，對基于Android系統(tǒng)開發(fā)移動Web教務管理應用的實現(xiàn)技術進行了分析和探討。

關鍵詞：移動 ;Web;教務管理;頁面

【中圖分類號】G【文獻標識碼】B

【文章編號】1008-1216（2019）10B-0023-02

隨著移動通信技術的發(fā)展，越來越多的人使用移動終端進行通信和工作。2018年，移動電話用戶總數(shù)達到15.7億戶[1]，而92%以上的智能手機使用的是Android系統(tǒng)，所以對基于Android系統(tǒng)的移動Web應用進行研究具有重要的意義。高校師生使用移動終端的通信和工作，可以提高工作效率。目前高校的網(wǎng)站服務大部分只針對計算機終端，對手機支持功能不是太好。所以，普通高校對現(xiàn)有網(wǎng)站服務的升級換代，可以提高和改善高校師生使用體驗，提高管理效率。本文以教材管理為例，介紹基于Android系統(tǒng)的移動Web開發(fā)在教務管理中的實現(xiàn)需要注意的幾點問題。

一、現(xiàn)有教務管理系統(tǒng)分析

現(xiàn)有的教務管理系統(tǒng)是由比較前沿的HTML5開發(fā)的計算機端的Web頁面，對移動設備顯示支持不是太好，學校未采購教材管理模塊。

現(xiàn)有教務管理系統(tǒng)能夠很好地支持學院教學業(yè)務的正常運轉(zhuǎn)，各系統(tǒng)功能模塊劃分合理，數(shù)據(jù)表之間邏輯關系清晰，基礎數(shù)據(jù)完整有效。在開發(fā)移動Web時，可以借鑒現(xiàn)有教務管理系統(tǒng)的業(yè)務流程和基礎數(shù)據(jù)。

二、移動Web開發(fā)與傳統(tǒng)網(wǎng)站開發(fā)的對比

Web開發(fā)分為前端開發(fā)和后臺開發(fā)兩個部分。在后臺開發(fā)方面，傳統(tǒng)網(wǎng)站和移動Web區(qū)別不大，可以選用自己熟悉的語言和環(huán)境進行開發(fā)。傳統(tǒng)網(wǎng)站和移動Web的主要區(qū)別是在前端開發(fā)部分。

（一）應用場景

傳統(tǒng)網(wǎng)站的前端開發(fā)主要指計算機端網(wǎng)頁的開發(fā)，頁面主要是運行在計算機端瀏覽器中。移動Web前端頁面主要是運行在移動端，如Android手機上。

（二）新技術支持

移動Web前端頁面主要用HTML5、CSS3、JavaScript與jQuery開發(fā)，移動端瀏覽器主要以webkit內(nèi)核為主，對于HTML5的新特性能夠很好的支持;傳統(tǒng)網(wǎng)站的前端開發(fā)需要兼容IE等老版本瀏覽器，不能很好地支持新技術的4F7F用。

（三）頁面的適配性不同

傳統(tǒng)網(wǎng)站的前端開發(fā)頁面一般都會選擇給頁面設定一個固定寬度，兩側(cè)有留白，但是移動Web前端頁面由于手機屏幕比計算機顯示器要小很多，會選擇在手機屏幕上顯示盡可能多的內(nèi)容，因此，移動Web頁面要能夠充分適應各種屏幕尺寸的手機并進行最大程度的利用。從這一點上來說移動端頁面的適配難度更高一些。

（四）頁面的性能不同

計算機端的網(wǎng)絡情況一般比較穩(wěn)定，都是通過網(wǎng)線或者Wi-Fi連接網(wǎng)絡，可以快速加載頁面內(nèi)容;移動端網(wǎng)絡比較復雜，除了Wi-Fi，還有電信運營商提供的移動數(shù)據(jù)連接，存在信號弱等網(wǎng)絡不穩(wěn)定因素，對頁面資源提出要求，頁面太大在惡劣網(wǎng)絡情況下時，將會無法訪問，嚴重影響用戶體驗。

三、移動Web開發(fā)注意事項

通過前面的分析可以知道，移動Web開發(fā)的新特性主要體現(xiàn)在前端頁面開發(fā)上，通過整理，有以下幾個方面需要注意。

（一）多屏幕適配

在使用HTML5開發(fā)移動Web前端頁面時，會遇到幾個容易混淆的概念，開發(fā)時要設置一些參數(shù)，比如物理像素PX、屏幕分辨率、CSS像素、設備獨立像素、設備像素比。只有在清楚以上參數(shù)差別的情況下，才能夠更好地實現(xiàn)多屏幕適配。實現(xiàn)過程中還需要掌握設計圖、倍圖等概念。

（二）和圖形優(yōu)化

因為網(wǎng)絡和移動端自身資源的限制，在設計圖形的格式及顯示效果時，要充分考慮用戶使用的體驗和感受。在網(wǎng)絡環(huán)境不好的情況下，可以用base64代替URL來設置圖片的格式，以節(jié)省網(wǎng)絡請求資源;并采用縮略圖的方式，來減少瞬間大量渲染帶來的負面作用。

（三）加載速度處理

因為網(wǎng)絡和移動端自身資源的限制，移動Web前端頁面除了要重視用戶體驗和豐富的功能外，還需要考慮響應速度、加載速度等多方面的問題。如何讓移動Web前端頁面在移動終端能夠快速加載，就需要選擇合適的開發(fā)方式。目前在這方面人們已經(jīng)做了大量研究，并形成了幾個體系。 其中比較出色的有HTTP壓縮、緩存和差量壓縮等，為移動Web的開發(fā)方式提供了更多的選擇性。HTTP壓縮、緩存屬于傳統(tǒng)減少Web冗余數(shù)據(jù)傳輸?shù)姆椒?，在移動Web開發(fā)上，仍存在一定的局限性。結合移動端自身資源和網(wǎng)絡條件，通過采用離線存儲機制，使移動端滿足移動Web對持久存儲靜態(tài)資源的需求，優(yōu)化移動Web性能，提高加載速度，渲染速度方面有比較明顯的提升。

四、數(shù)據(jù)問題

離線存儲機制提升了加載數(shù)據(jù)速度，減輕服務器端的負擔，但也帶來一些問題。比如，在瀏覽器提交訪問時，先使用被緩存的文件，再檢查 manifest文件是否有更新來決定是否對緩存文件進行更新。這樣訪問的資源可能用的不是最新的版本。

根據(jù)manifest文件的特性，在開發(fā)教材管理模塊時，需要根據(jù)不同操作來設置不同的manifest文件。在聯(lián)網(wǎng)時，教師填報征訂教材信息，瀏覽器就會根據(jù)manifest文件的內(nèi)容下載相應的資源并且進行離線存儲。當教師填報完征訂教材信息時，由于已經(jīng)離線存儲，不需要服務器及時響應，瀏覽器就會使用離線存儲的資源加載頁面，并對比新舊manifest文件，如果manifest文件沒有更改，則加載離線存儲的資源頁面。在離線情況下，若服務器對離線存儲部分的資源進行了更新，但未對manifest文件更新，則顯示本地離線緩存數(shù)據(jù)，瀏覽器不用重新下載資源。如果更新manifest文件，則瀏覽器重新下載文件中資源，并對這些資源進行離線存儲。

manifest文件最好不要設置緩存，因為http的緩存規(guī)則會讓瀏覽器默認原manifest文件在有效期內(nèi)，瀏覽器就會使用離線存儲的資源加載頁面。如需要新資源即時生效，就需要調(diào)用window.applicationCache.swapCache（）來對緩存進行更新，對緩存更新的方法還有更新manifest文件、通過JavaScript操作和清除瀏覽器緩存。

因為現(xiàn)有教務處網(wǎng)站還涉及計算機終端訪問，而傳統(tǒng)網(wǎng)頁不需要設置離線緩存功能，所以數(shù)據(jù)更新時會直接上傳。如果教師在兩個終端同時登錄，期間有數(shù)據(jù)變更，就需要區(qū)分上傳數(shù)據(jù)是否已經(jīng)上傳。對數(shù)據(jù)上傳機制需要進行改進，為防止移動端數(shù)據(jù)重復上傳。為解決同一移動端重復上傳數(shù)據(jù)導致主鍵沖突，移動端采取“傳完就刪”的策略。

五、結束語

通過上文分析可以發(fā)現(xiàn)，通過移動Web開發(fā)對現(xiàn)有網(wǎng)站服務的升級換代，可以提高和改善高校師生使用體驗，可以提高管理和工作效率。同時移動Web開發(fā)中有許多需要注意的技術細節(jié)，比如manifest的設置、數(shù)據(jù)上傳的防重設置，如果設置不當，會讓用戶體驗大打折扣。

基金項目：內(nèi)蒙古化工職業(yè)學院自然科學研究項目“高職院校教材管理信息系統(tǒng)的設計與實現(xiàn)”（HYZR1711）。

參考文獻：

[1]李金來，吳濤. 基于 JSON 數(shù)據(jù)交換的移動終端與服務器端異構數(shù)據(jù)庫的數(shù)據(jù)交互[J].現(xiàn)代計算機，2016，（6）.

[2]裴曉霞.新形勢下高校教務管理工作現(xiàn)狀分析及對策探討[J].商業(yè)故事，2018.（4）.

[3]胡睿.淺談高校教務管理工作的特點、問題與對策[J].青年與社會，2018，（31）.

[4]李金陽.新時期高校教務管理工作面臨的挑戰(zhàn)與對策[J].農(nóng)家參謀，2019，（19）.

[5]池其軍.高校教務管理的現(xiàn)狀及改進措施[J].西部素質(zhì)教育，2016，（24）.

[6]蔡曉坤.高校教務管理信息化和科學化建設研究[J].中國管理信息化，2019，（22）.