kibana7.0.1插件開發說明

kibana7.0.1插件開發說明

項目中需要用到kibana來進行伺服器叢集性能監控，以及服務狀态的監控，嘗試使用sentinl來實作，發現sentinl最新版本隻支援6.6.0，而kibana最新版本為7.1，sentinl無法在kibana7.1中安裝，kibana自帶的告警功能因為協定是BASE，也無法使用，隻好嘗試自己開發插件來滿足項目需要，現記錄下插件開發過程的關鍵點和遇到的坑，希望能幫助到開發插件的童鞋。

本文将以windows7做為目标作業系統，描述插件開發流程和相關知識。

1、搭建kibana插件開發環境

kibana插件開發首先必須搭建開發環境，開發環境搭建步驟如下：

1. 通過git克隆kibana源碼，在指令行下執行：

git clone https://github.com/elastic/kibana.git kibana
           

1. 擷取源碼成功後，進入源碼目錄kibana，根據版本需要，切換并建立本地分支，我這裡使用的版本是v7.0.1；
2. 檢視kibana目錄中.node-version檔案中node.js版本，確定系統安裝對應版本的node.js,kibana的7.0.1分支對應node.js版本為10.15.2；
3. 安裝最近版yarn，用于nodejs的子產品管理和編譯，yarn官網位址，目前最新版本為yarn-1.16.0；
4. 在kibana目錄中，執行指令，擷取插件開發需要依賴項；

yarn kbn bootstrap
           

1. 插件開發需要的elasticsearch，可以使用開發環境自帶的快照建立，也可以直接使用正式的elasticsearch執行個體，請自行選擇，如果使用快照模式，執行如下指令：

yarn es snapshot
           

建立快照，在快照中建立測試用logstash資料，執行如下指令：

node scripts/makelogs
           

使用快照模式時這裡有個坑，需要注意下，每次快照的elasticsearch執行個體重新開機後，需要重新建立logstash資料。

1. 檢查測試開發環境是否搭建成功，執行如下指令：

yarn start
           

等待開發伺服器啟動完成，打開浏覽器通路 http://localhost:5601，可以正常通路，恭喜你，開發環境搭建成功。

2、插件開發預備知識

1. 插件支援界面，需要了解kibana提供的UI界面庫，界面庫參考位址：https://elastic.github.io/eui/#/
2. kibana插件使用了node.js的hapi架構進行組織，hapi架構說明參考位址：https://hapijs.com/api#serverrouteoptions
3. kibana插件處kibana自身的子產品外，支援使用node.js的其他子產品擴充功能，可以通過”npm install XXX”安裝，安裝新子產品後，必須在插件目錄執行指令“yarn kbn bootstrap”更新資訊。

3、開發說明

1. 建立插件，進入kibana目錄，執行如下指令：

node scripts/generate_plugin my_plugin_name
           

my_plugin_name為将要建立的插件名稱，回答一些問題後（問題直接預設），将在kibana的同級中自動建立kibana-extra\my_plugin_name目錄，插件目錄中已建立好基本的代碼結構，這裡有個坑需要注意，kibana源碼所在目錄名必須為"kibana"，如果是其他名字，建立插件将失敗。

1. 插件目錄結構說明:

– /node_modules # 插件依賴包

– /public # 插件web用戶端代碼

– /public/hack.js # 插件全局事件定義，例如：鍵盤事件

– /public/components\main\main.js # 插件用戶端代碼，包括UI呈現方式（需要kibanaUI界面庫），用戶端邏輯

– /server # 插件服務端代碼

– /server/routes/example.js # 插件服務端處理邏輯

– /translations # 插件國際化

– /package.json # node.js子產品配置檔案，建立插件時自動生成

– /index.js # node.js初始化檔案

1. /my_plugin_name/index.js檔案

   用于插件初始化，該檔案中有3處比較重要：

   第1個位置，定義了插件服務端需要的插件項，如果需要通路elasticsearch必須定義；

   第2個位置，服務端可以通過server.app.xxx儲存對象，在伺服器内部子產品之間共享；

   第3個位置，擷取的kibana服務端用于連接配接elasticsearch執行個體的連接配接器對象，通過該對象我們可以調用kibana的JavascriptAPI通路elasticsearch執行個體，kibana的JavascriptAPI參考：https://www.elastic.co/guide/en/elasticsearch/client/javascript-api/current/api-reference.html；

2. /my_plugin_name/server/routers/example.js檔案

   定義了插件服務端處理邏輯，插件用戶端通過Ajax送出資訊到服務端對應路由處理，服務端路由可以再通過（3）中定義的連接配接器對象通路elasticsearch，處理結果再傳回給用戶端；

   

3. /my_plugin_name/public/components/main/main.js檔案

   定義了插件用戶端界面和邏輯，處理時需要注意一下幾點：

   第1點：狀态的定義，檔案中this.state對象統一管理UI元素狀态，通過this.setState方法調用，在改變狀态後架構将自動調用render方法重畫用戶端UI；

   

   

   

   第2點：UI元件第一次将調用componentDidMount方法，這個方法中可以做一些初始工作。

   

   第3點：用戶端通路服務端，通過http處理，支援GET、PUT、POST、DELETE标準操作。

   

4、調試插件

1. 進入插架所在目錄，執行指令：

yarn start
           

啟動插件調試伺服器，啟動正常通過浏覽器通路本地http://localhost:5601，開始調試。

1. 任何用戶端還是服務端代碼修改，架構都将自動重新裝載，實時檢視修改結果。
2. 采用日志輸出跟蹤中間結果，日志語句：console.log()；

5、插件編譯打包

在插件所在目錄，執行指令：

yarn build
           

架構将自動建立build目錄，并在目錄中建立打封包件my_plugin_name-7.0.1.zip。

6、插件安裝

在kibana的生成環境目錄中，執行指令：

bin/kibana-plugin install file:///yourpath/kibana-extra/mycol/build/my_plugin_name-7.0.1.zip
           

安裝建立的插件。

具體可參考，我的mycol項目：https://github.com/cqoyq/mycol