基于微信小程序的公眾氣象服務(wù)應(yīng)用的設(shè)計(jì)與實(shí)現(xiàn)

高超越 李瑋祎

摘要：微信小程序具有不占內(nèi)存、使用門檻低、分享裂變能力強(qiáng)等優(yōu)點(diǎn)，契合公眾氣象服務(wù)需求，為此開發(fā)了一款基于微信小程序的公眾氣象服務(wù)應(yīng)用。該應(yīng)用包含天氣實(shí)況、城鎮(zhèn)預(yù)報(bào)、預(yù)警信息、分鐘級雷達(dá)降水趨勢預(yù)報(bào)和氣象圖形產(chǎn)品等多個(gè)功能頁面，能夠?yàn)楣娞峁└泳?xì)化、智慧化的氣象服務(wù)。

關(guān)鍵詞：微信小程序；公眾氣象服務(wù)

中圖分類號：TP311? ? ?文獻(xiàn)標(biāo)識碼：A

文章編號：1009-3044（2023）36-0042-00

開放科學(xué)（資源服務(wù)）標(biāo)識碼（OSID）

0 引言

微信小程序是依附于微信App的應(yīng)用程序，具有不占內(nèi)存、使用門檻低、分享裂變能力強(qiáng)等優(yōu)點(diǎn)。小程序于2017年1月９日正式上線，截至2021年，全網(wǎng)微信小程序數(shù)量已超700萬，小程序開發(fā)者突破300萬，日活躍用戶數(shù)量超過4.5億。微信小程序有著操作簡單、使用方便、獲取方式多種多樣等特點(diǎn)，且分享傳播非常方便快捷，用戶可以基于微信隨時(shí)一鍵分享，任何人都可直接打開體驗(yàn)。其獲取便捷、傳播性強(qiáng)的特性，與公眾氣象服務(wù)在提升信息傳播速度和覆蓋面上的需求高度契合[1]。

“內(nèi)蒙古天氣”公眾號原有的功能基于傳統(tǒng)H5技術(shù)開發(fā)與運(yùn)行，傳統(tǒng)H5技術(shù)對于業(yè)務(wù)邏輯復(fù)雜、交互要求高的應(yīng)用使用起來體驗(yàn)不佳，經(jīng)常出現(xiàn)頂部綠色進(jìn)度條需等待一段時(shí)間，而小程序在使用流暢度方面更有優(yōu)勢，用戶使用體驗(yàn)更好。通過將小程序和公眾號結(jié)合起來使用，一個(gè)負(fù)責(zé)實(shí)現(xiàn)功能和服務(wù)，一個(gè)負(fù)責(zé)實(shí)現(xiàn)消息的推送和用戶留存，可以完美發(fā)揮小程序和公眾號各自的優(yōu)勢。

為了使公眾能夠通過微信及時(shí)享受便捷的氣象服務(wù)，隨時(shí)隨地掌握由氣象部門發(fā)布的精細(xì)化氣象服務(wù)產(chǎn)品，同時(shí)對“內(nèi)蒙古天氣”微信公眾號的功能進(jìn)行擴(kuò)充和完善，利用微信小程序的開發(fā)技術(shù)，研發(fā)基于微信小程序的公眾氣象服務(wù)應(yīng)用，將為氣象部門構(gòu)建和發(fā)展智慧氣象服務(wù)以及實(shí)現(xiàn)高質(zhì)量氣象現(xiàn)代化提供有力支撐。

1 小程序的設(shè)計(jì)

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

小程序的服務(wù)對象定位為社會(huì)公眾，設(shè)計(jì)目標(biāo)是能夠解決用戶面臨的日常生活中常見的天氣問題。小程序主要功能有：城市定位、天氣預(yù)報(bào)、天氣實(shí)況、預(yù)警信息、地點(diǎn)搜索、降水早知道、圖形產(chǎn)品等，以簡單實(shí)用的功能給公眾提供所需的氣象服務(wù)[2]。小程序包括三個(gè)主要功能模塊，分別為“預(yù)報(bào)預(yù)警”“實(shí)況監(jiān)測”和“專題服務(wù)”。小程序功能模塊結(jié)構(gòu)圖如圖1所示。

