基于微信小程序的天氣預(yù)報(bào)平臺(tái)的設(shè)計(jì)與實(shí)現(xiàn)

毛雨萱，楊平恒

(西南大學(xué)地理科學(xué)學(xué)院，重慶400715)

天氣與人們息息相關(guān)，天氣預(yù)報(bào)是很多人每天都要關(guān)注的事情。每一個(gè)群體，不分年齡和層次，有很多人每天都會(huì)去關(guān)注天氣情況。人們可以通過電視臺(tái)、App 來查詢天氣情況，也可以通過微信小程序來關(guān)注天氣情況。微信小程序是一種不需要下載和安裝即可使用的應(yīng)用，它實(shí)現(xiàn)了應(yīng)用的“觸手可及”。文章基于B/S架構(gòu)，以微信小程序?yàn)檩d體，充分利用微信小程序在SNS 平臺(tái)上的地位，使用JavaScript、WXSS、WXML、PHP 等編程語言，設(shè)計(jì)了一款天氣預(yù)報(bào)平臺(tái)，解決了隨時(shí)隨地了解天氣情況的問題。

1 開發(fā)原理

1.1 微信小程序

微信小程序并非一個(gè)憑空而生的概念[1]，小程序底層主要由Hybrid 技術(shù)進(jìn)行渲染，界面使用成熟的Web 技術(shù)渲染，并輔以大量的接口提供豐富的客戶端原生能力。小程序底層使用雙線程結(jié)構(gòu)，將渲染和邏輯運(yùn)算任務(wù)分開，防止UI進(jìn)程和腳本進(jìn)程互相干擾，解決了頁面卡頓、應(yīng)用加載過慢的問題，從而使小程序能夠快速加載。當(dāng)前微信小程序處于蓬勃發(fā)展階段，但功能的簡(jiǎn)單堆砌，微交互中細(xì)節(jié)的忽略，造成了使用者的體驗(yàn)不佳。所以，除了要滿足基本使用需求，設(shè)計(jì)師更應(yīng)該注重界面中的一些日常操作行為的細(xì)節(jié)點(diǎn)。

1.2 微信小程序開發(fā)技術(shù)簡(jiǎn)介

微信可以說是目前國內(nèi)使用率最高，覆蓋面最廣的App。微信擁有龐大的用戶基礎(chǔ)，微信小程序的相關(guān)開發(fā)也很熱門。只要是支持動(dòng)態(tài)網(wǎng)頁開發(fā)的編程語言，例如：PHP、Java、ASP.NET、Ruby、Python、Note.js等，基本都可以用來進(jìn)行微信小程序的開發(fā)，微信小程序開發(fā)的語言有許多，開發(fā)人員可以選擇自己最擅長(zhǎng)的編程語言進(jìn)行開發(fā)。微信小程序的開發(fā)大部分是來源于Java和PHP技術(shù)，因而開發(fā)起來相對(duì)都比較簡(jiǎn)單便捷。

微信小程序是一種基于微信平臺(tái)的，不需要下載安裝即可使用的應(yīng)用，包含客戶端和服務(wù)端。客戶端使用WXML、WXSS和JavaScript 語言進(jìn)行開發(fā)。WXML是為微信小程序框架設(shè)計(jì)的一套標(biāo)簽語言；WXSS是用于描述WXML組件樣式的一套樣式語言；JavaScript 是一種具有函數(shù)優(yōu)先性的輕量級(jí)、解釋型的編程語言。服務(wù)端使用PHP 語言開發(fā)，以MySQL 數(shù)據(jù)庫和本地磁盤作為存儲(chǔ)媒介，以NGINX 服務(wù)器作為運(yùn)行介質(zhì)。小程序類似于H5 表單，需要掌握WXML 和WXSS,以及基于JavaS‐cript的邏輯層框架。這里的WXML等同于Html，而WXSS等同于CSS。

1)微信小程序的WXML

WXML 語言的編程概念類似于Html 網(wǎng)頁的編程技術(shù)。微信小程序的技術(shù)含量要求不高，只是更換了一些標(biāo)簽。即使不太擅長(zhǎng)開發(fā)前端的開發(fā)人員，轉(zhuǎn)用微信小程序，也是很快就能上手的。

