申燕萍 何夢(mèng)磊

摘要：在充分調(diào)查和分析當(dāng)前餐飲行業(yè)的點(diǎn)餐模式和傳統(tǒng)餐飲APP的運(yùn)作流程的基礎(chǔ)上，針對(duì)現(xiàn)代人的生活方式和傳統(tǒng)APP的局限性進(jìn)行分析。隨著生活節(jié)奏的加快，有時(shí)候到餐廳點(diǎn)餐等待吃飯似乎不太盡人意，導(dǎo)致時(shí)間的浪費(fèi)，工作效率的降低。而傳統(tǒng)APP又過(guò)于臃腫，難以適應(yīng)針對(duì)性。針對(duì)該問(wèn)題，運(yùn)用WEB開(kāi)發(fā)技術(shù)和Nami后臺(tái)H2數(shù)據(jù)庫(kù)，設(shè)計(jì)了基于微信小程序平臺(tái)和B/S模式的點(diǎn)餐系統(tǒng)。該系統(tǒng)結(jié)合了微信小程序本身的優(yōu)點(diǎn)，實(shí)現(xiàn)了用戶登錄、在線點(diǎn)餐，生成訂單、用戶評(píng)論、用戶投訴等功能。極大的便捷了人們的生活，也是未來(lái)信息化時(shí)代發(fā)展的大勢(shì)所趨。

關(guān)鍵詞：微信小程序；點(diǎn)餐系統(tǒng)；Nami后臺(tái)；H2數(shù)據(jù)庫(kù)

中圖分類號(hào)：TP311 文獻(xiàn)標(biāo)識(shí)碼：A 文章編號(hào)：1009-3044（2018）04-0062-02

1 背景

隨著全球互聯(lián)網(wǎng)信息化的發(fā)展，基于網(wǎng)絡(luò)技術(shù)的提升，手機(jī)大概成了我們每個(gè)人都必不可少的通訊工具，而微信這類通訊軟件的產(chǎn)生也基本完全代替了傳統(tǒng)發(fā)短信的方式。

2017年4月24日，騰訊旗下的企鵝智酷公布了最新的《2017微信用戶&生態(tài)研究報(bào)告》。根據(jù)這份報(bào)告數(shù)據(jù)顯示，截止到2016年12月微信全球共計(jì)8.89億月活用戶，而新興的公眾號(hào)平臺(tái)擁有1000萬(wàn)個(gè)。微信這一年來(lái)直接帶動(dòng)了信息消費(fèi)1742.5億元，相當(dāng)于2016年中國(guó)信息消費(fèi)總規(guī)模的4.54%。正因?yàn)槲⑿湃绱她嫶蟮氖褂萌丝诨鶖?shù)，也間接帶動(dòng)了微信小程序的發(fā)展。

2 系統(tǒng)支撐

系統(tǒng)可在任意平臺(tái)通過(guò)微信開(kāi)發(fā)者工具選擇微信小程序開(kāi)發(fā)，填入自己的APPID創(chuàng)建項(xiàng)目文件夾即可開(kāi)始開(kāi)發(fā)。Nami后臺(tái)是為了適應(yīng)微信小程序只能發(fā)送Request請(qǐng)求的特點(diǎn)，而專門(mén)為微信小程序服務(wù)端開(kāi)發(fā)的一種容器，使其可以直接通過(guò)JavaScript腳本操作數(shù)據(jù)庫(kù)。H2數(shù)據(jù)庫(kù)是內(nèi)嵌在Nami后臺(tái)中的數(shù)據(jù)庫(kù)，類似于一般的數(shù)據(jù)庫(kù)，用來(lái)儲(chǔ)存小程序中的數(shù)據(jù)。

3 系統(tǒng)整體設(shè)計(jì)

此系統(tǒng)將點(diǎn)餐與互聯(lián)網(wǎng)相結(jié)合，避免了柜面上繁瑣的點(diǎn)餐和付款排隊(duì)環(huán)節(jié)，讓用戶可以直觀方便地進(jìn)行點(diǎn)餐和直接使用微信零錢(qián)進(jìn)行付款，相比傳統(tǒng)去餐廳吃飯更加人性化，也更加注重用戶體驗(yàn)。

系統(tǒng)分為數(shù)據(jù)庫(kù)端和微信小程序端。管理模塊可以在PC端（數(shù)據(jù)庫(kù)端）實(shí)現(xiàn)（如圖1）。管理模塊也可以直接在小程序端實(shí)現(xiàn)，就是把管理模塊直接嵌入小程序端。只有系統(tǒng)管理員輸入正確的管理員賬號(hào)和密碼驗(yàn)證通過(guò)之后才能在需要的時(shí)候從小程序端進(jìn)入管理模塊（如圖2）。

3.1 系統(tǒng)整體架構(gòu)

