このページは Cloud Translation API によって翻訳されました。

Google Chat、Vertex AI、Apps Script を使用してインシデントに対応する

このチュートリアルでは、Google Chat でリアルタイムでインシデントに対応しますインシデントに対応する際、アプリは Chat スペースを作成して入力し、メッセージ、スラッシュコマンド、ダイアログを使用してインシデントの解決を促進します。また、AI を使用してインシデント対応を Google ドキュメントのドキュメントにまとめます。

インシデントとは、チームの即時対応を必要とするイベントである人によって異なります。インシデントの例:

顧客関係管理（CRM）プラットフォームに緊急のケースが作成され、サービスチームが解決に向けて連携する必要があります。
システムがオフラインになり、サイト信頼性エンジニア（SRE）のグループにアラートが発生取り組んだデータをオンラインに戻すことができます
マグニチュードの強い地震が起き、緊急作業に対応を調整する必要があります

このチュートリアルでは、ユーザーがウェブページのボタンをクリックしてインシデントを報告すると、インシデントアラートが発生します。このウェブページでは、インシデントの基本情報（タイトル、説明、対応者のメールアドレス）をユーザーに入力するよう求めることによって、インシデントをシミュレートします。

Chat アプリのインシデント管理の動作を確認します。

図 1: インシデントを報告できるウェブサイト。
図 2.インシデントの Chat スペースが作成されたという通知。
図 3.インシデント対応の Chat スペース。
図 4. スラッシュコマンドによるインシデントの解決
図 5. インシデント解決ダイアログ
図 6. スペースで共有されているインシデント解決の Google ドキュメント。
図 7.AI によるインシデント解決の要約に関する Google ドキュメント

前提条件

組織でこれらの前提条件のいずれかを有効にする必要がある場合は、有効にするには、Google Workspace 管理者にお問い合わせください。

企業または大企業以下へのアクセス権を持つ Google Workspace アカウント Google Chat。
目的ディレクトリ（連絡先の共有）がオンになっていることを確認します。インシデントアプリは、ディレクトリを使用して、インシデント対応者の連絡先情報（名前やメールアドレスなど）を検索します。インシデントレスポンダーは、Google Workspace 組織の Google Chat アカウントを持つユーザーである必要があります。

目標

インシデントに応答する Chat アプリを作成します。
次のようにして、お客様がインシデントに対応できるようにします。
- インシデント対応スペースを作成する。
- インシデントや対応をまとめたメッセージを投稿する。
- インタラクティブな要素によるコラボレーションのサポート Chat アプリの機能。
Vertex AI を使用して会話と解決策を要約します。

アーキテクチャ

次の図は、インシデントレスポンス Google Chat アプリで使用される Google Workspace リソースと Google Cloud リソースのアーキテクチャを示しています。

インシデント対応 Google Chat アプリのアーキテクチャ

このアーキテクチャは、インシデント対応の Google Chat アプリがインシデントおよび解決策を処理する方法を示しています。

ユーザーが Apps Script でホストされている外部ウェブサイトからインシデントを開始します。
ウェブサイトは、Apps Script でホストされている Google Chat アプリに非同期 HTTP リクエストを送信します。
インシデント対応の Google Chat アプリがリクエストを処理します。
1. Apps Script Admin SDK サービスがチームメンバーを取得するユーザー ID やメールアドレスなどの情報も含まれます。
2. Chat API への一連の HTTP リクエストを使用すると、高度なチャットサービスであるインシデント対応を Google Chat アプリがインシデントの Chat を作成するスペースにメンバーを追加して、スペースにメッセージを送信します。
チームメンバーが Chat スペースでインシデントについて話し合っています。
チームメンバーがスラッシュコマンドを呼び出して、できます。
1. Apps Script を使用した Chat API への HTTP 呼び出し高度なチャットサービスを使用すると、メッセージが表示されます。
2. Vertex AI は、リストされたメッセージを受信して要約を生成します。
3. Apps Script DocumentApp サービスは、ドキュメントドキュメントに追加され、Vertex AI の要約がドキュメントをご覧ください。
4. Google Chat アプリからの Chat API を使用して、要約へのリンクを共有するメッセージを送信しますドキュメント。

環境を準備する

このセクションでは、Chat アプリ用の Google Cloud プロジェクトを作成して構成する方法について説明します。

Google Cloud プロジェクトを作成する

Google Cloud コンソール

