適用于智能配電網前端微服務的跨系統集成平臺優化

方燕瓊，唐升衛，顧博川，代仕勇

（1.廣東電科院能源技術有限責任公司，廣州 510080； 2.廣東電網有限責任公司電力科學研究院，廣州 510080）

引言

作為智能電網的關鍵環節，智能配電網的建設愈發得到了重視。但配電網具有地域分布廣、電氣設備種類多和數量多、狀況復雜等特點[1-3]，導致配電網的信息更加多樣化。尤其隨著更多智能電氣設備接入配電網，配電網信息具有數據源復雜[4]、數據結構多樣、數據量大等明顯的大數據特征[5,6]。

不僅配網設備在地域上分散分布，而且受技術所限，許多分包的配網業務在系統中也是割裂的。因此在當前智能配電網建設過程中，多以單一功能模塊形成孤立的垂直系統為主，容易形成信息孤島，而構建高性能的跨系統集成平臺，將有助于配電網信息的充分利用和共享。

1 配電網跨系統業務

隨著智能配電網信息系統的業務也在不斷地發展，業務功能逐漸的增多，信息系統的組織結構、軟件架構不斷地升級和變化[7,8]。智能配電網業務結構如圖1所示。

圖1 智能配電網業務結構

導致大型的單體項目面臨一些問題，一方面，單一的系統已經過于的龐大甚至臃腫，需要進一步的根據不同的業務進行細化；另一方面，市場上許多大型系統根據業務領域被拆分成許多子系統分包給不同的企業開發。隨著不同的業務系統的拆分，技術棧也因而變得越來越難以統一，出現了多元化的情景。在走向多元化后，用戶需要切換不同的系統和賬號查看想要的結果，無疑就增加了用戶的操作。因此，為了將已經拆分的業務整合成一個整體便于用戶獲取業務信息，現急需一個能夠接入各企業分包業務并聚合數據的系統平臺。

傳統前端代碼通常會根據單個系統劃分為一個項目，而項目的體積是與業務的復雜度是成正相關的，業務增多會逐漸導致項目的體積臃腫。為了適應這個變化往往需要更多的開發者、更細粒度的團隊組織。在開發過程中，各模塊解耦到各自完成，上線時糅合在一起運行，其中產生出層出不窮的分支合并、代碼回滾，都會造成合作效率的驟降。從根源上看造成這種局面的是框架設計的問題，因此需要對整個項目進行解耦，使原本復雜的單體應用拆分為多個相對獨立的應用，使每個模塊都可以單獨部署上線，同時通過微服務的方式，動態組合各個獨立的應用。

為了克服現有技術之間的互通性和業務的拆分，形成科學有效的一體化技術架構與應用頂層設計[9],前端開發出現了一種類似于微服務架構的微前端的概念。即將單頁面前端應用由單一的單體應用轉變為多個小型前端應用集成一個系統，并且各個前端應用都支持獨立開發部署。

針對微前端架構的解決方案，目前出現的架構分為以下幾種方式：路由分發式、前端微服務化、微應用[10,11]、微件化、前端容器化、應用Web Components化。前端微服務化現有的實現方案還缺乏獨立部署的標準，無論是開發還是打包部署，都需要對相關子應用和基座重新修改和打包。

2 現有的前端微服務的實現方式及缺點

在當前微服務中存在多種實現方式，其中主要是以下幾種方式：

1）使用 HTTP 服務器的路由來重定向多個應用。通過路由分發式的微前端架構應該是采用最多、最易采用的 “微前端” 方案。但是這種方式看上去更像是多個前端應用的聚合，即該方式只是將這些不同的前端應用拼湊到一起，使其從表面上體現出來的是一個完整的整體。與其他的微服務相比，此技術在子應用的切換會導致頁面刷新，非常影響用戶體驗。

2）在不同的框架之上設計通訊、加載機制，諸如 Mooa 和 Single-Spa：本技術是基于Single-Spa上改進的一種方式。比原生的更加方便靈活，以及新增了基于iFrame的方式來解決第三方框架沖突的問題。在后端服務的通信中，通過rest接口等方式實現的方式不能移植到前端中，通過設計一種單獨的應用間的通信方式，增加了數據交互性。

3）通過組合多個獨立應用、組件來構建一個單體應用：組合式集成，即通過軟件工程的方式在構建前、構建時、構建后等步驟中，對應用進行一步的拆分，并重新組合。這種方式似乎很理想，即在滿足多個團隊并行開發的同時，又能構建出適合的交付物。然而它有一個嚴重的限制即必須使用同一個框架。鑒于業務是拆分后再重新組合的，這與單獨的微前端相比，部署更加繁瑣，因此重新組合時容易出錯等問題和限制性比較大。

4）iFrame技術。使用 iFrame 及自定義消息傳遞機制：iFrame可以創建一個全新的獨立的宿主環境，這表示前端應用之間可以相互獨立運行。然而，現最需要獲取的是用戶加載或卸載應用的時機和環境；該過程所出現的難題是采取怎樣的動畫過渡能夠讓用戶使用時更加自然，單純的iFrame恐難以做到。

從上述分析可知，當前的微服務技術只側重于單個內容，缺少綜合使用，導致微服務效果還沒充分發揮。