系統(tǒng)大致運(yùn)行架構(gòu)如圖3所示，微信小程序的后臺(tái)（后稱為系統(tǒng)后臺(tái)）不同于其他語(yǔ)言可以直接操作數(shù)據(jù)庫(kù)，系統(tǒng)后臺(tái)只能發(fā)送Request請(qǐng)求，將請(qǐng)求與本地服務(wù)器上的JavaScript腳本進(jìn)行交互，再由JavaScript腳本來(lái)操作數(shù)據(jù)庫(kù)。PC端再將數(shù)據(jù)庫(kù)中的數(shù)據(jù)顯示在頁(yè)面中。

3.2 功能模塊設(shè)計(jì)

根據(jù)分析系統(tǒng)需求和用戶需求，系統(tǒng)必須具備如下幾個(gè)功能模塊，用戶登錄、用戶注冊(cè)、加入購(gòu)物車(chē)、立即購(gòu)買(mǎi)、生成訂單、用戶評(píng)論、用戶投訴等七個(gè)模塊。

① 用戶登錄與注冊(cè)：當(dāng)用戶在系統(tǒng)中沒(méi)有信息的時(shí)候，用戶輸入信息點(diǎn)擊注冊(cè)既能完成注冊(cè)，再輸入注冊(cè)的用戶名和密碼既能完成登錄。

② 加入購(gòu)物車(chē)：當(dāng)用戶喜愛(ài)某個(gè)商品但還并不準(zhǔn)備購(gòu)買(mǎi)的時(shí)候，就可以將其加入購(gòu)物車(chē)。

③ 立即購(gòu)買(mǎi)與生成訂單：用戶點(diǎn)擊購(gòu)買(mǎi)確認(rèn)信息付款之后就能生成訂單，后臺(tái)管理員會(huì)處理訂單。

④ 用戶評(píng)論：用戶可以在系統(tǒng)發(fā)表評(píng)論模塊發(fā)表正面的言語(yǔ)，所有用戶的評(píng)論信息都會(huì)顯示在一個(gè)滾動(dòng)區(qū)域，也可看作是一種聊天方式。

⑤ 用戶投訴：用戶投訴模塊需要驗(yàn)證用戶身份是否合法和是否購(gòu)買(mǎi)過(guò)系統(tǒng)商品，符合以上兩項(xiàng)才能發(fā)表投訴，發(fā)表正面言語(yǔ)提交到后臺(tái)，管理員將會(huì)處理用戶的投訴。

3.3 數(shù)據(jù)庫(kù)設(shè)計(jì)

根據(jù)需求，本系統(tǒng)需要建立六張表：用戶信息表、商品信息表、用戶購(gòu)物車(chē)表、用戶訂單表、用戶評(píng)論表、用戶投訴表。在Nami后臺(tái)的H2數(shù)據(jù)庫(kù)中建立以上各表，Nami后臺(tái)直接架設(shè)在服務(wù)器上，PC端再通過(guò)Request請(qǐng)求和服務(wù)器上Nami后臺(tái)中的JavaScript腳本交互，再由JavaScript腳本操作H2數(shù)據(jù)庫(kù)。

4 系統(tǒng)功能實(shí)現(xiàn)

4.1 登錄界面詳細(xì)設(shè)計(jì)

用戶登錄的流程：用戶點(diǎn)擊圖片登錄按鈕，出現(xiàn)用戶登錄界面，用戶輸入用戶名和密碼，若用戶沒(méi)有登錄，則只能瀏覽商品不能加入購(gòu)物車(chē)或購(gòu)買(mǎi)，點(diǎn)擊注冊(cè)的時(shí)候，會(huì)保存其輸入的用戶名并使用db.find從USER_DEMO數(shù)據(jù)表中查找是否存在相同的用戶名，存在則會(huì)發(fā)出提示，提示用戶已存在相同用戶名的用戶，并提示用戶輸入與之前不同的用戶名，密碼和用戶地址不能為空，當(dāng)用戶名通過(guò)db.find查找不到相同用戶名即detail返回值為null的時(shí)候，點(diǎn)擊注冊(cè)即通過(guò)db.exec（INSERT INTO）語(yǔ)句，將用戶輸入的用戶名和密碼及地址添加到數(shù)據(jù)庫(kù)。注冊(cè)成功即返回登錄界面，再輸入其注冊(cè)的用戶名和密碼，系統(tǒng)將會(huì)保存輸入的用戶名和密碼并通過(guò)db.find從數(shù)據(jù)庫(kù)中查找與輸入的用戶名相同的記錄，并與數(shù)據(jù)庫(kù)中的密碼相比較，相同則登錄成功，不同則提示密碼錯(cuò)誤。

4.2 購(gòu)買(mǎi)界面詳細(xì)設(shè)計(jì)