2)微信小程序的WXSS

微信用自己的開發(fā)語言WXSS 代替了Web 編程中的CSS。WXSS 只是對(duì)CSS 的某些標(biāo)簽做了簡(jiǎn)單的替換，其中大部分是原始的CSS。主要的實(shí)現(xiàn)思想與Web開發(fā)技術(shù)基本相同，它們都是通過調(diào)用同一頁面來實(shí)現(xiàn)的，微信小程序比Web開發(fā)更簡(jiǎn)單，更方便。

3)微信小程序的JS

如果要開發(fā)微信小程序，必須精通JS。只要具有Html、CSS、JS 的基礎(chǔ)，就可以使用微信小程序JS，進(jìn)行前端開發(fā)。簡(jiǎn)單模式如圖1所示。

圖1 簡(jiǎn)單模式

4)微信小程序的JavaScript[2]

本文采用Java進(jìn)行微信公眾平臺(tái)開發(fā)，需要掌握J(rèn)ava基礎(chǔ)知識(shí)、JSP、Servlet、JavaBean和JDBC(操作數(shù)據(jù)庫)。Java 編程語言是一種化繁為簡(jiǎn)的編程技術(shù)，可以參照同類開發(fā)技術(shù)的優(yōu)點(diǎn)，摒棄缺點(diǎn)。利用Java 編程語言編寫的程序具有獨(dú)立的體系結(jié)構(gòu)，可以將交互式動(dòng)畫轉(zhuǎn)換成占用內(nèi)存較少的編程代碼，可以達(dá)到減小內(nèi)存的目的，并且在優(yōu)化編程布局方面，也具有很明顯的優(yōu)勢(shì)。

除了以上幾個(gè)開發(fā)技術(shù)，還需要掌握J(rèn)SON。JSON 是微信小程序的主要和次要接口。開發(fā)者可以通過JSON控制上下菜單欄、頁面的顯示順序。JSON僅適用于基本小程序的框架，除顯示類型外，每個(gè)前端操作都需要與后端匹配。修改源代碼后，需將其提交，進(jìn)行審核，用戶只能在審核通過后才能看到修改。

明確劃分各級(jí)護(hù)理人員的職責(zé)以及工作標(biāo)準(zhǔn),并將具體的職責(zé)層層分解具體到個(gè)人,術(shù)前完善器械以及儀器相關(guān)檢查,術(shù)前1d集中訪視患者,并于術(shù)日護(hù)理人員在手術(shù)室門口做好迎接、交接工作,根據(jù)手術(shù)內(nèi)容護(hù)理做好相應(yīng)的配合,術(shù)后常規(guī)管理,手術(shù)全程中需進(jìn)行質(zhì)量監(jiān)控。

2 GPS 定位技術(shù)

GPS全球衛(wèi)星定位導(dǎo)航系統(tǒng)，開始只適用于軍事領(lǐng)域，后逐步轉(zhuǎn)為民用，進(jìn)而被廣泛應(yīng)用于商業(yè)和科學(xué)研究等領(lǐng)域。GPS定位技術(shù)的基本原理就是將接收機(jī)接收到的信號(hào)經(jīng)過精細(xì)的誤差處理，再進(jìn)行精確的解碼分析，得到具體的位置信息，最后將位置信息傳送給連接設(shè)備。連接設(shè)備對(duì)該信息進(jìn)行精確的計(jì)算和變換后，最終將信息準(zhǔn)確快速地傳遞給移動(dòng)終端。GPS定位技術(shù)可為用戶提供準(zhǔn)確的隨時(shí)隨地的位置信息服務(wù)[3]。

