導(dǎo)語(yǔ)：氣象信保業(yè)務(wù)導(dǎo)航系統(tǒng)設(shè)計(jì)研究一文來(lái)源于網(wǎng)友上傳，不代表本站觀(guān)點(diǎn)，若需要原創(chuàng)文章可咨詢(xún)客服老師，歡迎參考。

摘要：針對(duì)目前莆田市氣象局系統(tǒng)內(nèi)不存在獨(dú)立的信息網(wǎng)絡(luò)與裝備保障業(yè)務(wù)導(dǎo)航系統(tǒng)，日常的運(yùn)行監(jiān)控或查看信息網(wǎng)絡(luò)安全等網(wǎng)頁(yè)地址都是保存在瀏覽器的收藏欄中。為方便保障信息網(wǎng)絡(luò)安全與裝備保障的業(yè)務(wù)使用以及日常查找方便，采用前后端分離方式開(kāi)發(fā)了莆田市氣象局的信保業(yè)務(wù)導(dǎo)航系統(tǒng)。該系統(tǒng)前端主要由Vue.js框架以及Element-UI組件組成，后端主要由SpringBoot，MySQL等組成，其提供氣象信保部門(mén)快捷登入查詢(xún)各個(gè)業(yè)務(wù)系統(tǒng)、訪(fǎng)問(wèn)日常值班等功能。

關(guān)鍵詞：業(yè)務(wù)導(dǎo)航系統(tǒng)；瀏覽器；前后端分離

隨著計(jì)算機(jī)的發(fā)展，信息化時(shí)代的到來(lái)，氣象局業(yè)務(wù)不斷擴(kuò)展，為了管理方便而不斷構(gòu)建相關(guān)信息化系統(tǒng)。信息化系統(tǒng)的構(gòu)建能夠帶來(lái)許多工作上的便利，其中最好的地方就是為氣象部門(mén)與用戶(hù)之間架起一座網(wǎng)絡(luò)信息的橋梁，提供了一個(gè)互相交流的平臺(tái)，可以滿(mǎn)足用戶(hù)對(duì)氣象問(wèn)題的查閱需求，解決用戶(hù)的問(wèn)題。同時(shí)，推動(dòng)氣象服務(wù)信息化有助于氣象部門(mén)與用戶(hù)的互動(dòng)，在互相了解問(wèn)題的過(guò)程中，解決群眾對(duì)氣象問(wèn)題的困惑，提高了群眾對(duì)氣象工作的理解與支持，并根據(jù)要求不斷反省自我，促進(jìn)氣象服務(wù)工作不斷進(jìn)步[1]。目前市級(jí)氣象信息網(wǎng)絡(luò)保障部門(mén)的主要工作職責(zé)有承擔(dān)全市骨干通信網(wǎng)絡(luò)系統(tǒng)和機(jī)房環(huán)境的規(guī)劃設(shè)計(jì)、系統(tǒng)管理、運(yùn)行維護(hù)和技術(shù)指導(dǎo)；負(fù)責(zé)全市氣象探測(cè)設(shè)備運(yùn)行狀態(tài)和數(shù)據(jù)上行、下行傳輸?shù)谋O(jiān)控，承擔(dān)市局各類(lèi)氣象資料的接收、傳輸和管理；負(fù)責(zé)全市視頻電視會(huì)商系統(tǒng)的運(yùn)行保障，配合省氣象信息中心對(duì)省—市—縣視頻通信系統(tǒng)建設(shè)和維護(hù)；為氣象政務(wù)管理信息系統(tǒng)、福建省突發(fā)事件預(yù)警信息發(fā)布系統(tǒng)、莆田市縣氣象業(yè)務(wù)集約化系統(tǒng)等業(yè)務(wù)系統(tǒng)的運(yùn)行提供維護(hù)保障和技術(shù)支；負(fù)責(zé)全市國(guó)家級(jí)自動(dòng)氣象站設(shè)備故障的快捷反應(yīng)和在重大災(zāi)害性天氣過(guò)程中特定設(shè)備的重點(diǎn)保障工作；承擔(dān)對(duì)縣級(jí)自動(dòng)站維修維護(hù)的遠(yuǎn)程技術(shù)支持；負(fù)責(zé)全市常規(guī)氣象觀(guān)測(cè)儀器、自動(dòng)站設(shè)備、大型氣象設(shè)備的計(jì)量和檢定管理工作。為了方便管理以及了解各個(gè)設(shè)備信息，大部分工作都通過(guò)網(wǎng)絡(luò)查看設(shè)備信息以及操控相關(guān)設(shè)備，因此有多達(dá)十幾個(gè)信息化系統(tǒng)。這些信息化系統(tǒng)的網(wǎng)頁(yè)地址通常都保存在瀏覽器的收藏夾中，雖然可以通過(guò)瀏覽器自帶的收藏夾文件管理進(jìn)行分類(lèi)，但展示的信息還是不夠明晰，偶爾還需要登入才能具體清楚是哪個(gè)業(yè)務(wù)系統(tǒng)，為了方便氣象信息網(wǎng)絡(luò)保障部門(mén)值班人員日常工作，因此構(gòu)建莆田信保業(yè)務(wù)導(dǎo)航系統(tǒng)。