1）“預(yù)報(bào)預(yù)警”模塊，提供公眾日常生活所需的基本的天氣服務(wù)信息，包括“看天氣”和“查預(yù)警”兩個(gè)子模塊。其中“看天氣”模塊的功能包括當(dāng)前天氣實(shí)況、空氣質(zhì)量指數(shù)、預(yù)警信息提示、今明兩天天氣預(yù)報(bào)、未來24小時(shí)逐小時(shí)預(yù)報(bào)、未來15天逐日預(yù)報(bào)和城市生活氣象指數(shù)等氣象信息的展示。用戶打開小程序時(shí)默認(rèn)打開的首頁就是“看天氣”模塊，該模塊通過手機(jī)定位顯示基于用戶當(dāng)前位置的實(shí)時(shí)天氣信息，同時(shí)也提供地點(diǎn)搜索功能，用戶可查詢?nèi)珖渌胤降奶鞖庑畔ⅰ！安轭A(yù)警”模塊的主要功能是以地圖形式展示所有全區(qū)當(dāng)前生效中的預(yù)警信息，預(yù)警圖標(biāo)會(huì)按照預(yù)警覆蓋范圍定位到地圖相應(yīng)的位置上。除地圖形式外還支持切換到以列表方式展示全區(qū)預(yù)警，在列表界面可按照預(yù)警種類、預(yù)警等級和發(fā)布單位進(jìn)行分類查詢。點(diǎn)擊地圖中的預(yù)警圖標(biāo)或列表中的單條預(yù)警將進(jìn)入預(yù)警信息詳情頁。

2）“實(shí)況監(jiān)測”模塊，為公眾提供相對專業(yè)的實(shí)況監(jiān)測圖形產(chǎn)品，使公眾對當(dāng)前天氣形勢有更加直觀的了解，增強(qiáng)小程序的實(shí)用性。該模塊主要包括降水早知道、全區(qū)實(shí)況、衛(wèi)星云圖和雷達(dá)拼圖四個(gè)展示內(nèi)容。其中全區(qū)實(shí)況是以地圖形式展示實(shí)況數(shù)據(jù)，根據(jù)格點(diǎn)實(shí)況數(shù)據(jù)渲染色斑圖，將色斑圖疊加到地圖瓦片上。展示的圖形產(chǎn)品分為氣溫、降水和風(fēng)速三部分，其中氣溫包括逐小時(shí)氣溫、24小時(shí)最高氣溫、24小時(shí)最低氣溫；降水包括過去1小時(shí)、3小時(shí)、6小時(shí)、12小時(shí)、24小時(shí)、48小時(shí)累計(jì)降水量；風(fēng)速包括2分鐘平均風(fēng)速和極大風(fēng)速。衛(wèi)星云圖展示內(nèi)容為FY4A彩色云圖，雷達(dá)拼圖展示內(nèi)容為華北、東北、西北和全國雷達(dá)拼圖。衛(wèi)星云圖和雷達(dá)拼圖都可按時(shí)間進(jìn)度自動(dòng)連播或拖動(dòng)進(jìn)度條查看，也可單獨(dú)點(diǎn)擊查看當(dāng)天各時(shí)次的圖形。

3）“專題服務(wù)”模塊，初期計(jì)劃內(nèi)容為旅游氣象，提供內(nèi)蒙古自治區(qū)主要旅游景點(diǎn)天氣實(shí)況及天氣預(yù)報(bào)服務(wù)。此模塊可以后期增加其他專題氣象服務(wù)模塊，比如在2024年十四屆冬運(yùn)會(huì)氣象服務(wù)保障期間鏈接十四冬專題氣象服務(wù)網(wǎng)站。

