基于H5+Android的智慧校園一點(diǎn)通的設(shè)計(jì)與實(shí)現(xiàn)

曹先東 蔡振山 李晴 崔婕 任生花

【摘 要】針對(duì)目前普通高校大學(xué)生在自主管理過(guò)程中出現(xiàn)的“茫忙盲”等較為普遍的問(wèn)題，該文就此提出如何通過(guò)校園移動(dòng)APP提升學(xué)生自主管理能力，以天津職業(yè)技術(shù)師范大學(xué)大學(xué)生群體作為主要研究對(duì)象，以基于H5+Android的智慧校園一點(diǎn)通APP作為載體工具，通過(guò)使用該款A(yù)PP，對(duì)使用者的自我管理能力方面進(jìn)行分析研究，從而正確引導(dǎo)大學(xué)生正確使用校園移動(dòng)APP，營(yíng)造積極向上的校園氛圍。

【Abstract】In view of the common problems exiting in the self-management process of college students in regular colleges and universities， such as vacant， bustle without plan or purpose and blindness， the paper puts forward to improve students' self-management ability through campus mobile APP. Taking the college students in Tianjin University of Technology and Education as the main research object， and the smart campus one-click based on the H5+Android as the carrier tool， we analyze and study the self-management ability of users through using this APP， so as to guide college students to use campus mobile APP correctly， and create a positive campus atmosphere.

【關(guān)鍵詞】自主管理；校園移動(dòng)APP；H5；Android

【Keywords】self-management； campus mobile APP； H5； Android

【中圖分類(lèi)號(hào)】TP311.5 【文獻(xiàn)標(biāo)志碼】A 【文章編號(hào)】1673-1069（2018）11-0191-03

1 背景

1.1 現(xiàn)狀

隨著互聯(lián)網(wǎng)以及移動(dòng)設(shè)備的大范圍普及，手機(jī)等移動(dòng)設(shè)備已然成為大學(xué)生的必備品之一[1]。同時(shí)手機(jī)應(yīng)用商店里的APP也以較快的速度增長(zhǎng)著，琳瑯滿(mǎn)目的APP極大地滿(mǎn)足了大學(xué)生對(duì)于娛樂(lè)生活的體驗(yàn)，但是單一的APP功能越來(lái)越不能滿(mǎn)足大學(xué)生全方面的需求[2]。如國(guó)外的Twitter、FaceBook等APP滿(mǎn)足了大學(xué)生對(duì)于交友途徑的擴(kuò)展，但卻只是局限于此，并沒(méi)有全方面地服務(wù)于大學(xué)生；國(guó)內(nèi)的課程格子，萌小助等應(yīng)用給大學(xué)生查詢(xún)成績(jī)、查課表提供便利，但卻沒(méi)有在大學(xué)生信息獲取方面做更多的深入。本款智慧校園一點(diǎn)通APP的設(shè)計(jì)初衷也是依附于此，以信息的獲取優(yōu)化性上、交流互動(dòng)的便捷性上以及大學(xué)生自主規(guī)劃上的引導(dǎo)性上提供給大學(xué)生更為全方面的服務(wù)。

1.2 調(diào)查數(shù)據(jù)分析

本次調(diào)查為抽樣調(diào)查，調(diào)查主要涉及大學(xué)生關(guān)于使用APP關(guān)注點(diǎn)、在A(yíng)PP上的資訊類(lèi)了解的信息、學(xué)習(xí)類(lèi)了解的信息等相關(guān)問(wèn)題。為了了解大學(xué)生手機(jī)APP使用情況，關(guān)注的范圍及自主管理的方面。以促使廣大學(xué)生樹(shù)立正確的手機(jī)使用觀(guān)，正確的處理學(xué)習(xí)、生活和手機(jī)APP的關(guān)系和提高廣大學(xué)生自我管理的能力。