在移動(dòng)通信網(wǎng)絡(luò)中，通常會(huì)使用到以下幾種定位技術(shù)[4]:一是基于Cell ID 的定位技術(shù)，它首先獲取用戶當(dāng)前所在的基站Cell信息，其精確度取決于移動(dòng)基站的分布密度及覆蓋范圍的大小；二是基于AFLT(前向鏈路三角定位法)的定位技術(shù)，是CD‐MA獨(dú)有的技術(shù)。在進(jìn)行定位操作時(shí)，手機(jī)終端同時(shí)監(jiān)聽至少三個(gè)基站的導(dǎo)頻信息，利用碼片時(shí)延來確定用戶當(dāng)前位置到最近基站的距離，再利用三角定位法，從而準(zhǔn)確地算出用戶的具體位置；三是基于AGPS的定位技術(shù)，簡(jiǎn)化了設(shè)備終端的煩瑣工作，采用復(fù)雜的定位算法，由定位服務(wù)器與終端相互緊密配合，從而降低接收信號(hào)弱、干擾多等不利因素。定位平臺(tái)將經(jīng)緯度信息，精確傳送到應(yīng)用服務(wù)平臺(tái)，或者通過無線網(wǎng)絡(luò)送回服務(wù)終端，從而提高定位精度和靈敏度，最大精確度地完成定位工作。

GPS定位技術(shù)具有操作方便，使用靈活的優(yōu)勢(shì)。在布網(wǎng)和觀測(cè)時(shí)，不受時(shí)間、空間、地形條件的任何限制，具有高效率、高精度、觀測(cè)和數(shù)據(jù)處理的自動(dòng)化程度高等優(yōu)勢(shì)。GPS 的引進(jìn)與推廣應(yīng)用，標(biāo)志著高新技術(shù)已滲入方方面面的領(lǐng)域，在城市建設(shè)規(guī)劃、土地勘察利用、公路水利建設(shè)、科技商業(yè)發(fā)展、人民生活水準(zhǔn)等方面發(fā)揮了重要作用。

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

