基于微信小程序的八公山智行系統(tǒng)設(shè)計(jì)與實(shí)現(xiàn)

于文貝 方歡 王勛

摘要：旅游是當(dāng)下熱門(mén)的娛樂(lè)方式，在信息化的時(shí)代，為民眾提供集旅游資訊、地圖引導(dǎo)等功能為一體的一站式旅游網(wǎng)絡(luò)平臺(tái)是十分必要的。該文基于微信小程序，借助前端設(shè)計(jì)語(yǔ)言wxml，云開(kāi)發(fā)控制臺(tái)的數(shù)據(jù)庫(kù)及后端設(shè)計(jì)語(yǔ)言js針對(duì)安徽省淮南市八公山景點(diǎn)設(shè)計(jì)和開(kāi)發(fā)了一套八公山智行微信小程序。該系統(tǒng)結(jié)合地圖指引、資訊共享、景點(diǎn)介紹、攻略安排等人性化功能并且遵循“互聯(lián)網(wǎng)+”思想，特別設(shè)置線上特產(chǎn)購(gòu)買(mǎi)平臺(tái)、交流溝通板塊，致力于滿足用戶的各方面需求。系統(tǒng)經(jīng)過(guò)測(cè)試，結(jié)果顯示具有可使用性。

關(guān)鍵詞：微信小程序;八公山;旅游智能系統(tǒng);wxml;js

中圖分類(lèi)號(hào)：TP393 文獻(xiàn)標(biāo)識(shí)碼：A

文章編號(hào)：1009-3044（2020）19-0078-02

開(kāi)放科學(xué)（資源服務(wù)）標(biāo)識(shí)碼（0SID）：

1 背景

隨著旅游成為消費(fèi)市場(chǎng)的重要組成部分，旅游智能軟件也迎來(lái)了巨大的市場(chǎng)。本文旨在開(kāi)發(fā)以淮南當(dāng)?shù)刂包c(diǎn)八公山為核心的微信小程序即八公山智行系統(tǒng)。主體包括了八公山景點(diǎn)介紹、特產(chǎn)購(gòu)買(mǎi)、地圖指引、信息共享和意見(jiàn)反饋等功能。目的是為用戶提供更優(yōu)質(zhì)的一體化智能旅游服務(wù)。微信“小程序”是依托微信平臺(tái)開(kāi)發(fā)的應(yīng)用程序[1]，相比其他軟件有三大優(yōu)勢(shì)：一是避免了App占用手機(jī)內(nèi)存多，更新頻繁的缺點(diǎn)。二是基于微信龐大的使用群體，此程序可以更快地普及和接觸更多的受眾。三是微信小程序的開(kāi)發(fā)成本較低，且傳播性強(qiáng)，傳播面廣，傳播速度快，傳播有效性高。同時(shí)為了讓數(shù)據(jù)庫(kù)能夠及時(shí)地處理微信用戶實(shí)時(shí)響應(yīng)的需求，Redis+Twemproxy集群技術(shù)為后臺(tái)數(shù)據(jù)庫(kù)提供了有效的緩存解決方案[2]。

2 系統(tǒng)需求分析

2.1 系統(tǒng)總體分析

八公山智行微信小程序是旅游一體化智能網(wǎng)絡(luò)系統(tǒng)。用戶通過(guò)綁定微信平臺(tái)信息進(jìn)行登錄后，可以自主選擇地圖指引、購(gòu)買(mǎi)周邊特產(chǎn)、設(shè)置個(gè)人功能等模塊。用戶在周邊平臺(tái)下單后生成的訂單可以在我的模塊中進(jìn)行查看，交易訂單和余額充值將共同生成交易流水便于用戶查詢。系統(tǒng)用例圖如圖1所示。

2.2 系統(tǒng)模塊分析

八公山智行系統(tǒng)綁定微信用戶信息，通過(guò)微信用戶認(rèn)證后直接進(jìn)行登錄。主要分為周邊、地圖、我的三大模塊。

1）周邊模塊：提供八公山特產(chǎn)購(gòu)買(mǎi)平臺(tái)，可以在頁(yè)面內(nèi)瀏覽八公山特產(chǎn)并進(jìn)行下單。

