梁 弼，梁臘梅

（1.四川文理學(xué)院 智能制造學(xué)院，四川 達(dá)州635000；2.中共西充縣委黨校，四川 西充637200）

1 引言

互聯(lián)網(wǎng)時(shí)代，網(wǎng)絡(luò)購(gòu)物、網(wǎng)絡(luò)出行、網(wǎng)絡(luò)點(diǎn)餐等已經(jīng)成為人們?nèi)粘Ｉ畹囊徊糠?人們可以通過(guò)網(wǎng)絡(luò)自由、便捷地購(gòu)買自己想穿的服裝、想吃的食品、想用的器具等，各類網(wǎng)店不但方便了人們生活，而且促進(jìn)了經(jīng)濟(jì)快速發(fā)展.糕點(diǎn)作為一種食品越來(lái)越受人們喜歡，生日蛋糕是壽星當(dāng)天必需的糕點(diǎn)，如何購(gòu)買到滿意的糕點(diǎn)對(duì)購(gòu)買者來(lái)說(shuō)非常重要.因此，本文通過(guò)開(kāi)發(fā)一套別具特色的糕點(diǎn)展銷平臺(tái)來(lái)為廣大用戶提供網(wǎng)絡(luò)服務(wù)，讓他們足不出戶就能購(gòu)買到自己想要的美味糕點(diǎn)，從而達(dá)到展示和銷售糕點(diǎn)的目的，并有效提高糕點(diǎn)的銷售量.

本糕點(diǎn)展銷平臺(tái)的主要功能模塊包括瀏覽模塊、購(gòu)買模塊、訂單模塊、推薦模塊和管理模塊等.整個(gè)系統(tǒng)采用多層架構(gòu)設(shè)計(jì)模式，將其劃分為表示層、控制層、業(yè)務(wù)邏輯層、數(shù)據(jù)持久層和數(shù)據(jù)庫(kù)層，并通過(guò)目前主流的 Ajax、HTML5、SSM（SpringMVC＋Spring＋MyBatis）等技術(shù)來(lái)實(shí)現(xiàn).［1］其中，后臺(tái)功能使用SSM框架技術(shù)來(lái)開(kāi)發(fā)，前端主要使用 HTML5、JS、CSS、Ajax等技術(shù)來(lái)實(shí)現(xiàn)，前端與后臺(tái)“握手”則通過(guò)在jQuery中使用Ajax來(lái)向后臺(tái)發(fā)出異步請(qǐng)求，并通過(guò)JSON接受后臺(tái)返回的信息，這便有效提高了糕點(diǎn)展銷平臺(tái)的性能.［1］

2 多層架構(gòu)

目前，國(guó)內(nèi)外主流的分層架構(gòu)體系應(yīng)該是J2EE的多層Web應(yīng)用架構(gòu)，它將整個(gè)Web應(yīng)用系統(tǒng)劃分為表示層、業(yè)務(wù)邏輯層及數(shù)據(jù)持久層，并且每一層分別承擔(dān)特定的任務(wù).［2］其中，表示層用來(lái)接收／響應(yīng)用戶請(qǐng)求，同時(shí)實(shí)現(xiàn)對(duì)數(shù)據(jù)的動(dòng)態(tài)顯示，該任務(wù)一般由Struts、JSP等技術(shù)來(lái)完成；業(yè)務(wù)邏輯層完成應(yīng)用系統(tǒng)具體的業(yè)務(wù)邏輯功能，該任務(wù)主要由Spring、EJB等技術(shù)來(lái)承擔(dān)；而數(shù)據(jù)持久層則完成O－R映射，并以簡(jiǎn)便的方式來(lái)訪問(wèn)后臺(tái)關(guān)系型數(shù)據(jù)庫(kù)，它通過(guò) Hibernate、MyBatis等技術(shù)來(lái)完成.這樣Web應(yīng)用的各層任務(wù)便分別通過(guò)相應(yīng)的技術(shù)來(lái)實(shí)現(xiàn)，并彼此相互協(xié)作一起完成整個(gè)Web應(yīng)用的功能.

