Microsoft 365 Agents Toolkit を使用して Visual Studio Code で JavaScript エージェントを作成する

この記事では、Microsoft 365 Agents Toolkit を使用して、Visual Studio で新しい Agents SDK JavaScript プロジェクトを作成する方法について説明します。

前提条件

新しいプロジェクトの作成

Agents Toolkit には、エージェントの構築を開始するのに役立つプロジェクト テンプレートが用意されています。 ツールキットのテンプレートから、または Agents SDK のサンプルから開始できます。

Note

以下の手順は、現在、JavaScript と TypeScript でのみ機能します。 Python のサポートが計画されています。

  1. Visual Studio Codeで、サイドバーのMicrosoft 365エージェント アイコンを選択して、Microsoft 365 Agents Toolkit 拡張機能のサイド パネルを開きます。

  2. 新しいエージェント プロジェクトをビルドするには、[ 新しいエージェント/アプリの作成] を選択します。 ツールキットのテンプレートから、または Agents SDK のサンプルから開始できます。 このガイドでは、Agents Toolkit の使用を開始する方法について説明します。

Agents Toolkit 拡張機能の開始ページ

  1. エージェント SDK を使用したエージェントの構築を開始するには、 カスタム エンジン エージェントを選択します。

作成するエージェントの種類を選択する

新しいエージェントを作成する

カスタム エンジン エージェントをオプションとして選択すると、独自の AI サービスに追加するための一連のプロンプトが表示されます。

次の 2 つのテンプレートから選択できます。

  • 基本カスタム エンジン エージェント
  • Weather Agent。

基本的なカスタム エンジン エージェントは、何も事前構築されていないエージェントです。 エージェントが役立つには、Semantic Kernelや LangChain などの AI オーケストレーターと知識を追加する必要があります。

テンプレートの選択

  1. この例では、Weather Agent を選択して、選択した言語に応じて LangChain とAzure AI Foundryを使用するエージェントを作成します。

LLM サービスを選択するように求められます。

  1. モデルの Azure OpenAI を選択します。

    LLM 用の Azure OpenAI を選択する

    Microsoft Foundry ポータルから、Key、Target URI、Azure OpenAI モデルの Name の入力を求められます。 これらの情報は、Foundry ポータルの [ マイ アセット と モデルとエンドポイント ] にあります。

  2. Azure OpenAI サービス キーからモデルの詳細を入力します。

    Azure OpenAI キーを入力して認証する

  3. JavaScript または TypeScript を選択し、既定のフォルダーを選択し、プロジェクトのルート フォルダーを既定の場所に格納するアプリケーション名を入力します。

    新しいプロジェクトが開きます。

    新しく作成されたプロジェクトのファイルの表示

  4. Visual Studio Code のツール バーで Microsoft 365 ロゴを選択して、拡張機能を使用してサインインしていることを確認します。 接続するテナントにサインインしていることを確認します。

    アカウントの表示とサインイン

Agents Playground でエージェントをデバッグしてテストする

ツールキットで使用できる新しい Microsoft 365 Agent Playground を使用して、コードをデバッグしてテストできます。 プレイグラウンドは、完全なデプロイ サイクルを経ることなく、コードを簡単にデバッグするのに役立ちます。

  1. Microsoft 365 Agents Playground で [デバッグ] を選択します。

    プレイグラウンドを選択したら、必要なコンポーネントを使用してローカル コンピューターが準備されるまで少し待ちます。 準備には数分かかります。

    Microsoft 365 Agents Playground でデバッグを選択する

  2. デプロイを待っている間に、フォルダーでコードを確認し、確認して理解を深めます。

    生成されたテンプレート コードを確認する

  3. デバッグとテスト用のプレイグラウンドの読み込みが完了すると、ブラウザーが開き、プレイグラウンドを使用してエージェントと対話する準備が整います。 ガイドに従い、LangChain と Azure AI Foundry の事前構築済みテンプレートを使用すると、「明日の{あなたの場所}の天気は？」と尋ねることができます。選択した AI サービスを使用して、エージェントが天気をアダプティブカードで応答します。

    Teams アプリ テスト ツールでアプリをデバッグする

    チャット内のアダプティブ カードを使用した Teams アプリ テスト ツール

Microsoft 365 Copilot でエージェントをデバッグしてテストする

Agents Playground でローカルでテストが完了したら、Azure Bot Service にデプロイし、Microsoft 365 Copilot チャネル用に構成できます。 Microsoft 365 Copilot にアクセスできるテナントにログインしていることを確認します。

  1. Microsoft 365 Copilot を使用してデバッグできるように、デバッグ ターゲットを Copilot に変更します。 テストするには、キーボードで F5 キーを押すか 、デバッグ を選択します。 エージェントを Microsoft 365 で使用できるようにするには、数分の準備が必要です。 このツールキットは、バックグラウンドでアプリ登録とAzure Bot ServiceレコードをAzure Bot Serviceに作成し、マニフェストと共にプロジェクトをテナントにデプロイします。

    選択して Copilot (Edge) でデバッグする

  2. プロジェクトが配置されると、Microsoft 365 Copilot読み込みが表示され、必要に応じて、Microsoft 365 Copilotに直接、質問したり、ブレークポイントを追加したり、デバッグしたりできます。

    Microsoft 365 Copilot でのテストとデバッグ

まとめ

これで、次の操作が正常に完了しました。

  • Agents Toolkit を使用して新しい Microsoft 365 エージェント プロジェクトとエージェントを開始しました
  • Microsoft 365 Agents Playground を使用してエージェントをローカルでテストしました
  • Microsoft 365 チャネルで直接デバッグするためのエージェントを展開しました
  • Last updated on