Google Cloud コンソールで、メニュー > [IAM と管理] > [プロジェクトを作成] に移動します。
[プロジェクトの作成] に移動
[プロジェクト名] フィールドに、プロジェクトのわかりやすい名前を入力します。
省略可: プロジェクト ID を編集するには、[編集] をクリックします。プロジェクト ID は変更できませんそのため、有効期間中にニーズを満たす ID を選択してください。できます。
[場所] フィールドで [参照] をクリックして、できます。[選択] をクリックします。 <ph type="x-smartling-placeholder">
</ph> 注意: Google Workspace の組織が見つからない場合
Google Workspace アカウントにログインしていません。一部の機能（Google Workspace デベロッパー向けドキュメントに記載の）は、プロジェクト関連付けられています
[作成] をクリックします。Google Cloud コンソールがダッシュボードページに移動し、数分以内にプロジェクトが作成されます。

gcloud CLI

次のいずれかの開発環境で、Google Cloud CLI（gcloud）にアクセスします。

Cloud Shell: gcloud CLI がすでに設定されているオンラインターミナルを使用するには、Cloud Shell をアクティブにします。
Cloud Shell をアクティブにする
ローカルシェル: ローカル開発環境を使用するには、インストールと初期化使用できます。
Cloud プロジェクトを作成するには、gcloud projects create コマンドを使用します。
```
gcloud projects create PROJECT_ID
```
作成するプロジェクトの ID を設定して、PROJECT_ID を置き換えます。

Cloud プロジェクトの課金を有効にする

Google Cloud コンソール