因?yàn)檫@種三層架構(gòu)設(shè)計(jì)模式不但有利于項(xiàng)目任務(wù)的分工，而且有利于Web系統(tǒng)后期的開(kāi)發(fā)、部署、維護(hù)和擴(kuò)展，所以目前已廣泛應(yīng)用于各種企業(yè)級(jí)Web應(yīng)用，如在線購(gòu)物平臺(tái)、網(wǎng)上訂票系統(tǒng)等.并且，隨著用戶需求越來(lái)越多，Web系統(tǒng)變得越來(lái)越復(fù)雜，傳統(tǒng)三層架構(gòu)也滿足不了現(xiàn)代Web系統(tǒng)開(kāi)發(fā)的需求，所以我們提出了表示層、控制層、業(yè)務(wù)邏輯層、數(shù)據(jù)持久層和數(shù)據(jù)庫(kù)層五層架構(gòu)模式.［3］并將其應(yīng)用于糕點(diǎn)展銷平臺(tái)，增強(qiáng)其可擴(kuò)展性和可可維護(hù)性等性能，然后通過(guò)當(dāng)前主流的Ajax、SSM等技術(shù)來(lái)實(shí)現(xiàn)，以此證明其可行性.

3 平臺(tái)設(shè)計(jì)

3.1 平臺(tái)構(gòu)架設(shè)計(jì)

本糕點(diǎn)展銷平臺(tái)采用五層架構(gòu)模式來(lái)進(jìn)行設(shè)計(jì)，其多層架構(gòu)設(shè)計(jì)圖如下圖1所示：

圖1 糕點(diǎn)展銷平臺(tái)架構(gòu)圖［4］

由上圖1可知，表示層通過(guò)頁(yè)面Page的方式讓用戶發(fā)送請(qǐng)求給后臺(tái)，并將后臺(tái)傳過(guò)來(lái)的數(shù)據(jù)展現(xiàn)給用戶，從而實(shí)現(xiàn)數(shù)據(jù)可視化，該層功能主要通過(guò)Ajax、Html5、JSP等技術(shù)來(lái)實(shí)現(xiàn).控制層通過(guò)控制器Controller來(lái)接收并處理表示層傳來(lái)的請(qǐng)求信息，同時(shí)也負(fù)責(zé)會(huì)話管理，以及將業(yè)務(wù)邏輯層處理后的結(jié)果返回給表示層，該層功能主要由Spring MVC技術(shù)來(lái)負(fù)責(zé)完成.業(yè)務(wù)邏輯層主要負(fù)責(zé)處理系統(tǒng)的實(shí)際業(yè)務(wù)邏輯功能，如糕點(diǎn)推薦、訂購(gòu)糕點(diǎn)、糕點(diǎn)管理、訂單管理等.這些功能通過(guò)Spring相關(guān)技術(shù)來(lái)實(shí)現(xiàn)，并使用Spring IoC有效管理這些功能所對(duì)應(yīng)的業(yè)務(wù)Bean.數(shù)據(jù)持久層完成對(duì)象關(guān)系映射，實(shí)現(xiàn)數(shù)據(jù)持久化，并負(fù)責(zé)對(duì)后臺(tái)數(shù)據(jù)的CRUD操作，該層功能使用MyBatis技術(shù)來(lái)實(shí)現(xiàn).數(shù)據(jù)庫(kù)層負(fù)責(zé)對(duì)本平臺(tái)數(shù)據(jù)的管理功能，它通過(guò)MySQL數(shù)據(jù)庫(kù)工具來(lái)實(shí)現(xiàn).

3.2 平臺(tái)功能模塊設(shè)計(jì)

本平臺(tái)功能模塊包括前臺(tái)和后臺(tái)模塊.其中，前臺(tái)為普通用戶服務(wù)，主要功能有注冊(cè)登錄、個(gè)人中心、成品展示、糕點(diǎn)推薦、廚藝展示、訂購(gòu)糕點(diǎn)以及費(fèi)用支付等；后臺(tái)面向管理員，其功能主要有用戶管理、糕點(diǎn)管理、訂單管理、圖片管理以及盟友管理等.總的來(lái)講，本糕點(diǎn)展銷平臺(tái)功能設(shè)計(jì)如下圖2所示：

圖2 糕點(diǎn)展銷平臺(tái)功能圖

