基于微信小程序的城市周邊游平臺(tái)設(shè)計(jì)與實(shí)現(xiàn)

李珊 汪鳳麟 蔡達(dá)成 朱欣碧 歐陽(yáng)昊 彭志升

摘 ? 要：隨著5G時(shí)代的到來(lái)、微信的迅猛發(fā)展、微信小程序簡(jiǎn)便的開(kāi)發(fā)方式以及旅游APP對(duì)于短期農(nóng)村旅游的宣傳不足，帶動(dòng)了旅游系統(tǒng)的微信小程序設(shè)計(jì)。文章實(shí)現(xiàn)了基于微信小程序的旅游介紹系統(tǒng)，主要分為用戶端與系統(tǒng)平臺(tái)。系統(tǒng)為用戶提供景點(diǎn)的視頻介紹、實(shí)時(shí)天氣播報(bào)、實(shí)時(shí)地點(diǎn)查詢、當(dāng)?shù)靥厣朗辰榻B以及住宿查詢等功能，旨在設(shè)計(jì)一個(gè)整合城市周邊游景點(diǎn)信息的微信小程序，來(lái)幫助農(nóng)村旅游業(yè)的發(fā)展，起到景點(diǎn)的推廣和宣傳作用，為用戶提供高效、便捷的服務(wù)和全面的景點(diǎn)信息，從而推動(dòng)未來(lái)關(guān)于“互聯(lián)網(wǎng)+旅游”的發(fā)展進(jìn)程。

關(guān)鍵詞：微信小程序;周邊游;休閑

根據(jù)騰訊公司2019年第二季度財(cái)務(wù)報(bào)表披露，微信及WeChat的合并月活躍賬戶數(shù)達(dá)11.33億，同比增長(zhǎng)7%。騰訊稱，數(shù)十個(gè)內(nèi)容類小程序的日活躍賬戶數(shù)已超過(guò)100萬(wàn)，在第二季，每位用戶的使用時(shí)長(zhǎng)、每日信息發(fā)送量及視頻上傳量等主要用戶指標(biāo)保持穩(wěn)定同比增長(zhǎng)，這些用戶數(shù)據(jù)都為微信小程序未來(lái)的發(fā)展提供強(qiáng)有力支持。微信小程序簡(jiǎn)單、易上手的開(kāi)發(fā)環(huán)境和容易傳播的特性，使得小程序以一種新的、開(kāi)放的能力，可以在微信用戶內(nèi)方便、快捷地獲取和傳播。

經(jīng)過(guò)多年的發(fā)展，鄉(xiāng)村旅游已經(jīng)從“農(nóng)家樂(lè)”等單一類型向多樣化、集群化、品牌化的鄉(xiāng)村旅游目的地轉(zhuǎn)變[1]。鄉(xiāng)村旅游以當(dāng)?shù)靥赜械纳鷳B(tài)資源、民俗文化以及農(nóng)業(yè)生產(chǎn)活動(dòng)等作為主要的旅游活動(dòng)，被認(rèn)為是改善農(nóng)村和農(nóng)村扶貧的重要方式[2]。“互聯(lián)網(wǎng)+旅游”是未來(lái)轉(zhuǎn)型的一個(gè)方向，休閑服務(wù)的供給與需求尚存在一定程度錯(cuò)位，區(qū)域間潛在出游力均衡化趨勢(shì)逐漸顯現(xiàn)[3]，可見(jiàn)未來(lái)城市周邊游和鄉(xiāng)村旅游人數(shù)將不斷增加。游客們不看好周游主要原因在于不了解鄉(xiāng)村旅游現(xiàn)狀，那么鄉(xiāng)村旅游需要發(fā)展就要提高景點(diǎn)知名度、加大宣傳力度[4]。因此，筆者有必要設(shè)計(jì)一個(gè)整合城市周邊游景點(diǎn)信息的微信小程序來(lái)幫助農(nóng)村旅游業(yè)的發(fā)展，同時(shí)為短期旅游的游客提供便利。