4）特色功能：降水早知道，在小程序看天氣及實(shí)況監(jiān)測模塊都會(huì)留有入口，該功能即分鐘級雷達(dá)降水趨勢預(yù)報(bào)。其原理是通過微信API接口獲取用戶位置信息后，使用電子地圖解析定位用戶所在位置，在地圖上疊加雷達(dá)外推數(shù)據(jù)，提供未來兩小時(shí)內(nèi)的短時(shí)臨近降水預(yù)報(bào)。該預(yù)報(bào)的空間分辨率可精確到街道，時(shí)間分辨率可達(dá)分鐘級，能夠?yàn)楣姷牡缆方煌ā⒊鲂新糜翁峁└皶r(shí)、更精細(xì)的氣象服務(wù)。

1.2 系統(tǒng)架構(gòu)設(shè)計(jì)

系統(tǒng)架構(gòu)根據(jù)技術(shù)流程可詳細(xì)劃分為前端顯示層、應(yīng)用服務(wù)層、數(shù)據(jù)存儲層、數(shù)據(jù)處理層和基礎(chǔ)設(shè)施層。每一層實(shí)現(xiàn)其特定的核心任務(wù)，下層為上層提供數(shù)據(jù)或服務(wù)支撐[3]。

1）前端顯示層

前端顯示層即用戶操作界面，顯示系統(tǒng)提供的具體功能并展示相應(yīng)的天氣數(shù)據(jù)，可供用戶直接進(jìn)行操作，并對用戶事件作出響應(yīng)。

2）應(yīng)用服務(wù)層

應(yīng)用服務(wù)層是實(shí)現(xiàn)用戶操作、面向具體應(yīng)用的核心層，可對相關(guān)功能組件進(jìn)行集成與封裝，包括業(yè)務(wù)邏輯、安全組件、訪問接口、定時(shí)任務(wù)、微信鑒權(quán)、服務(wù)網(wǎng)關(guān)、消息組件等內(nèi)容。該層采用REST服務(wù)方式實(shí)現(xiàn)與前端顯示層的請求交互，降低了系統(tǒng)開發(fā)的復(fù)雜性和耦合度，提高了系統(tǒng)的可擴(kuò)展性。

3）數(shù)據(jù)存儲層

數(shù)據(jù)存儲層主要存儲數(shù)據(jù)處理層采集到的各類氣象數(shù)據(jù)，并提供給應(yīng)用服務(wù)層進(jìn)行訪問。此外，還需保存系統(tǒng)運(yùn)行所需的各種數(shù)據(jù)，比如：地圖切片、圖形產(chǎn)品、用戶信息等。采取關(guān)系型數(shù)據(jù)庫和緩存型數(shù)據(jù)庫相結(jié)合的存儲方式來提高并發(fā)處理能力和數(shù)據(jù)傳輸效率。

4）數(shù)據(jù)處理層

負(fù)責(zé)原始數(shù)據(jù)的采集和標(biāo)準(zhǔn)化處理，根據(jù)系統(tǒng)需要的各類氣象數(shù)據(jù)，定時(shí)從不同的數(shù)據(jù)源獲取基礎(chǔ)氣象數(shù)據(jù)，并進(jìn)行必要的預(yù)處理，存放到數(shù)據(jù)庫或者設(shè)定的文件系統(tǒng)目錄。通過對基礎(chǔ)數(shù)據(jù)進(jìn)行解析、轉(zhuǎn)換、分類、整理、清洗等，獲得更加清晰準(zhǔn)確的氣象數(shù)據(jù)。

5）基礎(chǔ)設(shè)施層

基礎(chǔ)設(shè)施層是系統(tǒng)建設(shè)的基礎(chǔ)條件，具體內(nèi)容包含系統(tǒng)運(yùn)行所需的軟硬件環(huán)境、本地/云服務(wù)器、微信認(rèn)證、域名SSL證明等，為微信小程序最終上線發(fā)布提供了基礎(chǔ)保障。

2 小程序的實(shí)現(xiàn)

