王亞林

【摘 要】隨著國家經(jīng)濟(jì)的迅猛發(fā)展，人們對于科技的需求越來越高，因此，我們要不斷的研發(fā)新的科技產(chǎn)品，目前主要的研發(fā)對象是手機(jī)網(wǎng)站。如何研發(fā)一種外觀時(shí)尚，功能完備的手機(jī)網(wǎng)站，是我們面臨的挑戰(zhàn)。我們可以分析目前的開發(fā)主流技術(shù)移動(dòng)Web的基礎(chǔ)上，采用MVC4、Entity Framework以及jQuery Mobile等技術(shù)實(shí)現(xiàn)手機(jī)課程網(wǎng)站。這種手機(jī)網(wǎng)站的界面非常的簡約美觀，使用起來也非常的方便，其兼容性也高，這種技術(shù)已經(jīng)落實(shí)到了南京理工大學(xué)泰州科技學(xué)院，激發(fā)了學(xué)生的學(xué)習(xí)熱情，提高了教學(xué)質(zhì)量。

【關(guān)鍵詞】移動(dòng)Web；快速開發(fā)

一、引言

隨著國家網(wǎng)絡(luò)技術(shù)的不斷發(fā)展，移動(dòng)網(wǎng)絡(luò)和智能終端也得到了快速的發(fā)展。在訪問方式以及用戶體驗(yàn)上移動(dòng)Web都有了質(zhì)的飛躍，而那些傳統(tǒng)的網(wǎng)站已經(jīng)不能滿足移動(dòng)終端的訪問需求，如果用手機(jī)去訪問傳統(tǒng)網(wǎng)站，就會(huì)出現(xiàn)亂碼、不能兼容等問題。技術(shù)家在解決這個(gè)問題時(shí)提出了多個(gè)方面的意見：從系統(tǒng)架構(gòu)方面來說，MVC（模型-視圖-控制）的模式可以快速構(gòu)建有效的移動(dòng)Web架構(gòu)當(dāng)用戶使用時(shí)，提高了網(wǎng)站的復(fù)用，縮減了代碼量；從前端開發(fā)語言方面來說，HTML5及CSS3不僅保存了原有的優(yōu)勢還增加了一些新的元素用來適應(yīng)新的移動(dòng)Web的開發(fā)；從開發(fā)工具方面來說，新型的技術(shù)工具從不同的方面推動(dòng)了移動(dòng)Web的開發(fā)，比如Phone Gap、Mobl-lang 等技術(shù)，它們擁有跨平臺(tái)、快速保存、隨時(shí)測試的特性。本文通過分析目前的開發(fā)主流技術(shù)移動(dòng)Web的基礎(chǔ)上，采用MVC4、Entity Framework以及jQuery Mobile等技術(shù)實(shí)現(xiàn)手機(jī)課程網(wǎng)站，這種手機(jī)網(wǎng)站的界面不但美觀而且還十分容易操作。

二、快速開發(fā)方案分析與設(shè)計(jì)

之前的手機(jī)網(wǎng)站一般以WAP協(xié)議為基礎(chǔ)，之前通過采用WML無線標(biāo)記語言來編寫，到WAP2.0采用XHTML-MP可擴(kuò)展標(biāo)記語言概要來編寫，文字語言和簡單的圖片信息是主要的表現(xiàn)形式，這種網(wǎng)站在開發(fā)效率和用戶體驗(yàn)上都比不上以HTTP協(xié)議為依據(jù)、采用HTML超文本標(biāo)記語言來編寫的網(wǎng)站。目前的智能終端已經(jīng)被逐步普及，單純的WAP站點(diǎn)將會(huì)逐漸被社會(huì)淘汰，以HTML5開發(fā)的移動(dòng)網(wǎng)站將會(huì)成為主流趨勢，由于智能終端可以輕易的訪問傳統(tǒng)網(wǎng)站，所以在開發(fā)傳統(tǒng)網(wǎng)站使用的方法也可以用在開發(fā)移動(dòng)網(wǎng)站上。

（一）主體框架方案分析

