ツール拡張機能の開発

適用先:Windows Admin Center、Windows Admin Center Preview

ツール拡張機能は、ユーザーが Windows Admin Center と対話して、サーバーやクラスターなどの接続を管理するための主な方法です。 Windows Admin Center のホーム画面で接続をクリックして接続すると、左側のナビゲーション ウィンドウにツールの一覧が表示されます。 ツールをクリックすると、ツール拡張機能が読み込まれ、右側のウィンドウに表示されます。

ツール拡張機能が読み込まれると、ターゲット サーバーまたはクラスターで WMI 呼び出しまたは PowerShell スクリプトを実行して、UI に情報を表示したりユーザー入力に基づいてコマンドを実行したりすることができます。 ツール拡張機能では、表示するソリューションが定義されるため、ソリューションごとに異なるツール セットが使用されます。

注意

さまざまな拡張機能の種類に慣れていない場合 拡張機能のアーキテクチャと拡張機能の種類の詳細について説明します。

環境を準備する

まだインストールしていない場合は、すべてのプロジェクトに必要な依存関係とグローバルな前提条件をインストールして環境を準備します。

Windows Admin Center SDK を使用して新しいツール拡張機能を作成する

すべての依存関係をインストールしたら、新しいツール拡張機能を作成できます。 プロジェクト ファイルを格納するフォルダーを作成または参照し、コマンド プロンプトを開き、そのフォルダーを作業ディレクトリとして設定します。 以前にインストールされた Windows Admin Center SDK を使用して、次の構文を使用して新しい拡張機能を作成します:

wac create --company "{!Company Name}" --tool "{!Tool Name}"
説明
{!Company Name} 会社名 (スペースを含む) Contoso Inc
{!Tool Name} ツール名 (スペースを含む) Manage Foo Works

次に使用方法の例を示します。

wac create --company "Contoso Inc" --tool "Manage Foo Works"

これにより、ツールに指定した名前を使用して、現在の作業ディレクトリ内に新しいフォルダーが作成され、必要なすべてのテンプレート ファイルがプロジェクトにコピーされ、会社名とツール名でファイルが構成されます。

次に、作成したフォルダーにディレクトリを変更し、次のコマンドを実行して必要なローカルの依存関係をインストールします:

npm install

これが完了すると、新しい拡張機能を Windows Admin Center に読み込むために必要なすべての設定が完了します。

拡張機能にコンテンツを追加する

Windows Admin Center SDK を使用して拡張機能を作成したので、コンテンツをカスタマイズする準備ができました。 実行できる操作の例については、次のガイドを参照してください:

その他の例については、開発者ガイドを参照してください。 開発者ガイドは、完全に機能するソリューションの拡張機能であり、Windows Admin Center にサイドロードすることができます。また、独自の拡張機能で参照して使用できる、サンプル機能とツール例の豊富なコレクションが含まれています。

Windows Admin Center 設定の [詳細設定] ページで、開発者ガイド拡張機能を有効にしてください。

拡張機能のアイコンをカスタマイズする

ツールの一覧で拡張機能に対して表示されるアイコンをカスタマイズできます。 これを行うには、拡張機能についての manifest.json のすべての icon エントリを変更します。

"icon": "{!icon-uri}",
説明 URI の例
{!icon-uri} アイコン リソースの場所 assets/foo-icon.svg

注: 現時点では、開発者モードで拡張機能をサイド ローディングする場合、カスタム アイコンは表示されません。 回避策として、target の内容を次のように削除します。

"target": "",

この構成は、開発者モードでのサイド ローディングでのみ有効なため、target に含まれる値を保持してから、拡張機能を発行する前に復元することが重要です。

拡張機能をビルドしてサイド ローディングする

次に、拡張機能をビルドして Windows Admin Center に読み込みます。 コマンド ウィンドウを開き、ディレクトリをソース ディレクトリに変更すると、ビルドする準備が整います。

  • 次のように gulp build および gulp serve を指定します。

    gulp build
    gulp serve --port 4201
    

現在空いているポートを選択する必要があることに注意してください。 Windows Admin Center が実行されているポートは使用しないでください。

ローカルで提供されるプロジェクトを Windows Admin Center に追加することで、プロジェクトをテスト用に Windows Admin Center のローカル インスタンスにサイド ローディングすることができます。

  • Web ブラウザーで Windows Admin Center を起動します

  • デバッガーを起動します (F12)

  • コンソールを開き、次のコマンドを入力します

    MsftSme.sideLoad("http://localhost:4201")
    
  • Web ブラウザーを更新します

これで、プロジェクトは、名前の横に (side loaded) が追加された状態でツール一覧に表示されるようになります。

異なるバージョンの Windows Admin Center SDK をターゲットにする

SDK の変更とプラットフォームの変更によって拡張機能を最新の状態に保つことは簡単です。 異なるバージョンの Windows Admin Center SDK をターゲットにする方法について説明しています。