2.1 技術(shù)框架

本項(xiàng)目技術(shù)選型考慮到產(chǎn)品的性能指標(biāo)和使用體驗(yàn)以及后續(xù)跨端發(fā)布、適配其他平臺等需求，采用SOA分布式架構(gòu)，它是一種支持面向服務(wù)的架構(gòu)樣式，中間件使用Spring Cloud的服務(wù)治理的核心框架來管理整個(gè)系統(tǒng)的服務(wù)。前端開發(fā)框架使用uni-app，該框架使用Vue.js語言開發(fā)各種前端應(yīng)用，開發(fā)者只需編寫一套代碼就可快速發(fā)布到多個(gè)平臺，比如iOS、Android、Web（響應(yīng)式），以及各種小程序（微信、支付寶等）、快應(yīng)用等。系統(tǒng)后臺服務(wù)基于SpringBoot和MyBatis框架進(jìn)行開發(fā)。利用SpringBoot框架，能夠簡單快速搭建一個(gè)Java Web后臺服務(wù)，它是使用最為廣泛的面向服務(wù)的開發(fā)框架之一。MyBatis是一個(gè)基于Java語言的數(shù)據(jù)持久化框架，內(nèi)部封裝了JDBC，并且對JDBC API的底層訪問細(xì)節(jié)進(jìn)行了屏蔽，將Java對象實(shí)體和數(shù)據(jù)庫進(jìn)行了映射，使得開發(fā)者操作數(shù)據(jù)庫變得非常方便。數(shù)據(jù)存儲層主要采用MySQL數(shù)據(jù)庫搭建，為應(yīng)用服務(wù)層提供有效的數(shù)據(jù)支撐。緩存數(shù)據(jù)庫采用Ehcache緩存框架來實(shí)現(xiàn)，以減少對后臺不必要的請求次數(shù)，節(jié)約系統(tǒng)資源。系統(tǒng)后臺服務(wù)以Tomcat作為運(yùn)行平臺，以nginx作為負(fù)載均衡。

2.2 技術(shù)流程

小程序需要通過手機(jī)定位獲取用戶位置信息，為此小程序的前端會(huì)在用戶首次打開時(shí)發(fā)送授權(quán)提醒，獲取用戶位置權(quán)限后，通過調(diào)用微信原生JavaScript SDK接口，獲取用戶的定位坐標(biāo)，再調(diào)用百度或高德地圖API，利用坐標(biāo)轉(zhuǎn)換技術(shù)計(jì)算得到用戶所在位置的城鎮(zhèn)名稱[4]，然后通過Web服務(wù)接口向后臺發(fā)起數(shù)據(jù)請求。后臺Web服務(wù)根據(jù)前端請求的不同類型的數(shù)據(jù)，進(jìn)行數(shù)據(jù)源分析。如果數(shù)據(jù)存儲層有請求的數(shù)據(jù)，則Web服務(wù)向數(shù)據(jù)庫讀取相應(yīng)的數(shù)據(jù)，然后對數(shù)據(jù)進(jìn)行處理加工，將生成的數(shù)據(jù)文件返回到前端，經(jīng)過頁面視圖的渲染后呈現(xiàn)給用戶；如果數(shù)據(jù)不存在，數(shù)據(jù)處理層會(huì)進(jìn)行即時(shí)處理，向數(shù)據(jù)庫寫入數(shù)據(jù)后再將結(jié)果反饋給前端。除了基本的氣象數(shù)據(jù)，系統(tǒng)還應(yīng)用了一些外部數(shù)據(jù)服務(wù)，獲取數(shù)據(jù)的API接口主要包括中國天氣網(wǎng)天氣數(shù)據(jù)接口、百度或高德地圖數(shù)據(jù)接口等。小程序需要的氣象數(shù)據(jù)包括：氣象預(yù)警信息數(shù)據(jù)、城鎮(zhèn)天氣預(yù)報(bào)數(shù)據(jù)、實(shí)況觀測氣象數(shù)據(jù)、天氣雷達(dá)數(shù)據(jù)、生活氣象指數(shù)預(yù)報(bào)數(shù)據(jù)、空氣質(zhì)量實(shí)況和預(yù)報(bào)數(shù)據(jù)、日出日落數(shù)據(jù)等。在綜合考慮了預(yù)報(bào)準(zhǔn)確度和系統(tǒng)復(fù)雜度等問題后，本系統(tǒng)所用到的氣象數(shù)據(jù)，比如未來15天城鎮(zhèn)預(yù)報(bào)和逐小時(shí)模式預(yù)報(bào)數(shù)據(jù)，均通過中國天氣網(wǎng)API通用數(shù)據(jù)接口平臺獲取。