本次調(diào)查通過(guò)網(wǎng)絡(luò)問(wèn)卷調(diào)查。其中有效問(wèn)卷561份，有效率99%。在學(xué)習(xí)狀態(tài)、使用手機(jī)時(shí)間、資訊類(lèi)關(guān)注點(diǎn)、學(xué)習(xí)類(lèi)關(guān)注點(diǎn)了的方面等進(jìn)行了調(diào)查統(tǒng)計(jì)。就此得出大部分大學(xué)生使用手機(jī)的時(shí)長(zhǎng)都集中在2-8小時(shí)之間，顯而易見(jiàn)手機(jī)占據(jù)著大學(xué)生的大部分日常生活，因此大學(xué)生處理好手機(jī)與生活的關(guān)系是有很必要的。再之，作為大學(xué)生主要接觸的信息傳播媒介，如何使同學(xué)們正確使用手機(jī)對(duì)于提高學(xué)生的自主管理能力顯得頗為重要。同時(shí)，交友互動(dòng)信息、學(xué)習(xí)信息查詢(xún)、考證、考研信息以及就業(yè)信息等占據(jù)著較高的關(guān)注度。如何讓大學(xué)生在使用手機(jī)的同時(shí)獲取到更多積極有幫助的信息以及在潛移默化中提高自己的自主管理能力，顯得格外重要。就此，我們?cè)诨贖5+Android技術(shù)上開(kāi)發(fā)一款智慧校園APP為我們研究的載體。

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

本次研究的載體為研發(fā)團(tuán)隊(duì)設(shè)計(jì)并實(shí)現(xiàn)了一款基于H5+Android的平臺(tái)設(shè)計(jì)實(shí)現(xiàn)的智慧校園APP，設(shè)計(jì)模式分為服務(wù)器端和客戶(hù)端兩部分。客戶(hù)端通過(guò)Android平臺(tái)提供的WebView函數(shù)接口進(jìn)行web頁(yè)面的承載并通過(guò)Http協(xié)議與服務(wù)端進(jìn)行數(shù)據(jù)通信[3]。服務(wù)器端采用Spring、SpringMVC、Hibernate（俗稱(chēng)SSH框架）作為我們應(yīng)用的主體框架，HTML5，Jquery，Jquery-mobile等開(kāi)源前端技術(shù)作為我們的前臺(tái)高效便捷開(kāi)發(fā)[4]。

2.1 系統(tǒng)架構(gòu)

系統(tǒng)的物理架構(gòu)如圖1所示，客戶(hù)端Android手機(jī)等智能終端通過(guò)移動(dòng)信號(hào)塔、校園網(wǎng)WLAN、Wifi等實(shí)現(xiàn)對(duì)校園服務(wù)器的訪(fǎng)問(wèn)。其中服務(wù)端利用Java語(yǔ)言[5]開(kāi)發(fā)，通過(guò)Http協(xié)議與客戶(hù)器端進(jìn)行網(wǎng)絡(luò)數(shù)據(jù)交換，而Web服務(wù)器通過(guò)Sevlet對(duì)各個(gè)客戶(hù)終端的需求進(jìn)行反映，通過(guò)c3p0產(chǎn)出的連接池對(duì)后臺(tái)數(shù)據(jù)庫(kù)進(jìn)行長(zhǎng)連接訪(fǎng)問(wèn)，完成數(shù)據(jù)的存儲(chǔ)與獲取管理。

2.2系統(tǒng)主要功能設(shè)計(jì)

基于A(yíng)ndroid平臺(tái)的智慧校園系統(tǒng)旨在服務(wù)廣大師生，使全體師生在閑暇時(shí)間通過(guò)移動(dòng)終端就可以方便、快捷、及時(shí)地了解到學(xué)校各類(lèi)信息。服務(wù)器端主要提供各項(xiàng)基礎(chǔ)功能服務(wù)，例如對(duì)整個(gè)系統(tǒng)數(shù)據(jù)信息的接受、存儲(chǔ)、處理，同時(shí)結(jié)合移動(dòng)終端特點(diǎn)升級(jí)改造并整合以往單一的校園服務(wù)系統(tǒng)。客戶(hù)端主要是面向在校學(xué)生，這一系統(tǒng)可為學(xué)生提供校園資訊、成績(jī)查詢(xún)、就業(yè)信息、熱門(mén)話(huà)題等多項(xiàng)功能。

用戶(hù)通過(guò)主界面，可以直觀(guān)看到APP的主要功能。并且可以根據(jù)自己的需求搜索所需信息查詢(xún)。APP設(shè)有一點(diǎn)通搜索功能，在此功能下，用戶(hù)輸入所需查詢(xún)的信息關(guān)鍵字，數(shù)據(jù)庫(kù)將自動(dòng)檢索，反饋給用戶(hù)。這樣，既方便了用戶(hù)查看信息，又方便管理。

3 主要功能的技術(shù)實(shí)現(xiàn)方式