其中，前臺(tái)的成品展示功能主要展示已做好的精美糕點(diǎn)，其頁(yè)面采用流式布局，通過(guò)點(diǎn)擊圖片可以放大顯示高清糕點(diǎn)效果圖，并以輪播圖模式來(lái)顯示；糕點(diǎn)推薦功能是廚師推薦一些新式糕點(diǎn)，或根據(jù)用戶偏好或營(yíng)養(yǎng)來(lái)為用戶推薦相應(yīng)的糕點(diǎn)，更好地滿足不同用戶需求；友情加盟通過(guò)在地圖上點(diǎn)擊全國(guó)各地區(qū)就可以顯示出地區(qū)的門(mén)店信息，以便于用戶考慮是否加盟該糕點(diǎn)店.后臺(tái)的用戶管理實(shí)現(xiàn)對(duì)注冊(cè)用戶信息的管理，包括用戶每次購(gòu)買糕點(diǎn)后所獲得積分管理、會(huì)員等級(jí)管理、會(huì)員特權(quán)管理等；訂單管理主要對(duì)用戶購(gòu)買糕點(diǎn)產(chǎn)生訂單時(shí)初始狀態(tài)為未發(fā)貨，店家發(fā)貨后狀態(tài)更改為已發(fā)貨，最后用戶收貨后狀態(tài)更改為已收貨，并歸檔訂單；糕點(diǎn)管理完成對(duì)不同糕點(diǎn)的增加、修改和刪除操作，時(shí)刻滿足用戶不同的需求；銷售管理通過(guò)使用Echarts圖統(tǒng)計(jì)各種糕點(diǎn)的銷售情況，方便商家考慮以后售賣糕點(diǎn)類型，進(jìn)而提高其銷售量.

4 平臺(tái)實(shí)現(xiàn)

本糕點(diǎn)展銷平臺(tái)根據(jù)其架構(gòu)設(shè)計(jì)依次按照表示層、控制層、業(yè)務(wù)邏輯層、數(shù)據(jù)持久層和數(shù)據(jù)庫(kù)層來(lái)實(shí)現(xiàn)其相應(yīng)的功能.

4.1 表示層

本糕點(diǎn)展銷平臺(tái)的表示層主要使用Ajax、HTML5以及jQuery代碼庫(kù)等來(lái)實(shí)現(xiàn)，通過(guò)這些前端技術(shù)輕松便捷地將后臺(tái)返回的數(shù)據(jù)顯示給用戶.其中，顯示糕點(diǎn)銷售情況還采用Echarts設(shè)計(jì)模板，它將糕點(diǎn)數(shù)據(jù)相關(guān)信息從后臺(tái)數(shù)據(jù)庫(kù)取出后賦給Echarts模板，頁(yè)面上便可以快速顯示出糕點(diǎn)的統(tǒng)計(jì)結(jié)果，其實(shí)現(xiàn)過(guò)程如下：

首先，基于準(zhǔn)備好的dom，初始化echarts實(shí)例.

var myChart ＝ echarts.init（document.getElementById（＇main－line＇））；

＃foreach（＄num in＄list）＄num.jy＿num，＃end

然后，使用指定的配置項(xiàng)和數(shù)據(jù)顯示圖表.

myChart.setOption（｛

title：｛text：＇SweetPastry＇｝，tooltip：｛｝，egend：｛data：［＇銷量＇］，

xAxis：｛data：［＃foreach（＄num in＄list）＄num.jy＿num，＃end］，

yAxis：｛｝，

series：［｛ame：＇銷量＇，type：＇bar＇，ata：［＃foreach（＄num in ＄list）＇＄num.zy＇，＃end］］……

最后的運(yùn)行效果如下圖3所示：

圖3 Echarts統(tǒng)計(jì)顯示糕點(diǎn)銷售量［5］

4.2 控制層

本糕點(diǎn)展銷平臺(tái)的控制層使用Spring MVC來(lái)實(shí)現(xiàn)，而且Spring MVC所實(shí)現(xiàn)的代碼具有良好的擴(kuò)展性.該層處于表示層和業(yè)務(wù)邏輯層之間，主要通過(guò)Controller來(lái)完成對(duì)請(qǐng)求數(shù)據(jù)的控制轉(zhuǎn)發(fā)，以下為訂單控制器的核心代碼：

＠Controller

＠RequestMapping（ "／order "）

public class OrderController｛

＠Resource

OrderService orderService；……

＠RequestMapping（ "／inall－order "）

public ModelAndView inAllOrder（Model model，＠RequestParam （value＝ "currentPage "，defaultValue＝ "1 "）int currentPage）｛

PageHelper.startPage（currentPage，6）；

List＜Map＜String，Object＞＞list＝orderService.getAllOrder（）；

PageInfo pageInfo＝new PageInfo（list，6）；

model.addAttribute（ "page " ，pageInfo）；

ModelAndView view ＝ new ModelAnd－View（ "bam／all－order "）；

return view；｝……｝［6］

4.3 業(yè)務(wù)邏輯層