1 ? ?小程序基本介紹

對(duì)于使用者來(lái)說(shuō)，微信小程序是一款輕快的軟件，在微信的生態(tài)體系內(nèi)，有快捷、高效的用戶體驗(yàn)。對(duì)于開(kāi)發(fā)者而言，微信小程序提供了一套完整的開(kāi)發(fā)框架、豐富的組件和應(yīng)用程序接口（Application Program Interface，API），可實(shí)現(xiàn)快速開(kāi)發(fā)，擁有比統(tǒng)手機(jī)客戶端APP成本更低、速度更快的開(kāi)發(fā)優(yōu)勢(shì)，符合下一代移動(dòng)互聯(lián)網(wǎng)產(chǎn)業(yè)發(fā)展的“微、小、輕”趨勢(shì)，擁有更為廣泛的市場(chǎng)前景[5]。當(dāng)今出現(xiàn)的微信小程序可以提高服務(wù)效率、豐富游客體驗(yàn)、促進(jìn)農(nóng)村旅游業(yè)的轉(zhuǎn)型。建立系統(tǒng)流程包括：（1）注冊(cè)，在微信公眾平臺(tái)注冊(cè)小程序，完成注冊(cè)后可以同步進(jìn)行信息完善和開(kāi)發(fā)。（2）開(kāi)發(fā)小程序，完成小程序開(kāi)發(fā)者綁定、開(kāi)發(fā)信息配置后，開(kāi)發(fā)者可下載開(kāi)發(fā)者工具、參考開(kāi)發(fā)文檔進(jìn)行小程序的開(kāi)發(fā)和調(diào)試。（3）提交審核和發(fā)布，完成小程序的開(kāi)發(fā)后，提交代碼至微信團(tuán)隊(duì)審核，審核通過(guò)后可發(fā)布，但是公測(cè)期間不能發(fā)布。

2 ? ?系統(tǒng)概述

整合城市周邊游景點(diǎn)信息的微信小程序采用客戶機(jī)/服務(wù)器（Client/Server，C/S）架構(gòu)，小程序服務(wù)器端接收客戶端發(fā)送的請(qǐng)求處理后返回?cái)?shù)據(jù)信息，客戶端既接受數(shù)據(jù)信息也發(fā)出操作請(qǐng)求。本系統(tǒng)主要進(jìn)行周邊游景點(diǎn)的信息介紹，游客通過(guò)簡(jiǎn)單的點(diǎn)擊查詢即可獲取信息，減少游客的操作時(shí)間，提供高效、精準(zhǔn)的服務(wù)。消息流程如圖1所示。

3 ? ?小程序設(shè)計(jì)

3.1 ?需求分析

整合城市周邊游景點(diǎn)信息的微信小程序主要考慮將周邊游景點(diǎn)的介紹信息通過(guò)新媒體的方式傳達(dá)給游客。同時(shí)，為了使系統(tǒng)的功能更加人性化，系統(tǒng)還提供景點(diǎn)周邊的地點(diǎn)、天氣以及食宿等查詢功能。用戶可以通過(guò)系統(tǒng)直接獲取以上信息，還可以點(diǎn)擊鏈接查詢更多信息。系統(tǒng)的功能結(jié)構(gòu)如圖2所示。

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

整合城市周邊游景點(diǎn)信息的微信小程序界面設(shè)計(jì)，在參考了微信官方小程序界面設(shè)計(jì)指南以及大多數(shù)流行旅游APP的設(shè)計(jì)后，建立了簡(jiǎn)潔而具有景點(diǎn)特色的設(shè)計(jì)。