針對智能配電網日趨復雜的信息系統，亟需一種高效的處理方法，本論文將綜合使用上述的前端服務技術，優化Single-Spa并且集成iFrame的技術，通過優化wepack的打包方式分包加載資源。通過配置文件的方式簡化了Single-Spa的初始化。通過新增iFrame的嵌入方式，創建全新隔離的宿主環境。通過自定義的應用間的通信方式，加強與簡化應用間的通信。

3 新型的前端微服務

本文提供了一種基于前端微服務化的跨技術棧開發系統的優化，該前端微服務的內容包括：對子項目應用資源的打包配置優化、設計路由的相應機制，以及應用間的通信方式。此技術可以整合不同的技術棧的應用，減少應用的資源大小以及控制應用權限等功能。

3.1 整體思路

本文以一個實際的智能配電網應用場景，研究了一個父項目為主框架，配以表示不同業務模塊的多個子應用構建的前端微服務解決方案。圖2描述了前端微服務的整體結構，父項目在用戶登錄后通過獲取的用戶權限，將請求回來的菜單儲存在狀態管理器中，當訪問某一子應用的路由時，首次會在子應用中與路由表作比較，將路由信息動態添加到該子應用的路由表中，借此控制整個項目的路由，分發到各個子項目中，進而對子應用的權限進行控制。

圖2 前端微服務整體結構

業務的拆分可以解耦單一項目，但未經優化的項目打包方式還是會使項目加載變慢，優化前端打包的方式是必不可少的方式；服務通過配置文件的方式實現，有利于子應用動態增刪改查，更深層次的話可以根據用戶的身份權限來注冊不同的應用；解決應用間的數據共享問題一方面打通了應用之間的關聯性，另一方面也減少了接口的請求，減少公共數據需要從后端獲??；整合iFrame方式的前端微服務的優點在于可以創建獨立的宿主環境，防止代碼的污染。

3.2 具體實現

本新型前端微服務的具體實現方法如圖3所示， 該實現方法主要由子項目應用資源的打包配置優化、設計路由的相應機制，以及應用間的通信方式三個部分組成。

圖3 前端微服務實現方式

1）打包配置優化

微前端原則上各個子應用可兼容不同的前端框架，對于不同的前端框架的部署方式不一，本文采用基于vue開發的子應用打包優化方案。首先修改項目的打包文件，分包加載模塊文件，接著將不同的插件包分包打包在不同的文件中，達到減少打包后的文件大小，據測試對比，打包后的文件大小可減小50 %。

將子應用的配置單獨成文件，并且子應用使用manifest自動加載經過hash值的文件，具體方法：讓子應用使用 stats-webpack-plugin 插件，每次打包后都輸出一個只包含重要信息的manifest.json文件。父項目先ajax請求這個json文件，從中讀取出需要加載的js目錄，然后同步加載。

2）設計路由的相應機制

微前端主架構使用vue擴展Single-Spa，并增加路由管理，增加支持iFrame模式的加載，使用router.addRoutes動態添加相應iFrame路由。主框架基于vue-cli的腳手架進行集成，并使用element-ui作為前端庫，并引入路由router，Single-Spa，axios等相關插件。

當開發一個新的應用時，需要在主應用配置并更新相應的子應用。通過增加應用配置文件，在文件中聲明相關應用的名稱及對應的地址和端口，可用于初始化Single-Spa的時候將其注冊到主框架中；具體實現是通過遍歷調用微服務框架的注冊函數registerApplication為項目注冊子應用，并且自定義遠程加載mainfest.json文件，解析需要加載的js文件，簡化了注冊的過程。

3）應用間的通信方式

為了解決應用間的數據共享問題，本文設計了一套應用通信的機制。由于主框架中使用vue作為開發環境，所以使用vuex作為統一的狀態管理器，并且使用事件收發器在主框架中定義全局函數，提供主框架與子應用之間的數據通信，并修改狀態值。具體實現為APP1在調用事件收發器后修改主框架的狀態管理器的狀態值后，APP2亦可通過事件收發器獲取主框架內的狀態值，實現多個子應用間的數據通信與同步。

3.3 現場應用

本文提出的前端微服務已經應用于翁源地區電網的配電網自動化系統，通過供電可靠性分析、負荷預測、電壓質量監測、用戶重復停電統計、臺區重過載統計、配變檔位調節排行，可以對智慧臺區、光儲微網配網線路進行全方位的監測[12-15]，當監測到異常情況時，智能臺區可以自動發出重過載預警和配變調節預警。前端微服務應用如圖4所示。本前端微服務的應用將極大提升智能臺區的運行效果，為智能電網的信息化、數字化、智能化發展打下堅實一步。

圖4 前端微服務應用

4 結論

本文提出的適用于智能配電網前端微服務的跨系統集成平臺優化方案，通過對整個項目進行解耦，使原本復雜的單體應用拆分為多個相對獨立的應用，使得每個模塊都可以單獨部署上線；通過設計應用間的通信方式，解決了應用間的數據共享問題，打通了應用之間的關聯性。前端微服務應用于大型項目，對現階段臃腫的系統進行拆分有著極大的幫助，一方面可以解耦單體應用，使業務分離；另一方面，對項目部署上線及版本迭代也有著更快捷的提高。