NET和J2EE這兩個(gè)大的開發(fā)平臺(tái)是開發(fā)移動(dòng)Web的主要技術(shù)，不同的開發(fā)平臺(tái)有不同的網(wǎng)站開發(fā)方案。依據(jù)J2EE平臺(tái)構(gòu)建的SSH框架，用戶可以將搭建PC網(wǎng)站的方法用在搭建移動(dòng)網(wǎng)站上，技術(shù)開發(fā)者只需要關(guān)注如何可以讓網(wǎng)站界面簡約美觀以及用戶在使用的時(shí)候如何可以簡化操作，如何使功能更加齊全。但是技術(shù)者在使用J2EE開發(fā)平臺(tái)的時(shí)候，需要有足夠的專業(yè)知識(shí)，因?yàn)槠浼夹g(shù)要求比較高，開發(fā)環(huán)境的搭建和開發(fā)工具的操作都比較復(fù)雜。此外，與J2EE這種重量級(jí)的開發(fā)平臺(tái)相比，微軟提供了一種比較簡單的，比較適合初學(xué)者學(xué)習(xí)的開發(fā)工具和開發(fā)框架。Visual Studio就是微軟提供的一套開發(fā)工具集其內(nèi)容十分豐富而且功能十分強(qiáng)大，可以用來全面的開發(fā)移動(dòng)Web和HTML5，而且還提供了很多的高級(jí)開發(fā)工以及開發(fā)的框架，比如：Entity Framework和MVC4等，技術(shù)開發(fā)者可以利用這些豐富的框架進(jìn)行快Web應(yīng)用程序的構(gòu)建以及測試和發(fā)布。

（二）前端方案分析

在進(jìn)行框架的搭建時(shí)，設(shè)計(jì)網(wǎng)頁是移動(dòng)網(wǎng)站開發(fā)的主要工作。在開發(fā)移動(dòng)Web前端方案中，主要的方案有：借用第三方UI框架模式、單頁面應(yīng)用設(shè)計(jì)模式和響應(yīng)式設(shè)計(jì)模式。

（三）方案設(shè)計(jì)

從上面分析和講解來看，本篇文章提出了一種技術(shù)方案在快速開發(fā)移動(dòng)Web的過程中：網(wǎng)站的架構(gòu)可以使用NET MVC4 框架，數(shù)據(jù)訪問可以使用ADO.NET Entity Framework，UI框架可以使用jQuery Mobile。

三、系統(tǒng)分析與設(shè)計(jì)

本篇文章設(shè)計(jì)并且實(shí)現(xiàn)移動(dòng)課程網(wǎng)站，可以和傳統(tǒng)的網(wǎng)絡(luò)課程進(jìn)行互補(bǔ)，改善傳統(tǒng)的課程網(wǎng)站，這樣的話，學(xué)生只要有一部智能手機(jī)，即使是一部非常普通的手機(jī)都可以隨時(shí)隨地的進(jìn)行課程網(wǎng)站的訪問，可以查看教學(xué)內(nèi)容，可以提問，可以討論，這樣不但利用了閑暇的時(shí)間還提高了學(xué)生的學(xué)習(xí)熱情，提高了學(xué)習(xí)質(zhì)量。

（一）系統(tǒng)需求

在傳統(tǒng)的課程網(wǎng)站里我們的移動(dòng)課程網(wǎng)站也可以繼承它的一些功能，而對于移動(dòng)課程網(wǎng)站需要不斷擴(kuò)展可以適應(yīng)移動(dòng)終端的訪問，需要讓移動(dòng)界面可以兼容不同的移動(dòng)瀏覽器并且還要讓操作簡單方便。發(fā)布課程內(nèi)容，整理課程資料，解答課程提問等內(nèi)容是移動(dòng)課程網(wǎng)站的核心功能。

（二）系統(tǒng)設(shè)計(jì)