1需求分析

根據(jù)信息網(wǎng)絡(luò)保障部門(mén)的日常值班登入查看系統(tǒng)的頻率以及各個(gè)業(yè)務(wù)劃分情況，該系統(tǒng)的主要結(jié)構(gòu)功能如圖1所示，系統(tǒng)功能包含綜合觀(guān)測(cè)、業(yè)務(wù)支撐、氣象數(shù)據(jù)、用戶(hù)管理。綜合觀(guān)測(cè)、業(yè)務(wù)支撐、氣象數(shù)據(jù)都是通過(guò)點(diǎn)擊即可查看相關(guān)鏈接。用戶(hù)管理即設(shè)置可登入該系統(tǒng)的用戶(hù)，方便信息網(wǎng)絡(luò)保障部門(mén)自主添加管理員。

2系統(tǒng)設(shè)計(jì)與實(shí)現(xiàn)

本文根據(jù)莆田市氣象局所擁有的電腦性能配置以及維保人員的人數(shù)，選擇前后端分離搭建系統(tǒng)方便查看以及權(quán)限管理，前后端分離的開(kāi)發(fā)模式可以提高代碼的可讀性、降低代碼的冗雜程度、可重用性增強(qiáng)，因?yàn)槭欠謩e部署，所有系統(tǒng)的性能也會(huì)有所提升。在前后端分離的開(kāi)發(fā)模式中，開(kāi)發(fā)者只需各司其職，后端程序員只負(fù)責(zé)業(yè)務(wù)邏輯，向前端程序員提供API接口。前端人員負(fù)責(zé)將API接口上獲得的數(shù)據(jù)渲染到HTML頁(yè)面上。前后端分離實(shí)現(xiàn)了項(xiàng)目的可擴(kuò)展性、維護(hù)性以及分工的明確性[2]。

2.1總體設(shè)計(jì)

本系統(tǒng)采用B/S結(jié)構(gòu)，其擁有成本低、維護(hù)方便、分布性強(qiáng)、開(kāi)發(fā)簡(jiǎn)單，任何一臺(tái)內(nèi)網(wǎng)計(jì)算機(jī)都能進(jìn)行訪(fǎng)問(wèn)操作。信息系統(tǒng)應(yīng)用JAVA技術(shù)，通過(guò)Web-Service服務(wù)的方式完成對(duì)外的整合和服務(wù)。后端基于springboot、Mybatis等主流的J2EE應(yīng)用開(kāi)發(fā)框架，以組件化開(kāi)發(fā)模式進(jìn)行業(yè)務(wù)導(dǎo)航系統(tǒng)的構(gòu)建，并以RestfulAPI方式為前端提供服務(wù)；前端采用Vue.js框架進(jìn)行展示層的開(kāi)發(fā)，在易用性、友好性等方面，借助Web2.0和Ajax技術(shù)，實(shí)現(xiàn)信息系統(tǒng)的完美展現(xiàn)和交互功能[3]。

2.2系統(tǒng)前端

前端采用Vue.js框架，Vue.js是一種用于搭建軟件界面的漸進(jìn)式前端框架。它采用自下而上的增量開(kāi)發(fā)設(shè)計(jì)方法，對(duì)于搭建信息化系統(tǒng)來(lái)說(shuō)是一種簡(jiǎn)單的體系結(jié)構(gòu)，具備更加靈活且開(kāi)放自由的代碼模式，有利于信息網(wǎng)絡(luò)保障部門(mén)人員基礎(chǔ)入門(mén)上手維護(hù)，Vue.js發(fā)展至今日漸完善，存在著大量現(xiàn)有集成代碼與項(xiàng)目供開(kāi)發(fā)者使用，其中Vue-router、Axios、El-ement-Ui等插件使用較廣且方便[4]。VueRouter是Vue.js的官方路由，它與Vue.js核心深度集成，讓用Vue.js構(gòu)建單頁(yè)應(yīng)用變得輕而易舉。ElementUI是一套為開(kāi)發(fā)者、設(shè)計(jì)師和產(chǎn)品經(jīng)理準(zhǔn)備的基于Vue2.0的桌面端組件庫(kù)，包含了一套設(shè)計(jì)原則、組件和組件，還提供如Axure組件、Sketch模板的設(shè)計(jì)資源。Axios是一個(gè)基于promise的HTTP庫(kù)，是一款高效的HTTP請(qǐng)求插件。

2.3系統(tǒng)后端

SpringBoot框架是基于Spring框架而進(jìn)一步封裝的開(kāi)源的輕量級(jí)框架。SpringBoot可以建立獨(dú)立的Spring應(yīng)用程序，內(nèi)置服務(wù)端容器，不需要部署工作，簡(jiǎn)化了煩瑣的xml文件配置，可自動(dòng)配置Spring，簡(jiǎn)化Maven的配置。SpirngBoot是基于Spring的條件注冊(cè)的一套快速開(kāi)發(fā)整合包。SpringBoot集成MyBatis。MyBatis是一個(gè)簡(jiǎn)化和實(shí)現(xiàn)了Java數(shù)據(jù)持久化層(persistencelayer)的開(kāi)源框架，它抽象了大量的JDBC冗余代碼，并提供了一個(gè)簡(jiǎn)單易用的API和數(shù)據(jù)庫(kù)交互。在Spin-gBoot中，只需要POM文件設(shè)置Mybatis的依賴(lài)，即可實(shí)現(xiàn)數(shù)據(jù)庫(kù)的持久化[5]。