3.1 教務(wù)系統(tǒng)數(shù)據(jù)的安全高效獲取

查詢(xún)功能主要是給廣大師生提供一個(gè)方便快捷的查詢(xún)服務(wù)平臺(tái)，首先利用用戶(hù)輸入的學(xué)號(hào)、密碼等個(gè)人信息獲取數(shù)據(jù)，通過(guò)爬蟲(chóng)技術(shù)處理，收集教務(wù)系統(tǒng)中的成績(jī)、課表、空教室等信息（提取標(biāo)簽之間的文本，對(duì)文本進(jìn)行清理，去掉無(wú)用的樣式和鏈接），轉(zhuǎn)換成Json格式字符串，經(jīng)過(guò)Apache—Tomcat轉(zhuǎn)發(fā)給Web服務(wù)器端，服務(wù)器端再把信息傳給客戶(hù)端供用戶(hù)查看。通過(guò)此種方式學(xué)生只需輸入自己的學(xué)號(hào)和密碼便能很快獲取到自己的相關(guān)信息，省去了登陸教務(wù)系統(tǒng)的麻煩，提高了用戶(hù)的體驗(yàn)感。

3.2 高效輕便緩存用戶(hù)數(shù)據(jù)的方式

系統(tǒng)采用三種高效輕便緩存用戶(hù)數(shù)據(jù)方式。

①cookie存儲(chǔ)會(huì)話(huà)機(jī)制。通過(guò)瀏覽器的cookie將一個(gè)較長(zhǎng)的會(huì)話(huà)存儲(chǔ)在用戶(hù)的瀏覽器中，設(shè)置一個(gè)有效期，當(dāng)用戶(hù)下次打開(kāi)瀏覽器時(shí)，不需要再次輸入賬號(hào)和密碼，通過(guò)緩存的會(huì)話(huà)，從會(huì)話(huà)中獲取學(xué)生的上次會(huì)話(huà)信息，將會(huì)話(huà)中加密的賬號(hào)和密碼再次發(fā)送給服務(wù)器，后臺(tái)服務(wù)器接收到后將數(shù)據(jù)發(fā)送給用戶(hù)，學(xué)生便能很方便的查看自己的成績(jī)、課表等信息。

②Redis數(shù)據(jù)庫(kù)緩存機(jī)制。將上一次用戶(hù)查詢(xún)的數(shù)據(jù)[9]在服務(wù)器端轉(zhuǎn)發(fā)給客戶(hù)端的同時(shí)，再存一份到Redis緩存，并設(shè)置有效期。當(dāng)下次用戶(hù)再次訪(fǎng)問(wèn)時(shí)，首先查詢(xún)Redis數(shù)據(jù)庫(kù)存不存在上次的緩存，如果存在則首先取出Redis數(shù)據(jù)庫(kù)的緩存，反之，則執(zhí)行查詢(xún)的操作再重復(fù)以上的操作。

③API Local Storage。采用H5的新特性API Local Storage，Web瀏覽器本地?cái)?shù)據(jù)庫(kù)，主要作用是將數(shù)據(jù)保存在客戶(hù)端中。在移動(dòng)中，由于大部分瀏覽器都兼容Local Storage特性，因此在A(yíng)ndroid和ISO中的web瀏覽器都可以使用，那么我們?cè)趺磳?shí)現(xiàn)的呢？首先當(dāng)用戶(hù)第一次查詢(xún)的是時(shí)候，將服務(wù)器處理的數(shù)據(jù)保存在Redis緩存中，同時(shí)轉(zhuǎn)發(fā)給前臺(tái)后，也保存在本地的web數(shù)據(jù)庫(kù)中。當(dāng)用戶(hù)下次查詢(xún)時(shí)首先檢索本地的數(shù)據(jù)庫(kù)，當(dāng)本地?cái)?shù)據(jù)庫(kù)不存在我們想獲取的K-V對(duì)時(shí)，我們?cè)購(gòu)腞edis緩存中進(jìn)行檢索，如果還是不存在時(shí)，我們可以重新進(jìn)行抓取數(shù)據(jù)并執(zhí)行之前的第一步操作。

3.3 利用CDN實(shí)現(xiàn)靜態(tài)網(wǎng)站資源的加速原理

3.3.1 CDN工作流程

①用戶(hù)向 www.xxx.cn 下的某圖片資源，如 1.jpg 發(fā)起請(qǐng)求，先要向 Local DNS 發(fā)起域名解析請(qǐng)求；