Google Cloud コンソールで [お支払い] に移動します。[ メニュー > [お支払い] > [マイプロジェクト] を選択します。
[マイプロジェクトのお支払い] に移動
[組織を選択] で、関連付けられている組織を選択します。 Google Cloud プロジェクトです
プロジェクトの行で、[アクション] メニューを開く (), [お支払い情報を変更] をクリックし、 Cloud 請求先アカウント。
[アカウントを設定] をクリックします。

gcloud CLI

使用可能な請求先アカウントを一覧表示するには、次のコマンドを実行します。
```
gcloud billing accounts list
```
請求先アカウントを Google Cloud プロジェクトにリンクします。
```
gcloud billing projects link PROJECT_ID --billing-account=BILLING_ACCOUNT_ID
```
次のように置き換えます。
- PROJECT_ID は、課金を有効にする Cloud プロジェクトのプロジェクト ID です。
- BILLING_ACCOUNT_ID は、Google Cloud プロジェクトにリンクする請求先アカウント ID です。

API を有効にする

Google Cloud コンソール

Google Cloud コンソールで、Google Chat API、Google Docs API、Admin SDK API、Vertex AI API を有効にします。

API を有効にする
API を正しい [次へ] をクリックします。
正しい API を有効にしていることを確認し、[有効にする] をクリックします。

gcloud CLI

必要に応じて、現在の Cloud プロジェクトを gcloud config set project コマンドで作成したプロジェクトに設定します。
```
gcloud config set project PROJECT_ID
```
PROJECT_ID は、プロジェクトのプロジェクト ID に置き換えます。作成しました。
gcloud services enable コマンドを使用して、Google Chat API、Google Docs API、Admin SDK API、Vertex AI API を有効にします。
```
gcloud services enable chat.googleapis.com docs.googleapis.com admin.googleapis.com aiplatform.googleapis.com
```

認証と権限付与の設定

認証と認可により、 Google Workspace と Google Workspace の Chat 用アプリアクセスリソース Google Cloud でインシデント対応を処理する。

このチュートリアルではアプリを内部で公開するため、プレースホルダを使用しても問題はありません情報です。アプリを外部に公開する前に、プレースホルダを置き換えます実際の情報とともに同意画面の情報を表示します。

Google Cloud コンソールで、メニュー > [API とサービス] > [OAuth 同意画面] に移動します。

[OAuth 同意画面] に移動
[ユーザーの種類] で [内部] を選択し、[作成] をクリックします。
[アプリ名] に「Incident Management」と入力します。
[ユーザーサポートメール] で、メールアドレスまたは適切な Google グループを選択します。
[デベロッパーの連絡先情報] にメールアドレスを入力します。
[保存して次へ] をクリックします。
[スコープを追加または削除] をクリックします。パネルが表示され、スコープのリストが表示されます。 Cloud プロジェクトで有効にした各 API の Cloud Identity ドメインです。
[スコープを手動で追加] に、次のスコープを貼り付けます。
- https://www.googleapis.com/auth/chat.spaces.create
- https://www.googleapis.com/auth/chat.memberships
- https://www.googleapis.com/auth/chat.memberships.app
- https://www.googleapis.com/auth/chat.messages
- https://www.googleapis.com/auth/documents
- https://www.googleapis.com/auth/admin.directory.user.readonly
- https://www.googleapis.com/auth/script.external_request
- https://www.googleapis.com/auth/userinfo.email
- https://www.googleapis.com/auth/cloud-platform
[Add to Table] をクリックします。
[更新] をクリックします。
[保存して次へ] をクリックします。
アプリ登録の概要を確認し、[ダッシュボードに戻る] をクリックします。

Chat アプリを作成してデプロイする

次のセクションでは、Chat アプリに必要なすべてのアプリケーションコードを含む Apps Script プロジェクト全体をコピーして更新します。そのため、各ファイルをコピーして貼り付ける必要はありません。

関数によっては、名前の末尾にアンダースコアが含まれていることがあります。例: ChatApp.gs から processSlashCommand_()。アンダースコアを使用すると、ブラウザで開いたインシデント初期化ウェブページから関数が非表示になります。詳細については、非公開関数をご覧ください。

Apps Script は、.gs スクリプトと .html ファイルの 2 種類のファイル形式をサポートしています。このサポートを遵守するため、アプリのクライアントサイドの JavaScript がインクルードされています。 <script /> タグ内に指定し、その CSS を <style /> タグ内に指定作成します

必要に応じて、GitHub でプロジェクト全体を表示できます。

GitHub で表示

各ファイルの概要は次のとおりです。

Consts.gs

他のコードファイルによって参照される定数を定義します。（Cloud プロジェクト ID、Vertex AI ロケーション ID、スラッシュコマンド ID を使用します。

`Consts.gs` コードを表示

apps-script/incident-response/Consts.gs

GitHub で表示

const PROJECT_ID = 'replace-with-your-project-id';
const VERTEX_AI_LOCATION_ID = 'us-central1';
const CLOSE_INCIDENT_COMMAND_ID = 1;

ChatApp.gs

メッセージ、カードのクリック数、スラッシュコマンド、ダイアログなどの Chat 操作イベントを処理します。/closeIncident スラッシュコマンドに応答してダイアログを開き、インシデントの解決の詳細を収集します。Chat API の spaces.messages.list メソッドを呼び出して、スペース内のメッセージを読み取ります。Admin SDK Directory サービスを使用してユーザー ID を取得します。 Apps Script。

`ChatApp.gs` コードを表示

apps-script/incident-response/ChatApp.gs

GitHub で表示

/**
 * Responds to a MESSAGE event in Google Chat.
 *
 * This app only responds to a slash command with the ID 1 ("/closeIncident").
 * It will respond to any other message with a simple "Hello" text message.
 *
 * @param {Object} event the event object from Google Chat
 */
function onMessage(event) {
  if (event.message.slashCommand) {
    return processSlashCommand_(event);
  }
  return { "text": "Hello from Incident Response app!" };
}

/**
 * Responds to a CARD_CLICKED event in Google Chat.
 *
 * This app only responds to one kind of dialog (Close Incident).
 *
 * @param {Object} event the event object from Google Chat
 */
function onCardClick(event) {
  if (event.isDialogEvent) {
    if (event.dialogEventType == 'SUBMIT_DIALOG') {
      return processSubmitDialog_(event);
    }
    return {
      actionResponse: {
        type: "DIALOG",
        dialogAction: {
          actionStatus: "OK"
        }
      }
    };
  }
}

/**
 * Responds to a MESSAGE event with a Slash command in Google Chat.
 *
 * This app only responds to a slash command with the ID 1 ("/closeIncident")
 * by returning a Dialog.
 *
 * @param {Object} event the event object from Google Chat
 */
function processSlashCommand_(event) {
  if (event.message.slashCommand.commandId != CLOSE_INCIDENT_COMMAND_ID) {
    return {
      "text": "Command not recognized. Use the command `/closeIncident` to close the incident managed by this space."
    };
  }
  const sections = [
    {
      header: "Close Incident",
      widgets: [
        {
          textInput: {
            label: "Please describe the incident resolution",
            type: "MULTIPLE_LINE",
            name: "description"
          }
        },
        {
          buttonList: {
            buttons: [
              {
                text: "Close Incident",
                onClick: {
                  action: {
                    function: "closeIncident"
                  }
                }
              }
            ]
          }
        }
      ]
    }
  ];
  return {
    actionResponse: {
      type: "DIALOG",
      dialogAction: {
        dialog: {
          body: {
            sections,
          }
        }
      }
    }
  };
}

/**
 * Responds to a CARD_CLICKED event with a Dialog submission in Google Chat.
 *
 * This app only responds to one kind of dialog (Close Incident).
 * It creates a Doc with a summary of the incident information and posts a message
 * to the space with a link to the Doc.
 *
 * @param {Object} event the event object from Google Chat
 */
function processSubmitDialog_(event) {
  const resolution = event.common.formInputs.description[""].stringInputs.value[0];
  const chatHistory = concatenateAllSpaceMessages_(event.space.name);
  const chatSummary = summarizeChatHistory_(chatHistory);
  const docUrl = createDoc_(event.space.displayName, resolution, chatHistory, chatSummary);
  return {
    actionResponse: {
      type: "NEW_MESSAGE",
    },
    text: `Incident closed with the following resolution: ${resolution}\n\nHere is the automatically generated post-mortem:\n${docUrl}`
  };
}

/**
 * Lists all the messages in the Chat space, then concatenate all of them into
 * a single text containing the full Chat history.
 *
 * For simplicity for this demo, it only fetches the first 100 messages.
 *
 * Messages with slash commands are filtered out, so the returned history will
 * contain only the conversations between users and not app command invocations.
 *
 * @return {string} a text containing all the messages in the space in the format:
 *          Sender's name: Message
 */
function concatenateAllSpaceMessages_(spaceName) {
  // Call Chat API method spaces.messages.list
  const response = Chat.Spaces.Messages.list(spaceName, { 'pageSize': 100 });
  const messages = response.messages;
  // Fetch the display names of the message senders and returns a text
  // concatenating all the messages.
  let userMap = new Map();
  return messages
    .filter(message => message.slashCommand === undefined)
    .map(message => `${getUserDisplayName_(userMap, message.sender.name)}: ${message.text}`)
    .join('\n');
}

/**
 * Obtains the display name of a user by using the Admin Directory API.
 *
 * The fetched display name is cached in the provided map, so we only call the API
 * once per user.
 *
 * If the user does not have a display name, then the full name is used.
 *
 * @param {Map} userMap a map containing the display names previously fetched
 * @param {string} userName the resource name of the user
 * @return {string} the user's display name
 */
function getUserDisplayName_(userMap, userName) {
  if (userMap.has(userName)) {
    return userMap.get(userName);
  }
  let displayName = 'Unknown User';
  try {
    const user = AdminDirectory.Users.get(
      userName.replace("users/", ""),
      { projection: 'BASIC', viewType: 'domain_public' });
    displayName = user.name.displayName ? user.name.displayName : user.name.fullName;
  } catch (e) {
    // Ignore error if the API call fails (for example, because it's an
    // out-of-domain user or Chat app)) and just use 'Unknown User'.
  }
  userMap.set(userName, displayName);
  return displayName;
}

ChatSpaceCreator.gs

ユーザーがインシデントで入力したフォームデータを受け取る確認しました。このウェブページを使用して、Chat のスペースを作成して入力し、スペースに関するメッセージをできます。

`ChatSpaceCreator.gs` コードを表示

apps-script/incident-response/ChatSpaceCreator.gs

GitHub で表示

/**
 * Creates a space in Google Chat with the provided title and members, and posts an
 * initial message to it.
 *
 * @param {Object} formData the data submitted by the user. It should contain the fields
 *                          title, description, and users.
 * @return {string} the resource name of the new space.
 */
function createChatSpace(formData) {
  const users = formData.users.trim().length > 0 ? formData.users.split(',') : [];
  const spaceName = setUpSpace_(formData.title, users);
  addAppToSpace_(spaceName);
  createMessage_(spaceName, formData.description);
  return spaceName;
}

/**
 * Creates a space in Google Chat with the provided display name and members.
 *
 * @return {string} the resource name of the new space.
 */
function setUpSpace_(displayName, users) {
  const memberships = users.map(email => ({
    member: {
      name: `users/${email}`,
      type: "HUMAN"
    }
  }));
  const request = {
    space: {
      displayName: displayName,
      spaceType: "SPACE",
      externalUserAllowed: true
    },
    memberships: memberships
  };
  // Call Chat API method spaces.setup
  const space = Chat.Spaces.setup(request);
  return space.name;
}

/**
 * Adds this Chat app to the space.
 *
 * @return {string} the resource name of the new membership.
 */
function addAppToSpace_(spaceName) {
  const request = {
    member: {
      name: "users/app",
      type: "BOT"
    }
  };
  // Call Chat API method spaces.members.create
  const membership = Chat.Spaces.Members.create(request, spaceName);
  return membership.name;
}

/**
 * Posts a text message to the space on behalf of the user.
 *
 * @return {string} the resource name of the new message.
 */
function createMessage_(spaceName, text) {
  const request = {
    text: text
  };
  // Call Chat API method spaces.messages.create
  const message = Chat.Spaces.Messages.create(request, spaceName);
  return message.name;
}

DocsApi.gs

Google Docs API を呼び出して、Google ドキュメントドキュメントをユーザーの Google ドライブに作成され、インシデント情報の概要が書き込まれます。 VertexAiApi.gs に作成したファイルをドキュメントに追加します。

`DocsApi.gs` コードを表示

apps-script/incident-response/DocsApi.gs

GitHub で表示

/**
 * Creates a Doc in the user's Google Drive and writes a summary of the incident information to it.
 *
 * @param {string} title The title of the incident
 * @param {string} resolution Incident resolution described by the user
 * @param {string} chatHistory The whole Chat history be included in the document
 * @param {string} chatSummary A summary of the Chat conversation to be included in the document
 * @return {string} the URL of the created Doc
 */
function createDoc_(title, resolution, chatHistory, chatSummary) {
  let doc = DocumentApp.create(title);
  let body = doc.getBody();
  body.appendParagraph(`Post-Mortem: ${title}`).setHeading(DocumentApp.ParagraphHeading.TITLE);
  body.appendParagraph("Resolution").setHeading(DocumentApp.ParagraphHeading.HEADING1);
  body.appendParagraph(resolution);
  body.appendParagraph("Summary of the conversation").setHeading(DocumentApp.ParagraphHeading.HEADING1);
  body.appendParagraph(chatSummary);
  body.appendParagraph("Full Chat history").setHeading(DocumentApp.ParagraphHeading.HEADING1);
  body.appendParagraph(chatHistory);
  return doc.getUrl();
}

VertexAiApi.gs

Vertex AI を使用して、Chat スペース内の会話を要約します。この概要は、DocsAPI.gs の特別に作成されたドキュメントに投稿されます。

`VertexAiApi.gs` コードを表示

apps-script/incident-response/VertexAiApi.gs

GitHub で表示

/**
 * Summarizes a Chat conversation using the Vertex AI text prediction API.
 *
 * @param {string} chatHistory The Chat history that will be summarized.
 * @return {string} The content from the text prediction response.
 */
function summarizeChatHistory_(chatHistory) {
  const prompt =
    "Summarize the following conversation between Engineers resolving an incident"
      + " in a few sentences. Use only the information from the conversation.\n\n"
      + chatHistory;
  const request = {
    instances: [
      { prompt: prompt }
    ],
    parameters: {
      temperature: 0.2,
      maxOutputTokens: 256,
      topK: 40,
      topP: 0.95
    }
  }
  const fetchOptions = {
    method: 'POST',
    headers: { Authorization: 'Bearer ' + ScriptApp.getOAuthToken() },
    contentType: 'application/json',
    payload: JSON.stringify(request)
  }
  const response = UrlFetchApp.fetch(
    `https://${VERTEX_AI_LOCATION_ID}-aiplatform.googleapis.com/v1`
      + `/projects/${PROJECT_ID}/locations/${VERTEX_AI_LOCATION_ID}`
      + "/publishers/google/models/text-bison:predict",
    fetchOptions);
  const payload = JSON.parse(response.getContentText());
  return payload.predictions[0].content;
}

WebController.gs

インシデント初期化ウェブサイトを提供します。

`WebController.gs` コードを表示

apps-script/incident-response/WebController.gs

GitHub で表示

/**
 * Serves the web page from Index.html.
 */
function doGet() {
  return HtmlService
    .createTemplateFromFile('Index')
    .evaluate();
}

/**
 * Serves the web content from the specified filename.
 */
function include(filename) {
  return HtmlService
    .createHtmlOutputFromFile(filename)
    .getContent();
}

/**
 * Returns the email address of the user running the script.
 */
function getUserEmail() {
  return Session.getActiveUser().getEmail();
}

Index.html

インシデント初期化ウェブサイトを構成する HTML。

`Index.html` コードを表示

apps-script/incident-response/Index.html

GitHub で表示

<!DOCTYPE html>
<html>
  <head>
    <base target="_top">
    <link href='https://fonts.googleapis.com/css?family=Roboto' rel='stylesheet'>
    <?!= include('Stylesheet'); ?>
  </head>
  <body>
    <div class="container">
      <div class="content">
        <h1>Incident Manager</h1>
        <form id="incident-form" onsubmit="handleFormSubmit(this)">
          <div id="form">
            <p>
              <label for="title">Incident title</label><br/>
              <input type="text" name="title" id="title" />
            </p>
            <p>
              <label for="users">Incident responders</label><br/>
              <small>
                Please enter a comma-separated list of email addresses of the users
                that should be added to the space.
                Do not include <?= getUserEmail() ?> as it will be added automatically.
              </small><br/>
              <input type="text" name="users" id="users" />
            </p>
            <p>
              <label for="description">Initial message</label></br>
              <small>This message will be posted after the space is created.</small><br/>
              <textarea name="description" id="description"></textarea>
            </p>
            <p class="text-center">
              <input type="submit" value="CREATE CHAT SPACE" />
            </p>
          </div>
          <div id="output" class="hidden"></div>
          <div id="clear" class="hidden">
            <input type="reset" value="CREATE ANOTHER INCIDENT" onclick="onReset()" />
          </div>
        </form>
      </div>
    </div>
    <?!= include('JavaScript'); ?>
  </body>
</html>

JavaScript.html

フォームの送信、送信、インシデント初期化ウェブサイトのエラーを表示し、クリアします。これは、WebController.gs のカスタム include 関数によって Index.html に含まれます。

`JavaScript.html` コードを表示

apps-script/incident-response/JavaScript.html

GitHub で表示

<script>
  var formDiv = document.getElementById('form');
  var outputDiv = document.getElementById('output');
  var clearDiv = document.getElementById('clear');

  function handleFormSubmit(formObject) {
    event.preventDefault();
    outputDiv.innerHTML = 'Please wait while we create the space...';
    hide(formDiv);
    show(outputDiv);
    google.script.run
      .withSuccessHandler(updateOutput)
      .withFailureHandler(onFailure)
      .createChatSpace(formObject);
  }

  function updateOutput(response) {
    var spaceId = response.replace('spaces/', '');
    outputDiv.innerHTML =
      '<p>Space created!</p><p><a href="https://mail.google.com/chat/#chat/space/'
        + spaceId
        + '" target="_blank">Open space</a></p>';
    show(outputDiv);
    show(clearDiv);
  }

  function onFailure(error) {
    outputDiv.innerHTML = 'ERROR: ' + error.message;
    outputDiv.classList.add('error');
    show(outputDiv);
    show(clearDiv);
  }

  function onReset() {
    outputDiv.innerHTML = '';
    outputDiv.classList.remove('error');
    show(formDiv);
    hide(outputDiv);
    hide(clearDiv);
  }

  function hide(element) {
    element.classList.add('hidden');
  }

  function show(element) {
    element.classList.remove('hidden');
  }
</script>

Stylesheet.html

インシデント初期化ウェブサイトの CSS。これは、WebController.gs のカスタム include 関数によって Index.html に含まれます。

`Stylesheet.html` コードを表示

apps-script/incident-response/Stylesheet.html

GitHub で表示

<style>
  * {
    box-sizing: border-box;
  }
  body {
    font-family: Roboto, Arial, Helvetica, sans-serif;
  }
  div.container {
    display: flex;
    justify-content: center;
    align-items: center;
    position: absolute;
    top: 0; bottom: 0; left: 0; right: 0;
  }
  div.content {
    width: 80%;
    max-width: 1000px;
    padding: 1rem;
    border: 1px solid #999;
    border-radius: 0.25rem;
    box-shadow: 0 2px 2px 0 rgba(66, 66, 66, 0.08), 0 2px 4px 2px rgba(66, 66, 66, 0.16);
  }
  h1 {
    text-align: center;
    padding-bottom: 1rem;
    margin: 0 -1rem 1rem -1rem;
    border-bottom: 1px solid #999;
  }
 #output {
    text-align: center;
    min-height: 250px;
  }
  div#clear {
    text-align: center;
    padding-top: 1rem;
    margin: 1rem -1rem 0 -1rem;
    border-top: 1px solid #999;
  }
  input[type=text], textarea {
    width: 100%;
    padding: 1rem 0.5rem;
    margin: 0.5rem 0;
    border: 0;
    border-bottom: 1px solid #999;
    background-color: #f0f0f0;
  }
  textarea {
    height: 5rem;
  }
  small {
    color: #999;
  }
  input[type=submit], input[type=reset] {
    padding: 1rem;
    border: none;
    background-color: #6200ee;
    color: #fff;
    border-radius: 0.25rem;
    width: 25%;
  }
  .hidden {
    display: none;
  }
  .text-center {
    text-align: center;
  }
  .error {
    color: red;
  }
