kibana 7.0.1プラグイン開発説明

kibana 7.0.1プラグイン開発説明
kibana 7.0.1プラグイン開発説明
プロジェクトではkibanaを用いてサーバクラスタの性能モニタリング、およびサービス状態のモニタリングを行い、sentinlを用いて実現しようとしたが、sentinlの最新バージョンは6.6..0しかサポートされていないことが分かった.kibanaの最新バージョンは7.1で、sentinlはkibana 7.1にインストールできない.kibanaが持参したアラーム機能はプロトコルがBASEであるため、使用できない.自分でプラグインを開発してプロジェクトの需要を満たすことを試みるしかなくて、今プラグインの開発過程の肝心な点と出会った穴を記録して、プラグインの子供靴を開発するのに役立つことを望みます.
Windows 7をターゲットとしたオペレーティングシステムについて、プラグインの開発プロセスと関連知識について説明します.
1、kibanaプラグイン開発環境の構築
kibanaプラグインの開発はまず開発環境を構築しなければならない.開発環境の構築手順は以下の通りである.

gitによってkibanaソースコードをクローンし、コマンドラインの下で実行する:

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

ソースコードの取得に成功した後、ソースコードディレクトリkibanaに入り、バージョンの必要に応じて、ローカルブランチを切り替えて作成し、私がここで使用しているバージョンはv 7.0.1です.

kibanaディレクトリの.node-versionファイルのnode.jsバージョンを表示し、システムが対応するバージョンのnode.jsをインストールしていることを確認し、kibanaの7.0.1ブランチがnode.jsバージョンが10.15.2であることを確認します.

最近版yarnをインストールし、nodejsのモジュール管理とコンパイルに使用し、yarn公式サイトのアドレス、現在の最新バージョンはyarn-1.16.0である.

kibanaディレクトリで、コマンドを実行し、プラグイン開発に必要な依存項目を取得する.

yarn kbn bootstrap

プラグインの開発に必要なelasticsearchは、開発環境に付属するスナップショットを使用して作成することも、正式なelasticsearchインスタンスを直接使用することもできます.スナップショットモードを使用する場合は、次のコマンドを実行します.

yarn es snapshot

スナップショットを作成し、スナップショットにテスト用logstashデータを作成し、次のコマンドを実行します.

node scripts/makelogs

スナップショットモードを使用する場合、ここにピットがあります.スナップショットのelasticsearchインスタンスが再起動されるたびにlogstashデータを再作成する必要があることに注意してください.

テスト開発環境が成功したかどうかを検査し、以下のコマンドを実行する:

yarn start

開発サーバの起動が完了するのを待って、ブラウザのアクセスを開きます.http://localhost:5601ああ、正常に訪問できて、おめでとうございます.開発環境の構築に成功しました.
2、プラグイン開発の予備知識

プラグインはインタフェースをサポートし、kibanaが提供するUIインタフェースライブラリ、インタフェースライブラリリファレンスアドレスを理解する必要があります.https://elastic.github.io/eui/#/

kibanaプラグインはnode.jsのhapiフレームワークを使用して組織され、hapiフレームワークは参照アドレスを説明します.https://hapijs.com/api#serverrouteoptions

kibanaプラグインではkibana自身のモジュールのほか、node.jsを使用した他のモジュール拡張機能をサポートしており、「npm install XXX」でインストールでき、新しいモジュールをインストールした後、プラグインディレクトリでコマンド「yarn kbn bootstrap」を実行して情報を更新しなければならない.

3、開発説明

プラグインを作成しkibanaディレクトリに入り、

というコマンドを実行します.

node scripts/generate_plugin my_plugin_name

my_plugin_nameは作成するプラグインの名前で、いくつかの質問に答えた後(質問は直接デフォルト)、kibanaの同級でkibana-extramy_が自動的に作成されます.plugin_nameディレクトリ、プラグインディレクトリに基本的なコード構造が作成されています.ここにピットがあります.kibanaソースコードがあるディレクトリ名は「kibana」でなければなりません.他の名前の場合、プラグインの作成に失敗します.

プラグインディレクトリ構造説明:

–/node_modules#プラグイン依存パッケージ
–/public#プラグインwebクライアントコード-/public/hack.js#プラグイングローバルイベント定義、たとえばキーボードイベント-/public/componentsmainmain.js#プラグインクライアントコードUIレンダリング方式(kibanaUIインタフェースライブラリが必要)、クライアントロジック
–/server#プラグインサービス側コード–/server/routes/example.js#プラグインサービス側処理ロジック
–/translations#プラグイン国際化–/package.json#node.jsモジュールプロファイル、プラグイン作成時に自動的に生成–/index.js#node.js初期化ファイル

/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;

/my_plugin_name/server/routers/example.jsファイルはプラグインサービス側処理ロジックを定義し、プラグインクライアントはAjaxを通じてサービス側対応ルーティング処理に情報を提出し、サービス側ルーティングは(3)で定義したコネクタオブジェクトを通じてelasticsearchにアクセスし、処理結果はクライアントに戻る.

/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、プラグインのデバッグ

プラグ所在ディレクトリに入り、コマンドを実行:

yarn start

プラグインデバッグサーバを起動し、通常ブラウザからローカルにアクセスするhttp://localhost:5601を選択して、デバッグを開始します.

クライアントまたはサービス・エンド・コードの変更により、フレームワークが自動的に再ロードされ、変更結果がリアルタイムで表示されます.

ログ出力追跡中間結果、ログ文: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