②當(dāng)Local DNS解析www.xxx.com時(shí)，會(huì)發(fā)現(xiàn)已經(jīng)配置了CNAME www.test.com.cdn.dnsv1.com，解析請(qǐng)求會(huì)發(fā)送至Remote DNS，會(huì)為請(qǐng)求分配最佳節(jié)點(diǎn)IP；

③Local DNS 獲取 Remote DNS返回的解析 IP；

④用戶(hù)獲取解析 IP；

⑤用戶(hù)向獲取的 IP 發(fā)起對(duì)資源 1.jpg 的訪(fǎng)問(wèn)請(qǐng)求；

⑥若該 IP 對(duì)應(yīng)的節(jié)點(diǎn)緩存有 1.jpg，則會(huì)將數(shù)據(jù)直接返回給用戶(hù)（10），此時(shí)請(qǐng)求結(jié)束。若該節(jié)點(diǎn)未緩存 1.jpg，則節(jié)點(diǎn)會(huì)向業(yè)務(wù)源站發(fā)起對(duì) 1.jpg 的請(qǐng)求（6、7、8），獲取資源后，結(jié)合用戶(hù)自定義配置的緩存策略，將資源存儲(chǔ)（9），并返回給用戶(hù)（10），此時(shí)請(qǐng)求結(jié)束。

通過(guò)CDN技術(shù)，極大的提高了網(wǎng)頁(yè)資源獲取的速度，同時(shí)使用戶(hù)的流量費(fèi)用也得到了極大的減少，讓在校學(xué)生在享受高速信息檢索的同時(shí)可以享受低成本的指出。

3.3.2 cdn技術(shù)分析

CDN技術(shù)通過(guò)系統(tǒng)總端對(duì)各個(gè)分系統(tǒng)的內(nèi)容分發(fā)并使得分系統(tǒng)加以緩存，來(lái)為用戶(hù)匹配最近相鄰的分緩存系統(tǒng)，從而將緩存系統(tǒng)中的數(shù)據(jù)直接傳送至用戶(hù)手中，完全避免了復(fù)雜和冗長(zhǎng)的傳輸線(xiàn)路，大大提速了交換速率和系統(tǒng)性能。

4 結(jié)語(yǔ)

基于H5+Android的智慧校園一點(diǎn)通APP是將目前流行的移動(dòng)APP技術(shù)引入普通高校教育領(lǐng)域中大學(xué)生實(shí)現(xiàn)自主管理的一種技術(shù)變革式創(chuàng)新，同時(shí)，在輔助大學(xué)生提高自我管理能力的過(guò)程中，又為高校管理者提供了較為可靠的管理模式。雖然該款A(yù)PP在內(nèi)測(cè)期間仍存在一些問(wèn)題，但是還是受到了大部分測(cè)試者的鼓勵(lì)與支持。實(shí)現(xiàn)校園移動(dòng)化的管理也是一個(gè)必然的發(fā)展趨勢(shì)，本系統(tǒng)也將繼續(xù)根據(jù)師生的使用反饋情況不斷的優(yōu)化調(diào)整，為學(xué)生提供一個(gè)更便捷的交流平臺(tái)，提高大學(xué)生的自主管理能力和校園內(nèi)有效信息的傳播效率，進(jìn)一步完善學(xué)校智能化建設(shè)。

【參考文獻(xiàn)】

【1】中國(guó)電子信息產(chǎn)業(yè)發(fā)展研究院.賽迪顧問(wèn)股份有限公司.中國(guó)移動(dòng)互聯(lián)網(wǎng)產(chǎn)業(yè)發(fā)展及應(yīng)用實(shí)踐[M].電子工業(yè)出版社，2014：115-116

【2】李柯全.構(gòu)建跨平臺(tái)APP JQuery Mobile移動(dòng)應(yīng)用實(shí)戰(zhàn)[M].清華大學(xué)出版社，2014：21-22.

【3】陳德春.Android優(yōu)化技術(shù)詳解[M].清華大學(xué)出版社，2014：118-119.

【4】林瓏.HTML5移動(dòng)Web開(kāi)發(fā)實(shí)戰(zhàn)詳解[M].清華大學(xué)出版社，2015：363.

【5】劉吉昆，劉青.重塑用戶(hù)體驗(yàn) 卓越設(shè)計(jì)實(shí)踐指南[M].清華大學(xué)出版社，2010：52-53.