2）地圖模塊：提供了路線指引功能，通過(guò)GPS數(shù)據(jù)根據(jù)用戶位置進(jìn)行精確的地圖指引，確保用戶能夠更加快速無(wú)誤地到達(dá)景點(diǎn)。

3）我的模塊：是系統(tǒng)的一級(jí)界面，包含我的錢(qián)包、我的訂單、我的足跡、交流、幫助與反饋、問(wèn)卷調(diào)查功能。

①我的錢(qián)包功能：包括余額充值和交易明細(xì)模塊，充值平臺(tái)綁定微信錢(qián)包，支持多種線上付款方式方便用戶在小程序所提供的商品購(gòu)買(mǎi)平臺(tái)進(jìn)行消費(fèi)，在交易明細(xì)中可以清楚直觀的核實(shí)充值及消費(fèi)流水。

②我的訂單功能：顯示用戶通過(guò)小程序所購(gòu)買(mǎi)的商品詳情。

③我的足跡功能：通過(guò)獲取GPS信息，顯示八公山附近地圖及景區(qū)的觀景路線。

④交流功能：部分用戶可以上傳消息到交流頁(yè)面，并對(duì)其他用戶發(fā)布的信息進(jìn)行評(píng)論。

⑤幫助與反饋功能：用于收集用戶的使用意見(jiàn)，為后期系統(tǒng)完善提供數(shù)據(jù)支持。

⑥問(wèn)卷調(diào)查功能：以問(wèn)卷形式對(duì)用戶需求及游玩數(shù)據(jù)進(jìn)行收集。

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

3.1 系統(tǒng)功能設(shè)置

系統(tǒng)采用B/S架構(gòu)，基于微信客戶端，由發(fā)出各種操作請(qǐng)求，核心的部分?jǐn)?shù)據(jù)比對(duì)集中到服務(wù)器上[3]。系統(tǒng)采用了HTTP/XML/CSS/JS等技術(shù)進(jìn)行頁(yè)面的設(shè)計(jì)和美化[4]，同時(shí)該系統(tǒng)包含，數(shù)據(jù)層：云開(kāi)發(fā)控制臺(tái)的數(shù)據(jù)庫(kù);控制邏輯層：由pages控制，pages層傳遞值;UI界面：Images主要用于存放系統(tǒng)編程過(guò)程中所需要的圖片，styles主要用于整體布局。該系統(tǒng)大量運(yùn)用了數(shù)據(jù)庫(kù)操作，通過(guò)微信云平臺(tái)創(chuàng)建了六個(gè)數(shù)據(jù)集用來(lái)存放用戶數(shù)據(jù)。合理的數(shù)據(jù)庫(kù)操作可以極大地提高系統(tǒng)的運(yùn)行速度及質(zhì)量[3]，同時(shí)也為系統(tǒng)提供了大量可分析數(shù)據(jù)，便于對(duì)用戶進(jìn)行精準(zhǔn)服務(wù)推送。

3.2 特產(chǎn)購(gòu)買(mǎi)功能實(shí)現(xiàn)

用戶通過(guò)綁定的微信平臺(tái)信息進(jìn)行登錄，點(diǎn)擊周邊后進(jìn)入特產(chǎn)購(gòu)買(mǎi)界面。此界面配有商品圖文詳情以及評(píng)分等商品信息，點(diǎn)擊下單按鈕，訂單信息將上傳至數(shù)據(jù)庫(kù)數(shù)據(jù)集order中。在我的訂單功能板塊用戶可以點(diǎn)擊查詢已經(jīng)下單的商品。

3.3 下單功能部分代碼

button_tap_three： function 0{

var that= this

const db= wx.cloud.database（{

//連接數(shù)據(jù)庫(kù)

env：new-zqiol，}）

db.collection（order'）.add（{

//連接數(shù)據(jù)集or-der

data：f

order： that.data.time，

state： that.data.state，

image： that.data.image_three}，

success： res=>f

that.setData（{

order： that.data.time，

state： that.data.state，

image： that.data.image_three}）

wx.showToast（（ //事件響應(yīng)

title：下單成功，）））））））

3.4 余額充值功能實(shí)現(xiàn)