本糕點(diǎn)展銷平臺(tái)的業(yè)務(wù)邏輯層通過(guò)編寫(xiě)Java Bean來(lái)實(shí)現(xiàn)所需的具體業(yè)務(wù)功能，并通過(guò)Spring注解功能有效減少了Java代碼量，同時(shí)采用Spring IoC容器的掃描功能來(lái)自動(dòng)管理這些業(yè)務(wù)Bean.其中糕點(diǎn)業(yè)務(wù)Bean主要代碼如下，其它業(yè)務(wù)Bean類似.

＠Service

public classPastry ServiceImpl implements PastryService｛

＠Resource

PastryDao pastryDao；

＠Override

public List＜Pastry＞ getTop5Pastries（）｛return pastryDao.getTop5Pastries（）；｝

＠Override

public List＜Pastry＞ getOnSalePastries（）｛return pastryDao.getOnSalePastries（）；｝

＠Override

public List＜Map＜String，Object＞＞get－PhotosByPastryId（int pastryId）｛

returnpastryDao.getPhotosByPastryId（pastryId）；｝……｝［7］

4.4 數(shù)據(jù)持久層

本糕點(diǎn)展銷平臺(tái)的數(shù)據(jù)持久層使用MyBatis來(lái)實(shí)現(xiàn)，該技術(shù)提供了數(shù)據(jù)庫(kù)查詢的自動(dòng)對(duì)象綁定功能，它將SQL寫(xiě)在XML文件中，通過(guò)編寫(xiě)簡(jiǎn)單的XML配置實(shí)現(xiàn)POJO與數(shù)據(jù)表的映射，只需編寫(xiě)原生態(tài)SQL語(yǔ)句就能靈活地完成對(duì)數(shù)據(jù)表中數(shù)據(jù)的訪問(wèn)操作，進(jìn)而實(shí)現(xiàn)該平臺(tái)中數(shù)據(jù)的持久化任務(wù).以下為糕點(diǎn)訂單的映射配置核心代碼：

＜mapper namespace＝ "com.dao.OrderDao "＞

＜select id＝ "getTotlaCount "resultType＝ "int "＞

select count（＊）from t＿order

＜／select＞

＜insert id＝ "addOrder "parameterType＝ "com.entity.Order "useGeneratedKeys＝ "true "

keyProperty＝ "orderId "＞

INSERT INTO t＿order（orderReceiver，userId，orderPhone，orderAddress，orderPay，email，

express，createTime）VALUES（＃ ｛order－Receiver｝，＃｛userId｝，＃｛orderPhone｝，

＃ ｛orderAddress｝， ＃ ｛orderPay｝，＃｛email｝，＃｛express｝，NOW（））

＜／insert＞

＜update id＝ "updateStateByOid "＞

UPDATE cartorder a SET a.state＝1 WHERE a.oId＝＃｛oId｝＜／update＞……＜／mapper＞［8］

4.5 數(shù)據(jù)庫(kù)層

本糕點(diǎn)展銷平臺(tái)的數(shù)據(jù)庫(kù)層通過(guò)使用MySQL來(lái)實(shí)現(xiàn)對(duì)所有數(shù)據(jù)的管理，所實(shí)現(xiàn)的數(shù)據(jù)表主要有糕點(diǎn)表、糕點(diǎn)類型表、訂單表、訂單子類表、用戶表、廚師表等.

結(jié) 語(yǔ)

本文基于多層架構(gòu)并采用HTML5、Ajax及SSM開(kāi)發(fā)了一個(gè)別具特色的糕點(diǎn)展銷平臺(tái)，這為廣大消費(fèi)者購(gòu)買糕點(diǎn)提供了一個(gè)新的選擇方式.實(shí)踐證明，采用該方式所開(kāi)發(fā)的糕點(diǎn)展銷平臺(tái)具有良好的可擴(kuò)展性和可維護(hù)性，這為平臺(tái)后期的擴(kuò)展和維護(hù)帶來(lái)了方便.本糕點(diǎn)展銷平臺(tái)對(duì)糕點(diǎn)進(jìn)行詳細(xì)分類，提供更多的選擇空間給用戶，用戶只需要瀏覽前臺(tái)所展示的糕點(diǎn)信息，便可以輕松了解到實(shí)體店內(nèi)對(duì)應(yīng)的糕點(diǎn)，并選擇自己所喜愛(ài)的糕點(diǎn)購(gòu)買.而且本平臺(tái)使用瀑布流式布局很好地解決了因圖片多而導(dǎo)致系統(tǒng)加載速度慢的問(wèn)題，這在一定程度上緩解了客戶端瀏覽器的壓力，有效提升了用戶體驗(yàn).