小程序框架的頁(yè)面文件由JS頁(yè)面腳本邏輯、WXML頁(yè)面結(jié)構(gòu)設(shè)計(jì)、WXSS頁(yè)面樣式表和JS對(duì)象簡(jiǎn)譜（JavaScript Object Notation，JSON）頁(yè)面配置共同組成[6]。其中WXML和WXSS屬于渲染層，負(fù)責(zé)小程序的頁(yè)面布局和樣式，類似于網(wǎng)頁(yè)開(kāi)發(fā)中的超文本標(biāo)記語(yǔ)言（HyperText Markup Language，HTML）和層疊樣式表（Cascading Style Sheets，CSS）。JS腳本工作在邏輯層，負(fù)責(zé)頁(yè)面與后端服務(wù)器的邏輯工作，小程序的渲染層和邏輯層是分離的。json文件配置當(dāng)前頁(yè)面的窗口表現(xiàn)。

3.2.1 ?小程序全局配置

在新創(chuàng)建的小程序時(shí)，系統(tǒng)會(huì)自動(dòng)創(chuàng)建app.json，app.wxml，app.js。作為一個(gè)小程序，常見(jiàn)的全局配置應(yīng)包括：控制頁(yè)面數(shù)量、系統(tǒng)窗口、標(biāo)題、導(dǎo)航欄等。小程序根目錄下的app.json文件用來(lái)對(duì)微信小程序進(jìn)行配置，文件內(nèi)容為一個(gè)JSON對(duì)象，且有嚴(yán)格的格式要求，不能注釋。

（1）頁(yè)面數(shù)量配置。在app.json內(nèi)的pages屬性下增減頁(yè)面路徑。小程序中新增、減少頁(yè)面，都需要對(duì)pages數(shù)組進(jìn)行修改，完成配置后，系統(tǒng)會(huì)自動(dòng)生成這幾個(gè)頁(yè)面。文件名不需要寫文件后綴，框架會(huì)自動(dòng)去尋找對(duì)于位的.json，.js，.wxml，.wxss 4個(gè)文件進(jìn)行處理。app.json中添加頁(yè)面：”pages”： [“新添加的頁(yè)面路徑”，...]

（2）系統(tǒng)窗口。app.json的window屬性，可用于設(shè)置小程序的狀態(tài)欄、導(dǎo)航條、標(biāo)題、窗口背景?！眞indow”： {“backgroundTextStyle”： “可設(shè)置為light和dark”...}

（3）底部導(dǎo)航。app.json的tabBar屬性，如果小程序是一個(gè)多tab應(yīng)用，可以通過(guò)tabBar配置項(xiàng)指定tab欄的表現(xiàn)，以及tab切換時(shí)顯示的對(duì)應(yīng)頁(yè)面?！眛abBar”： {“l(fā)ist”： [{“pagePath”： “頁(yè)面路徑”，”text”： “首頁(yè)”，...}，]}

3.2.2 ?基本功能實(shí)現(xiàn)

（1）頁(yè)面跳轉(zhuǎn)。不同的頁(yè)面跳轉(zhuǎn)，可以展現(xiàn)不同的樣式，帶來(lái)良好的用戶體驗(yàn)，也讓系統(tǒng)更加清晰、功能明確。wx.switchTab可跳轉(zhuǎn)到導(dǎo)航欄里的頁(yè)面，wx.navigateTo跳轉(zhuǎn)到小程序的其他頁(yè)面的（不包括導(dǎo)航欄里的頁(yè)面）。goToSec： function （param） {wx.switchTab（{url： '跳轉(zhuǎn)的頁(yè)面路徑'，}）} goToSec： function （param） {wx.navigateTo（{url： ‘跳轉(zhuǎn)的頁(yè)面路徑，}）}。

（2）視頻呈現(xiàn)。本系統(tǒng)采用景點(diǎn)視頻宣傳的方式，游客可以觀看視頻了解更多景點(diǎn)信息，比單純的圖片與文字介紹更加生動(dòng)形象。在wxml里用video標(biāo)簽進(jìn)行設(shè)計(jì)。

（3）定位。使用微信小程序自帶的函數(shù)wx.getLocation獲取用戶位置，wx.openLocation進(jìn)行查看。前端按鈕用于觸發(fā)獲取地址，用戶首次獲取位置，需要授權(quán)才可以繼續(xù)操作。