2.4系統(tǒng)實(shí)現(xiàn)

根據(jù)上述的系統(tǒng)設(shè)計(jì)以及功能需求，本文構(gòu)建如下氣象信保業(yè)務(wù)導(dǎo)航系統(tǒng)設(shè)計(jì)，系統(tǒng)的登入界面如圖2所示，包含用戶(hù)登入信息顯示、登入名、登入密碼以及登錄按鍵。為了方便管理以及提高系統(tǒng)安全性，并未創(chuàng)建用戶(hù)注冊(cè)功能，只有通過(guò)管理員添加的用戶(hù)才可以登入系統(tǒng)查閱鏈接信息。前端代碼如下：登入氣象信保業(yè)務(wù)導(dǎo)航系統(tǒng)后，該系統(tǒng)界面的側(cè)邊欄顯示效果如圖3所示，其根據(jù)需求所設(shè)計(jì)相關(guān)菜單功能。由圖3可見(jiàn)，氣象信保業(yè)務(wù)導(dǎo)航系統(tǒng)側(cè)邊欄可選擇綜合觀(guān)測(cè)、業(yè)務(wù)支撐、氣象數(shù)據(jù)、用戶(hù)管理功能，其中用戶(hù)管理可以根據(jù)部門(mén)不同修改相關(guān)菜單欄的查閱權(quán)限，不同用戶(hù)可以查看的側(cè)邊欄菜單會(huì)有所不同。前端的代碼如下：關(guān)于系統(tǒng)數(shù)據(jù)庫(kù)表的設(shè)計(jì)，本文的用戶(hù)人員信息數(shù)據(jù)庫(kù)表結(jié)構(gòu)如表1所示，表中包含用戶(hù)姓名以及用戶(hù)密碼。

2.5運(yùn)行結(jié)果

該系統(tǒng)目前尚在運(yùn)行測(cè)試中，能夠初步實(shí)現(xiàn)設(shè)計(jì)的需求，側(cè)邊欄菜單功能根據(jù)信息管理的類(lèi)別劃分，點(diǎn)擊側(cè)邊欄目錄可以直接進(jìn)入相關(guān)展示頁(yè)面，但依然存在的一些問(wèn)題，如顯示的界面不夠美觀(guān)，整體布局不夠協(xié)調(diào)，鏈接說(shuō)明不夠清楚，點(diǎn)擊鏈接中不包含該管理系統(tǒng)的用戶(hù)名以及密碼，依然需要再次手動(dòng)輸入用戶(hù)名和密碼，菜單欄沒(méi)有自行添加功能，不利于該系統(tǒng)在內(nèi)部推廣。

3結(jié)語(yǔ)

根據(jù)氣象信息網(wǎng)絡(luò)保障部門(mén)的日常值班情況以及常用業(yè)務(wù)需求，設(shè)計(jì)并搭建了氣象信保業(yè)務(wù)導(dǎo)航系統(tǒng)，系統(tǒng)采用B/S結(jié)構(gòu)開(kāi)發(fā)，界面顯示簡(jiǎn)潔，初步實(shí)現(xiàn)氣象信保業(yè)務(wù)相關(guān)信息系統(tǒng)顯示，通過(guò)側(cè)邊欄的分類(lèi)設(shè)計(jì)，較為清楚的展示不同功能的信息化管理系統(tǒng)。除此之外，該系統(tǒng)增加了權(quán)限，用戶(hù)需要登入才能訪(fǎng)問(wèn)該系統(tǒng)。

參考文獻(xiàn)：

[1]張忠勇.計(jì)算機(jī)網(wǎng)絡(luò)技術(shù)在氣象領(lǐng)域中的應(yīng)用[J].無(wú)線(xiàn)互聯(lián)科技,2021,17:79-80.

[2]鄒瑞,段華瓊.基于前后端分離技術(shù)的在線(xiàn)商城的設(shè)計(jì)與實(shí)現(xiàn)[J].電腦知識(shí)與技術(shù),2020,16(26):231-232,239.

[3]胡兵,林釩,陳藝芳.莆田市縣氣象業(yè)務(wù)集約化系統(tǒng)設(shè)計(jì)與分析[J].海峽科學(xué),2021,171(3):22-26.

[4]李曉薇.vue.js前端應(yīng)用技術(shù)分析[J].網(wǎng)絡(luò)安全技術(shù)與應(yīng)用,2022,4:44-45.

[5]巢晟盛.基于SpringBoot微服務(wù)架構(gòu)下前后端分離的MVVM模型淺析[J].電腦知識(shí)與技術(shù),2021,17(23):128-130,141.

作者：鄭清杰 鄭智健 林永強(qiáng) 單位：莆田市氣象局