2.3 前端界面設(shè)計(jì)

小程序根據(jù)功能模塊結(jié)構(gòu)和“內(nèi)蒙古天氣”微信公眾號的底部菜單欄進(jìn)行了結(jié)合，將菜單欄和三個(gè)功能模塊一一對應(yīng)。菜單欄的第一個(gè)模塊的第一項(xiàng)內(nèi)容，即“看天氣”模塊也是小程序的默認(rèn)首頁，用戶從其他渠道比如掃二維碼等方式進(jìn)入小程序會(huì)直接打開該頁面。首頁的界面設(shè)計(jì)遵從了簡潔實(shí)用的原則，排版布局比較清晰美觀，符合當(dāng)下主流的移動(dòng)端天氣應(yīng)用的設(shè)計(jì)范式。在交互設(shè)計(jì)方面突出了操作便捷、功能明確等特點(diǎn)，為了提高用戶體驗(yàn)度，各個(gè)功能均以醒目圖標(biāo)為入口，降低用戶使用門檻。

下面以從上到下的順序?qū)κ醉摻缑嬖O(shè)計(jì)進(jìn)行說明：首頁的頁面頂部顯示用戶當(dāng)前的定位位置，在上部主體區(qū)域顯示的是基于用戶當(dāng)前位置的天氣實(shí)況信息，包括實(shí)時(shí)氣溫和天氣現(xiàn)象以及實(shí)時(shí)空氣質(zhì)量指數(shù)，其中空氣質(zhì)量指數(shù)可點(diǎn)擊跳轉(zhuǎn)至空氣質(zhì)量指數(shù)詳情頁。在其之下顯示的是用戶當(dāng)前位置的自動(dòng)站實(shí)況數(shù)據(jù)，展示的氣象要素包括風(fēng)力風(fēng)向、降水量、相對濕度、氣壓和能見度。此區(qū)域還會(huì)顯示最新預(yù)警信息的提示圖標(biāo)，點(diǎn)擊可跳轉(zhuǎn)至預(yù)警信息詳情頁。頁面的中間部分主要顯示天氣預(yù)報(bào)數(shù)據(jù)，首先展示的是今明兩天天氣預(yù)報(bào)，這樣設(shè)計(jì)的好處是用戶在打開頁面時(shí)將會(huì)快速獲得最有用的信息。接下來是24小時(shí)預(yù)報(bào)，展示的是逐小時(shí)模式預(yù)報(bào)數(shù)據(jù)，氣象要素包括溫度、天氣現(xiàn)象和風(fēng)力風(fēng)向。再下面是15天預(yù)報(bào)，即城鎮(zhèn)天氣預(yù)報(bào)，展示的氣象要素包括最高/最低氣溫、天氣現(xiàn)象、風(fēng)力風(fēng)向和空氣質(zhì)量預(yù)報(bào)。頁面的靠下部分顯示的是城市生活氣象指數(shù)，展示的氣象指數(shù)包括紫外線強(qiáng)度、運(yùn)動(dòng)指數(shù)、穿衣指數(shù)和洗車指數(shù)。頁面的最底部是日出日落顯示區(qū)域，展示用戶當(dāng)前位置的日出日落時(shí)間。小程序首頁界面展示如圖2所示。