購(gòu)買(mǎi)商品后，用戶余額將扣除付款金額，用戶余額更新至數(shù)據(jù)庫(kù)數(shù)據(jù)集user_money中。當(dāng)余額不足時(shí)用戶可以點(diǎn)擊我的錢(qián)包—余額充值功能跳轉(zhuǎn)到充值界面，點(diǎn)擊系統(tǒng)劃分的充值數(shù)額進(jìn)行充值。充值和付款信息構(gòu)成交易流水將以數(shù)值的形式上傳至數(shù)據(jù)庫(kù)數(shù)據(jù)集money中。

3.4.1 余額充值部分代碼

var app= getApp0;

Page（{data：（ money：O，money_lost：0}，

binddetail：function0{

wx.navigateTo（{

url：../bank_detail/money_detail，}））， //，我的錢(qián)包函數(shù)

binddeposit：function0（

wx.navigateTo（{

url：7../bank_detail/money，））），

//我的余額函數(shù)

bindchargeback：function0{

wx.navigateTo（{

url：../bank_detail/chargeback，））），

//交易明細(xì)函數(shù)

onLoad： function （options）{

var that= this

var xmoney=1

const db= wx.cloud.database（（

//連接數(shù)據(jù)庫(kù)

env：new-zqiol，}）

db.collection（user_money'）.get（{

//連接數(shù)據(jù)集user_money

success： function （res）{

console.log（res.data[O].money_lost）

if（res.data[O].money_lost！=0）（

xmoney2 0

that.setData（{

money： res.data[O].money_lost}））

if （xmoney==1）（

db.collection（user_money'）.add（{

data：{ money_lost：0））））），

fail：function（err）{console.log（err）l}）），}）

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

隨著計(jì)算機(jī)集成性和移動(dòng)互聯(lián)網(wǎng)的高速發(fā)展與應(yīng)用，智能移動(dòng)設(shè)備開(kāi)始走進(jìn)我們的日常生活[6]，該文設(shè)計(jì)了八公山智行微信小程序，基于當(dāng)下大眾對(duì)旅游活動(dòng)的需求，解決跟團(tuán)旅游的諸多弊端，結(jié)合大數(shù)據(jù)和互聯(lián)網(wǎng)技術(shù)，為用戶提供了集地圖指引、特產(chǎn)購(gòu)買(mǎi)、景點(diǎn)介紹、游客交流為一體的智能旅游網(wǎng)絡(luò)系統(tǒng)。可以有效地提高用戶的旅游質(zhì)量，節(jié)省用戶的準(zhǔn)備和信息查詢時(shí)間，為白駕游和八公山附近游客帶來(lái)了極大的便利，也提高了八公山景點(diǎn)知名度。

參考文獻(xiàn)：

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

[2]王心妍，毛莉君.基于Android平臺(tái)的電商微信服務(wù)系統(tǒng)的開(kāi)發(fā)研究[J].無(wú)線互聯(lián)科技，2016（6）： 44-45.

[3]黃新艷.微信小程序開(kāi)發(fā)中flex布局容器及元素之屬性技術(shù)釋疑[J].信息與電腦（理論版），2017（14）： 78-80.

[4]嚴(yán)梅，高冠聰.基于微信公眾平臺(tái)開(kāi)發(fā)的大學(xué)生生活圈應(yīng)用設(shè)計(jì)與實(shí)現(xiàn)[J].河北企業(yè)，2016（12）： 260-261.

[5]郭鑫，毛古寶，方歡.基于微信小程序的考勤系統(tǒng)設(shè)計(jì)與實(shí)現(xiàn)[J].電腦知識(shí)與技術(shù)，201 8，14（20）： 57-59.

[6]周玉華.基于微信平臺(tái)的人臉識(shí)別系統(tǒng)研究與實(shí)現(xiàn)[D].鎮(zhèn)江：江蘇大學(xué)，2016.

【通聯(lián)編輯：謝媛媛】

收稿日期：2020-04-25

基金項(xiàng)目：大學(xué)生創(chuàng)新創(chuàng)業(yè)項(xiàng)目（項(xiàng)目編號(hào)：S201910361203）