</style>

Cloud プロジェクト番号と ID を確認する

Google Cloud コンソールで、Cloud プロジェクトに移動します。

Google Cloud コンソールに移動
[設定とユーティリティ] をクリックします。 > [プロジェクト設定]。
[プロジェクト番号] フィールドと [プロジェクト ID] フィールドの値をメモします。マイページ以降のセクションで使用します。

Apps Script プロジェクトを作成する

Apps Script プロジェクトを作成して Cloud プロジェクトに接続するには:

次のボタンをクリックして、Google Chat でインシデントに対応する Apps Script プロジェクトを開きます。
プロジェクトを開く
[概要] をクリックします。
概要ページで [コピーを作成] をクリックします。
Apps Script プロジェクトのコピーに名前を付けます。
1. [Google Chat でインシデントに対応する] をクリックします。
2. [プロジェクトタイトル] に「Incident Management Chat app」と入力します。
3. [名前を変更] をクリックします。
Apps Script プロジェクトのコピーで、Consts.gs に移動します。 YOUR_PROJECT_ID を実際の ID に置き換えます。できます。

Apps Script プロジェクトの Cloud プロジェクトを設定する

Apps Script プロジェクトで、 [ プロジェクトの設定] をクリックします。
[Google Cloud Platform（GCP）プロジェクト] で、[プロジェクトを変更] をクリックします。
[GCP プロジェクト番号] に、Cloud プロジェクトのプロジェクト番号を貼り付けます。
[プロジェクトを設定] をクリックします。Cloud プロジェクトと Apps Script プロジェクトが接続されました。