（4）實(shí)時(shí)天氣查看。天氣查看功能可以提醒短期出行的游客實(shí)時(shí)了解附近景點(diǎn)的天氣訊息，做好出行規(guī)劃。

本系統(tǒng)使用的是百度地圖的接口。開(kāi)發(fā)者需要提前在百度地圖開(kāi)放平臺(tái)中申請(qǐng)帳號(hào)，獲取一個(gè)訪問(wèn)應(yīng)用（AK），任何調(diào)用百度地圖天氣的API接口，都需要使用這個(gè)AK初始化接口。申請(qǐng)完成后，在小程序根目錄下新建一個(gè)路徑，將百度的bmap-wx.min.js文件拷貝到新建的文件路徑下。然后JS文件內(nèi)調(diào)用百度地圖對(duì)象直接獲取信息即可。

4 ? ?結(jié)語(yǔ)

本項(xiàng)目針對(duì)新農(nóng)村旅游的實(shí)際需要，設(shè)計(jì)了一款基于微信小程序的旅游景點(diǎn)介紹系統(tǒng)，實(shí)現(xiàn)了景點(diǎn)宣傳視頻、實(shí)時(shí)天氣播報(bào)、實(shí)時(shí)地點(diǎn)查詢、當(dāng)?shù)靥厣朗辰榻B以及住宿查詢等功能。小程序開(kāi)發(fā)快、效率高的特點(diǎn)，有助于開(kāi)發(fā)人員實(shí)時(shí)更新旅游景點(diǎn)信息，為新農(nóng)村旅游景點(diǎn)的發(fā)展和游客的出行提供更好的服務(wù)。

總的來(lái)說(shuō)，未來(lái)小程序平臺(tái)會(huì)不斷推動(dòng)旅游業(yè)的發(fā)展，網(wǎng)絡(luò)旅游平臺(tái)功能將會(huì)越來(lái)越豐富，為游客帶來(lái)更多便利。本文為新農(nóng)村旅游課題設(shè)計(jì)的旅游平臺(tái)還有些功能在文中未進(jìn)行詳細(xì)闡述，研發(fā)者將會(huì)不斷創(chuàng)新繼續(xù)學(xué)習(xí)，完善平臺(tái)功能。

[參考文獻(xiàn)]

[1]銀元.豐富“政策工具箱”促進(jìn)鄉(xiāng)村旅游可持續(xù)發(fā)展[N].中國(guó)旅游報(bào)，2018-12-12（003）.

[2]黃偵，羅有，譚鵬舉，等.消費(fèi)者視角下鄉(xiāng)村旅游扶貧分析—以贛南為例[J].贛南師范大學(xué)學(xué)報(bào)，2019（2）：130-136.

[3]李志剛.中國(guó)為世界旅游發(fā)展貢獻(xiàn)強(qiáng)大動(dòng)能[N].中國(guó)旅游報(bào)，2019-01-18（001）.

[4]汪鳳麟，李珊，蔡達(dá)成，等.中小城市周邊旅游調(diào)查及分析—以湖南省衡陽(yáng)市為例[J].現(xiàn)代營(yíng)銷，2019（5）：3-5.

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

[6]王媛.基于微信小程序的線上交易平臺(tái)[J].中國(guó)科技信息，2019（1）：14，78-81.

Abstract：With the rapid development of WeChat and WeChat mini programs ?method and application， due to the insufficient publicity of tourism APP for short-term rural tourism， investigate WeChat Mini Programs design and realization of tourism system. This paper implements the tourism introduction system based on WeChat Mini Program， which is mainly divided into client and system platform. The system provides users with several main functions： scenic spot video introduction， real-time weather broadcast， real-time location query， local food introduction and accommodation query. The purpose of the system platform is to design a WeChat Mini Program， which integrates the information of scenic spots around the city to help the development of rural tourism and promote and publicize scenic spots. Transmission function provides users with efficient and convenient services and comprehensive scenic spot information. Thus， the platform accelerates the development process of “Internet + Tourism” in the future.

Key words：Wechat Mini Program; peripheral travel; leisure