2.4 后臺數(shù)據(jù)處理

后臺數(shù)據(jù)處理的流程首先是進(jìn)行數(shù)據(jù)采集，通過數(shù)據(jù)采集系統(tǒng)將不同數(shù)據(jù)源的氣象產(chǎn)品和原始數(shù)據(jù)集中采集、存儲至數(shù)據(jù)庫服務(wù)器[5]；然后由數(shù)據(jù)處理系統(tǒng)對原始數(shù)據(jù)進(jìn)行解析、轉(zhuǎn)換、文件名校驗(yàn)等標(biāo)準(zhǔn)化處理，同時(shí)進(jìn)行數(shù)據(jù)加密和數(shù)據(jù)壓縮，以提升安全性和節(jié)省存儲空間；最后使用Spring和MyBatis框架，開發(fā)符合標(biāo)準(zhǔn)WebService接口規(guī)范的API接口服務(wù)，包括天氣實(shí)況、天氣預(yù)報(bào)、氣象預(yù)警和圖形產(chǎn)品等數(shù)據(jù)接口，實(shí)現(xiàn)前端和后臺數(shù)據(jù)的交互。接口主要由服務(wù)地址、接口ID、接口參數(shù)和返回格式四部分組成，系統(tǒng)為每個(gè)數(shù)據(jù)源分配了一個(gè)唯一的接口ID，該ID能反映接口的基本功能、數(shù)據(jù)種類和檢索條件等信息。

3 結(jié)束語

通過開發(fā)基于微信小程序的公眾氣象服務(wù)應(yīng)用，滿足了公眾希望快速便捷查看天氣信息的需求，將精細(xì)化氣象服務(wù)產(chǎn)品和主流媒體渠道進(jìn)行了對接，有效提高了用戶體驗(yàn)和氣象服務(wù)質(zhì)量，為內(nèi)蒙古氣象部門

進(jìn)行公眾氣象服務(wù)拓寬了新的渠道，體現(xiàn)了氣象工作與時(shí)俱進(jìn)、服務(wù)至上的宗旨。

目前“內(nèi)蒙古天氣”微信小程序已完成大部分軟件開發(fā)，部分模塊仍在進(jìn)行調(diào)試、優(yōu)化和改進(jìn)。下一步，將繼續(xù)深入研究微信小程序，挖掘公眾對氣象服務(wù)的需求，繼續(xù)設(shè)計(jì)和開發(fā)更多精細(xì)化、定制化的氣象服務(wù)產(chǎn)品。同時(shí)由于小程序可以在后臺與公眾號進(jìn)行關(guān)聯(lián)，今后將加強(qiáng)公眾號和小程序的運(yùn)營推廣，利用微信的普及率，持續(xù)擴(kuò)大公眾氣象服務(wù)的覆蓋范圍，推動(dòng)公眾氣象服務(wù)向高質(zhì)量和多元化目標(biāo)邁進(jìn)。

參考文獻(xiàn)：

[1] 張鋒，鄧闖，李建，等.基于微信“小程序”的公眾氣象服務(wù)應(yīng)用[J].氣象科技，2019，47（2）：361-366.

[2] 曹銳怡.基于微信小程序的上下學(xué)出行氣象服務(wù)產(chǎn)品設(shè)計(jì)與實(shí)現(xiàn)[J].中國新通信，2021，23（14）：30-31.

[3] 王家樂.基于微信的“雨在哪” 小程序設(shè)計(jì)與實(shí)現(xiàn)[J].電腦知識與技術(shù)，2021，17（15）：82-84.

[4] 隋遠(yuǎn)琦，潘靜，那月光，等.基于天氣預(yù)警信息服務(wù)的微信小程序設(shè)計(jì)[J].現(xiàn)代信息科技，2023，7（10）：6-9.

[5] 司林青.基于微信小程序的空管氣象服務(wù)應(yīng)用[J].信息與電腦（理論版），2022，34（11）：102-104.

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