當(dāng)用戶在主界面中看中心儀的商品時(shí)，可點(diǎn)擊立即購(gòu)買(mǎi)，提示框顯示商品已加入購(gòu)物車(chē)并提示是否立即購(gòu)買(mǎi)，點(diǎn)擊否則只是將商品通過(guò)db.exec（inset into）語(yǔ)句操作加入購(gòu)物車(chē)，點(diǎn)擊是則會(huì)跳轉(zhuǎn)到確認(rèn)信息界面，確認(rèn)收貨地址收貨人，若收貨地址有誤則能直接對(duì)其修改并保存為當(dāng)前登錄用戶的詳細(xì)地址，若收貨地址和收貨人都沒(méi)有問(wèn)題的話就會(huì)跳轉(zhuǎn)到付款界面，付款則是直接調(diào)用微信自帶的付款A(yù)PI調(diào)用微信零錢(qián)即可付款，付款成功則會(huì)加入用戶訂單。

關(guān)鍵代碼示意：

wx.request（{

url： config.Readcommodityurl，

data： {}，

header： { 'Accept'： 'application/json' }，

method： "GET"，

success： function （res） {wx.request（{

url： config.Joinshoopcaturl，

data： {

username： app.globalData.nowloginusername，

userid： app.globalData.nowloginusername，

address： app.globalData.nowloginuserAddress，

commodityid： that.data.commodity.COMMODITYID，

commodityname： that.data.commodity.COMMODITYNAME，

commodityintroduces： that.data.commodity.COMMODITYINTRODUCE，

commodityprice： that.data.commodity.COMMODITYPRICE，}，

header： { 'Accept'： 'application/json' }，

method： "GET"，

success： function （res） {wx.showToast（{

title： '已加入購(gòu)物車(chē)！'，image： '../../images/allimages/smiley.png'，duration： 1500，mask： false，}）}，}）}，}）}}，}）}}，

4.3 購(gòu)物車(chē)詳細(xì)設(shè)計(jì)

當(dāng)用戶在主界面將商品加入購(gòu)物車(chē)中之后，點(diǎn)擊購(gòu)物車(chē)的tabbar頁(yè)面，系統(tǒng)則會(huì)通過(guò)用戶名在數(shù)據(jù)表中查找是否有商品加入了購(gòu)物車(chē)，返回值為null則說(shuō)明購(gòu)物車(chē)中沒(méi)有商品，即顯示“當(dāng)前登錄用戶購(gòu)物車(chē)中沒(méi)有商品！”，當(dāng)返回值不為null時(shí)，通過(guò)db.query將購(gòu)物車(chē)表中的數(shù)據(jù)全部通過(guò)wx：for=””循環(huán)顯示在購(gòu)物車(chē)界面中，用戶可以點(diǎn)擊刪除商品或直接購(gòu)買(mǎi)商品，點(diǎn)擊刪除商品則會(huì)通過(guò)db.exec（delete）語(yǔ)句將其數(shù)據(jù)從表中刪除，點(diǎn)擊立即購(gòu)買(mǎi)按鈕則會(huì)直接跳轉(zhuǎn)到與在主界面點(diǎn)擊立即購(gòu)買(mǎi)相同的界面與邏輯。

5 結(jié)束語(yǔ)

本系統(tǒng)是通過(guò)微信公眾開(kāi)發(fā)者工具在windows端完成開(kāi)發(fā)，微信小程序相對(duì)于傳統(tǒng)APP脫離了平臺(tái)的限制，即只要完成開(kāi)發(fā)即可在Android端和IOS端都可以訪問(wèn)。

系統(tǒng)將傳統(tǒng)點(diǎn)餐模式改進(jìn)成了基于互聯(lián)網(wǎng)的線上銷售模式，在當(dāng)今快節(jié)奏的生活方式下，不僅節(jié)省了人們的時(shí)間也加快了互聯(lián)網(wǎng)時(shí)代發(fā)展的進(jìn)程。

參考文獻(xiàn)：

[1] 騰訊. 微信小程序開(kāi)發(fā)文檔[EB/OL]. https：//mp.weixin.qq.com/debug/wxadoc/dev/framework/MINA.html.

[2] 楊啟， 張麗萍. 從互聯(lián)網(wǎng)生態(tài)看微信小程序的發(fā)展[J]. 新聞?wù)搲?2017（2）：22-24.

[3] 張榮齊， 田文麗. 餐飲連鎖企業(yè)O2O商業(yè)模式研究[J]. 中國(guó)市場(chǎng)， 2014（32）：81-88.

[4] 陳琦. 基于Webpy+Apache HTTP Server的微信小程序架構(gòu)搭建研究[J]. 無(wú)線互聯(lián)科技， 2017（18）：50-51

[5] 林曉艷. 微信小程序的用戶體驗(yàn)研究[C]//工業(yè)設(shè)計(jì)研究（第五輯）. 2017： 6.

[6] 劉玉佳. 微信“小程序”開(kāi)發(fā)的系統(tǒng)實(shí)現(xiàn)及前景分析[J]. 信息通信， 2017（1）：260-261.