Apps Script デプロイメントを作成する

すべてのコードが配置されたので、Apps Script をデプロイします。できます。デプロイ ID は、サービスを構成するときに Google Cloud の Chat アプリ。

Apps Script で、インシデントレスポンスアプリのプロジェクトを開きます。

Apps Script に移動
[Deploy] > [New deployment] をクリックします。
[アドオン] と [ウェブアプリ] がまだ選択されていない場合は、[種類の選択] の横にあるデプロイタイプをクリックし、[アドオン] と [ウェブアプリ] を選択します。
[説明] に、このバージョンの説明を入力します（例: Complete version of incident management app。
[Execute as] で [User linking the web app] を選択します。
[アクセス権を持つユーザー] で、[Workspace 組織内の全員] を選択します。ここで、[Workspace 組織] は Google Workspace 組織の名前です。
[デプロイ] をクリックします。Apps Script は、デプロイが正常に完了したことを報告し、デプロイ ID とインシデント初期化ウェブページの URL を提供します。
後でインシデントを開始したときに参照できるように、ウェブアプリの URL をメモしておきます。 [Deployment ID] をコピーします。この ID は、Google Cloud コンソールで Chat アプリを構成するときに使用します。
[完了] をクリックします。

Google Cloud コンソールで Chat 用アプリを構成する