第一、主體框架設(shè)計(jì)?？梢圆捎媒?jīng)典的MVC架構(gòu)進(jìn)行主體框架的設(shè)計(jì)，可以利用Entity Framework 進(jìn)行對象關(guān)系的映射，建立完善的數(shù)據(jù)庫?？梢詫⑦壿嫶a以及數(shù)據(jù)庫的操作放到控制器內(nèi)，在SQL數(shù)據(jù)庫中存放網(wǎng)站的主要數(shù)據(jù)，可以將課件資料等文件存放到Web服務(wù)器上。第二、前端框架設(shè)計(jì)?？梢栽谝晥D中引進(jìn)jQuery和jQuery Mobile庫，可以開發(fā)出簡約美觀的界面，可以采用它所提供的AJAX異步JavaScript和XML工作機(jī)制，在頁面進(jìn)行交互的時(shí)候可以實(shí)現(xiàn)部分刷新，減少庫文件的重復(fù)加載以及重復(fù)的代碼從而節(jié)約流量。第三、開發(fā)環(huán)境及部署。Visual Studio2013和SQL Server2012是開發(fā)環(huán)境需要安裝的，NET Framework4.0，IIS6.0和SQL Server2012是部署環(huán)境需要安裝的。

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

（一）實(shí)體模型的實(shí)現(xiàn)

Entity Framework采用了一種抽象化的數(shù)據(jù)結(jié)構(gòu)方式，把每一個(gè)數(shù)據(jù)庫對象都轉(zhuǎn)化成應(yīng)用程序?qū)ο?，把?shù)據(jù)字段都轉(zhuǎn)化成屬性，關(guān)系都轉(zhuǎn)化成結(jié)合屬性，把數(shù)據(jù)庫的E/R模型轉(zhuǎn)化成對象模型。

（二）視圖的實(shí)現(xiàn)

視圖主要通過顯示界面，可以利用Razor視圖引擎來減低界面和顯示邏輯的耦合度。如果想要快速的開發(fā)出兼容性高且美觀的頁面就需要技術(shù)者引進(jìn)jQuery Mobile庫。

（三）控制器的實(shí)現(xiàn)

響應(yīng)用戶的請求是控制器的主要工作，控制器在MVC4的框架中被定義為繼承自Controller基類的類，一個(gè)控制器類可以有很多個(gè)Action，不同的Action有自己對應(yīng)的一個(gè)方法。

（四）實(shí)現(xiàn)效果

在網(wǎng)站的首頁顯示的是院系列表，顯示院系所開的課程，對于訪問量可以按降序進(jìn)行排列。用戶點(diǎn)了某個(gè)院系，就可以直接訪問該院系的課程列表。在個(gè)人信息的頁面，用戶可以設(shè)置密碼來保護(hù)自己的信息。老師進(jìn)入頁面之后可以查看自己的課程狀況，可以新建、修改或者刪除課程的內(nèi)容。網(wǎng)站的頁面整體布局十分干凈簡潔，功能齊全，操作簡單方便，可以滿足學(xué)生的學(xué)習(xí)需求，可以提高學(xué)生的學(xué)習(xí)質(zhì)量，激發(fā)學(xué)生的學(xué)習(xí)熱情。

五、結(jié)語

綜上所述，本篇文章通過分析快速開發(fā)移動(dòng)Web的主要技術(shù)，提出了一系列的建議，從頁面設(shè)計(jì)到系統(tǒng)的實(shí)現(xiàn)都做出了介紹。開發(fā)移動(dòng)Web是主流趨勢，是當(dāng)代學(xué)生學(xué)習(xí)的重要工具。們可以分析目前的開發(fā)主流技術(shù)移動(dòng)Web的基礎(chǔ)上，采用MVC4、Entity Framework以及jQuery Mobile等技術(shù)實(shí)現(xiàn)手機(jī)課程網(wǎng)站，這種手機(jī)網(wǎng)站的界面非常的簡約美觀，使用起來也非常的方便，其兼容性也高，這種技術(shù)已經(jīng)落實(shí)到了南京理工大學(xué)泰州科技學(xué)院，激發(fā)了學(xué)生的學(xué)習(xí)熱情，提高了教學(xué)質(zhì)量。

【參考文獻(xiàn)】

[1]徐尤華，熊傳玉.Query Mobile 1.2移動(dòng)Web開發(fā)方法研究[J].信息技術(shù)，2013

[2]朱贇，王玉善.跨平臺(tái)移動(dòng)開發(fā)技術(shù)jQuery Mobile的應(yīng)用分析[J].福建電腦，2013

[3]錢海軍.基于HTML5移動(dòng)Web頁面開發(fā)技術(shù)研究[J].電腦與信息技術(shù)，2013