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

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

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

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

1需求分析

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

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

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

2.1總體設(shè)計

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

2.2系統(tǒng)前端

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

2.3系統(tǒng)后端

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

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

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

2.5運行結(jié)果

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

3結(jié)語

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

參考文獻：

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

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

[3]胡兵,林釩,陳藝芳.莆田市縣氣象業(yè)務(wù)集約化系統(tǒng)設(shè)計與分析[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ù),2021,17(23):128-130,141.

作者：鄭清杰 鄭智健 林永強 單位：莆田市氣象局