このセクションでは、Google Cloud コンソールで Google Chat API を構成する方法について説明します。 Chat 用アプリに関する情報が表示されます。 Apps Script から作成したデプロイの ID できます。

Google Cloud コンソールで、メニュー > [その他のプロダクト] > [Google Workspace] > [プロダクトライブラリ] > [Google Chat API] > [管理] > [構成] をクリックします。

Chat API の構成に移動
[アプリ名] に「Incident Management」と入力します。
[アバターの URL] に「https://developers.google.com/chat/images/quickstart-app-avatar.png」と入力します。
[説明] に「Responds to incidents.」と入力します。
[インタラクティブ機能を有効にする] をクリックしてオンにします。
[機能] で、[1:1 のメッセージを受信する] と [スペースとグループの会話に参加する] を選択します。
[接続設定] で [Apps Script] を選択します。
[デプロイ ID] に、先ほど Apps Script プロジェクトのデプロイからコピーした Apps Script デプロイ ID を貼り付けます。
スラッシュコマンドを登録し、完全実装された Chat 用アプリでは以下を使用します。
1. [スラッシュコマンド] で [スラッシュコマンドを追加] をクリックします。
2. [名前] に「/closeIncident」と入力します。
3. [コマンド ID] に「1」と入力します。
4. [説明] に次のように入力します。 Closes the incident being discussed in the space.
5. [ダイアログを開く] を選択します。
6. [完了] をクリックします。スラッシュコマンドが登録され、一覧表示されます。
[公開設定] で [ この Chat 用アプリを、 [Workspace Domain] に移動してメールアドレスを入力します。
[ログ] で、[エラーを Logging にロギング] を選択します。
[保存] をクリックします。構成が保存されているというメッセージが表示され、アプリがテストの準備が整いました

Chat アプリをテストする

インシデント管理 Chat アプリをテストするには、ウェブページからインシデントを開始し、Chat アプリが想定どおりに動作することを確認します。

Apps Script デプロイウェブアプリの URL に移動します。
Apps Script からデータへのアクセス権を求められたら、[権限を確認] をクリックし、Google Workspace ドメインの適切な Google アカウントでログインして、[許可] をクリックします。
インシデントの初期化ウェブページが開きます。テスト情報を入力します。
1. [Incident title] に「The First Incident」と入力します。
2. 必要に応じて、[インシデント対応者] に、他のインシデント対応担当者と共有する必要があります対象となるのは、次のいずれかの属性を持つ Google Workspace 組織の Google Chat アカウント、または作成に失敗します。ご自身のメールアドレスは入力しないでください。自動的に含まれます。
3. [初期メッセージ] に「Testing the incident management Chat app.」と入力します。
[Create Chat Space] をクリックします。creating space メッセージが表示されます。
スペースが作成されると、Space created! メッセージが表示されます。[ スペースを開く: Chat のスペースが新しいタブで開きます。
必要に応じて、自分と他のインシデントレスポンダーがスペース内でメッセージを送信できます。アプリは Vertex AI を使用してこれらのメッセージを要約し、事後分析ドキュメントを共有します。
インシデント対応を終了して解決プロセスを開始するには、 Chat スペースの場合は、「/closeIncident」と入力します。インシデント管理ダイアログが開きます。
[インシデントをクローズ] に、インシデントの解決の説明（Test complete など）を入力します。
[インシデントを閉じる] をクリックします。

インシデント管理アプリは、スペース内のメッセージを一覧表示し、Vertex AI で要約し、要約を Google ドキュメントドキュメントに貼り付け、スペースでドキュメントを共有します。

クリーンアップ

このチュートリアルで使用したリソースに対して Google Cloud アカウントで課金されないようにするには、Cloud プロジェクトを削除することをおすすめします。

注意: プロジェクトを削除すると、次のような影響があります。

プロジェクト内のすべてのものが削除されます。このチュートリアルで既存のプロジェクトを使用した場合、それを削除すると、そのプロジェクトで行った他の作業もすべて削除されます。
カスタムプロジェクト ID が失われます。このプロジェクトを作成したときに、将来使用するカスタムプロジェクト ID を作成した可能性があります。appspot.com の URL など、プロジェクト ID を使用する URL を保持するには、プロジェクト全体を削除するのではなく、プロジェクト内の選択したリソースを削除します。

複数のチュートリアルとクイックスタートを実施する予定がある場合は、プロジェクトを再利用すると、プロジェクトの割り当て上限を超えないようにすることができます。

Google Cloud コンソールで、[リソースの管理] ページに移動します。[ メニュー > IAM と管理者 > [リソースの管理] をクリックします。
<ph type="x-smartling-placeholder"></ph> Resource Manager に移動
プロジェクトリストで、削除するプロジェクトを選択し、[削除] をクリックします。
ダイアログでプロジェクト ID を入力し、[シャットダウン] をクリックしてプロジェクトを削除します。

Gemini AI Chat アプリを使用して、Chat での会話に基づいて質問に回答する
Google Chat、Vertex AI、Firestore を使用してプロジェクトを管理する
インシデント対応アプリは、API を呼び出すためにユーザー認証情報で認証を行います。 Chat API や Vertex AI API などの Google Cloud サービスを呼び出すことができます。つまり、インシデントを初期化するユーザーは、これらの情報に提供します。アプリの堅牢性を高めるには、Vertex AI API の呼び出しを検討してください。ユーザー認証情報を使用する代わりに、サービスアカウントとして /closeIncident スラッシュコマンドを使用します。Vertex AI API のサービスアカウントの構成については、カスタムサービスアカウントを使用するをご覧ください。

Google Chat、Vertex AI、Apps Script を使用してインシデントに対応する

前提条件

目標

アーキテクチャ

環境を準備する

Google Cloud プロジェクトを作成する

Google Cloud コンソール

gcloud CLI

Cloud プロジェクトの課金を有効にする

Google Cloud コンソール

gcloud CLI

API を有効にする

Google Cloud コンソール

gcloud CLI

認証と権限付与の設定

Chat アプリを作成してデプロイする

Consts.gs コードを表示

ChatApp.gs コードを表示

ChatSpaceCreator.gs コードを表示

DocsApi.gs コードを表示

VertexAiApi.gs コードを表示

WebController.gs コードを表示

Index.html コードを表示

JavaScript.html コードを表示

Stylesheet.html コードを表示

Cloud プロジェクト番号と ID を確認する

Apps Script プロジェクトを作成する

Apps Script プロジェクトの Cloud プロジェクトを設定する

Apps Script デプロイメントを作成する

Google Cloud コンソールで Chat 用アプリを構成する

Chat アプリをテストする

クリーンアップ

関連トピック

`Consts.gs` コードを表示

`ChatApp.gs` コードを表示

`ChatSpaceCreator.gs` コードを表示

`DocsApi.gs` コードを表示

`VertexAiApi.gs` コードを表示

`WebController.gs` コードを表示

`Index.html` コードを表示

`JavaScript.html` コードを表示

`Stylesheet.html` コードを表示