在微信小程序開發(fā)者平臺(tái)上設(shè)置合法范文域名，需要用到下面兩個(gè)API域名。注冊(cè)和風(fēng)天氣平臺(tái)(https://dev.qweather.com/)的開發(fā)者賬號(hào)及天氣API(https://tianqiapi.com/index/doc?version=v6)的開發(fā)者賬號(hào)，后續(xù)獲取相關(guān)天氣氣象的精準(zhǔn)數(shù)據(jù)時(shí)，需要在訪問鏈接中填入APPID，和風(fēng)API一日可訪問16700次，天氣API僅可訪問300次，超出即可通過更換IP的方式繼續(xù)訪問。

3.1 提取城市坐標(biāo)

每個(gè)城市為滿足國土規(guī)劃、城市建設(shè)、民政管理、水利建設(shè)等測(cè)繪工作與管理的需要，都需要建立自己獨(dú)立的坐標(biāo)系，就是城市坐標(biāo)系。城市坐標(biāo)系是建立在各城市的基礎(chǔ)控制網(wǎng)和與國家法定坐標(biāo)系相聯(lián)系的基礎(chǔ)上的。從2008年7月1日起，國家啟用2000 國家大地坐標(biāo)系，之前的法定坐標(biāo)系1954 北京坐標(biāo)系、1980西安坐標(biāo)系，都停止使用了。2000國家大地坐標(biāo)系的城市坐標(biāo)系的建立是利用2000橢球參數(shù)和高斯－克呂格投影來實(shí)現(xiàn)的。國家標(biāo)準(zhǔn)坐標(biāo)系在采用平面坐標(biāo)時(shí)，投影帶一般是6 度帶和3 度帶，這種投影不一定和城市的中央子午線接近，這就造成了投影變形過大的問題。為控制變形，各城市都需要在國家大地坐標(biāo)系的基礎(chǔ)上，建立自己獨(dú)立的城市坐標(biāo)系。由于國家控制網(wǎng)的精度只能滿足中、小比例尺測(cè)圖的要求，許多城市為了適應(yīng)城市規(guī)劃與建設(shè)管理，為了滿足各類工程的勘察設(shè)計(jì)、施工管理、地形測(cè)繪、地籍測(cè)量等需要，從而誕生了高精度的城市坐標(biāo)系。

以無錫市為例，無錫城市坐標(biāo)系是2015年啟動(dòng)了市區(qū)D級(jí)GPS 控制網(wǎng)布測(cè)項(xiàng)目，結(jié)合2000 國家大地坐標(biāo)系，對(duì)城市已有的基礎(chǔ)控制網(wǎng)，進(jìn)行升級(jí)改造而建立的。城市坐標(biāo)系的建立要根據(jù)城市地理位置和平均高程等實(shí)際情況來確定。無錫主要為平原地區(qū)，所以可以沿用橢球面作為高程投影面，盡可能與現(xiàn)有坐標(biāo)系保持一致。無錫市現(xiàn)有坐標(biāo)系的中央子午線均為120°，若將城市坐標(biāo)系設(shè)置為120°18′，那么采用四參數(shù)模型進(jìn)行現(xiàn)有坐標(biāo)系到城市坐標(biāo)系進(jìn)行轉(zhuǎn)換時(shí)，兩坐標(biāo)系投影的中央子午線會(huì)不一致。因此，轉(zhuǎn)換前需將重合點(diǎn)的坐標(biāo)系換算至同一中央子午線[5]。

通過調(diào)用無錫官方提供的應(yīng)用程序接口，獲取無錫的城市坐標(biāo)“116.41,39.92”，如果獲取失敗則喚起權(quán)限給予彈窗，如果始終無法獲取到城市坐標(biāo)，則保存一個(gè)默認(rèn)坐標(biāo)用于小程序顯示。提取無錫的城市坐標(biāo)系的代碼如圖2、圖3所示。

圖2 提取無錫的城市坐標(biāo)系的代碼

圖3 提取無錫的城市坐標(biāo)系的代碼

接下來通過循環(huán)語句依次調(diào)用自定義函數(shù)，獲取與城市相關(guān)的信息。代碼如圖4所示。

圖4 獲取與城市相關(guān)的信息

在此基礎(chǔ)上，通過定義數(shù)組，事前存入北京、上海、重慶等各大城市的坐標(biāo)信息，這里以北京為例。設(shè)計(jì)代碼如圖5所示。

圖5 提取北京GPS坐標(biāo)

根據(jù)各個(gè)城市的GPS坐標(biāo)獲取相關(guān)城市信息，主要是獲取城市名稱。設(shè)計(jì)代碼如圖6所示。

圖6 提取城市信息

3.2 調(diào)用天氣預(yù)報(bào)數(shù)據(jù)

以無錫天氣預(yù)報(bào)為例，首先獲取24 小時(shí)天氣情況。設(shè)計(jì)代碼如圖7所示。

圖7 獲取24小時(shí)天氣情況

將獲取到的24小時(shí)天氣情況的數(shù)據(jù)中的時(shí)間單獨(dú)提取出來并通過hours2數(shù)組存儲(chǔ)，設(shè)計(jì)代碼如圖8所示。

圖8 提取24小時(shí)天氣情況數(shù)據(jù)中的時(shí)間

以此類推，獲取最近7日天氣數(shù)據(jù)。設(shè)計(jì)代碼如圖9所示。

圖9 獲取最近7日天氣數(shù)據(jù)

4 結(jié)論

在當(dāng)今的移動(dòng)互聯(lián)網(wǎng)不斷發(fā)展和新媒體技術(shù)不斷推廣應(yīng)用的時(shí)代背景下，用戶越來越希望能快速準(zhǔn)確地獲取各種信息，微信小程序與手機(jī)App 相比具有很強(qiáng)的競(jìng)爭(zhēng)優(yōu)勢(shì)，這是用戶輕應(yīng)用、重需求的集中體現(xiàn)。本文設(shè)計(jì)的基于微信小程序的天氣發(fā)布平臺(tái)具有界面美觀、操作便捷等特點(diǎn)，非常符合小程序的設(shè)計(jì)初衷，即使未接觸過類似平臺(tái)的使用者，也能迅速熟悉其功能并進(jìn)行相應(yīng)的操作。本平臺(tái)經(jīng)過用戶界面、功能和性能測(cè)試，能夠應(yīng)對(duì)用戶不規(guī)范操作、數(shù)據(jù)重復(fù)提交等行為，具有較高的實(shí)用價(jià)值。綜合以上，微信小程序需要充分考慮到用戶在使用產(chǎn)品時(shí)的具體行為和用戶在操作每一步時(shí)的體驗(yàn)感，以促進(jìn)微信小程序的完善與發(fā)展。