Реагируйте на инциденты с помощью Google Chat, Vertex AI, Apps Script и аутентификации пользователей.

В этом руководстве показано, как создать приложение Google Chat, которое реагирует на инциденты в режиме реального времени. При реагировании на инцидент приложение создает и заполняет пространство чата, способствует разрешению инцидента с помощью сообщений, команд приложения и диалогов, а также использует искусственный интеллект для обобщения информации об инциденте в документе Google Docs.

Инцидент — это событие, требующее немедленного внимания группы людей для его разрешения. Примеры инцидентов включают:

• В платформе управления взаимоотношениями с клиентами (CRM) создается срочный запрос, требующий совместной работы сервисной команды для его решения.
• Система выходит из строя, что оповещает группу инженеров по обеспечению надежности сайта (SRE), чтобы они могли совместно восстановить ее работу.
• Происходит землетрясение высокой магнитуды, и спасателям необходимо скоординировать свои действия.

В рамках данного руководства оповещение об инциденте начинается, когда кто-то сообщает об инциденте, нажав кнопку на веб-странице. Веб-страница имитирует инцидент, запрашивая у пользователей основную информацию об инциденте: заголовок, описание и адреса электронной почты лиц, прибывших на место происшествия.

Посмотрите, как работает приложение для чата в системе управления инцидентами:

Предпосылки

Если для вашей организации необходимо включить какие-либо из этих предварительных условий, попросите администратора Google Workspace сделать это:

• Корпоративный аккаунт Google Workspace с доступом к Google Chat .
• Чтобы включить функцию «Справочник контактов» (Root Directory ) для Google Workspace, приложение для обработки инцидентов использует справочник для поиска контактной информации сотрудников, занимающихся реагированием на инциденты, такой как имя и адрес электронной почты. Сотрудники, занимающиеся реагированием на инциденты, должны быть пользователями с учетной записью Google Chat в вашей организации Google Workspace.

Цели

• Разработайте чат-приложение, которое реагирует на инциденты.
• Помогите пользователям реагировать на инциденты, выполнив следующие действия:
  • Создание зон реагирования на инциденты.
  • Публикация сообщений с кратким изложением инцидентов и принятых мер.
  • Поддержка совместной работы с помощью интерактивных функций чат-приложения.
• Подведите итоги обсуждений и принятых решений с помощью Vertex AI.

Архитектура

На следующей диаграмме показана архитектура ресурсов Google Workspace и Google Cloud, используемых приложением Google Chat для реагирования на инциденты.

Архитектура демонстрирует, как приложение Google Chat для реагирования на инциденты обрабатывает инцидент и устраняет его.

1. Пользователь инициирует инцидент с внешнего веб-сайта, размещенного на Apps Script.

2. Веб-сайт отправляет асинхронный HTTP-запрос приложению Google Chat, также размещенному на Apps Script.

3. Приложение Google Chat для реагирования на инциденты обрабатывает запрос:

   1. Сервис Apps Script Admin SDK получает информацию о членах команды, такую ​​как идентификатор пользователя и адрес электронной почты.

   2. С помощью набора HTTP-запросов к API чата, используя сервис Apps Script Advanced Chat, приложение Google Chat для реагирования на инциденты создает пространство чата для инцидентов, заполняет его участниками команды и отправляет сообщение в это пространство.

4. Члены команды обсуждают инцидент в чате.

5. Член команды быстро отдает команду, сигнализируя о разрешении инцидента.

   1. HTTP-запрос к API чата с использованием сервиса Apps Script Advanced Chat выводит список всех сообщений в чате.

   2. Vertex AI получает перечисленные сообщения и генерирует сводку.

   3. Сервис Apps Script DocumentApp создает документ Docs и добавляет в него краткое описание от Vertex AI.

   4. Приложение Google Chat для реагирования на инциденты вызывает API чата, чтобы отправить сообщение, содержащее ссылку на сводный документ Docs.

Подготовьте окружающую среду

В этом разделе показано, как создать и настроить проект Google Cloud для приложения «Чат».

Создайте проект в Google Cloud.

Консоль Google Cloud

1. В консоли Google Cloud перейдите в menu > IAM и администрирование > Создать проект .

   Перейдите в раздел «Создать проект».

2. В поле «Название проекта» введите описательное название для вашего проекта.

   Необязательно: чтобы изменить идентификатор проекта , нажмите «Редактировать» . Идентификатор проекта нельзя изменить после его создания, поэтому выберите идентификатор, который будет соответствовать вашим потребностям на протяжении всего срока действия проекта.

3. В поле «Местоположение» нажмите «Обзор» , чтобы отобразить возможные места для вашего проекта. Затем нажмите «Выбрать» .
4. Нажмите «Создать» . Консоль Google Cloud перенаправит вас на страницу «Панель управления», и ваш проект будет создан в течение нескольких минут.

gcloud CLI

В одной из следующих сред разработки получите доступ к интерфейсу командной строки Google Cloud ( gcloud ):

• Cloud Shell : Чтобы использовать онлайн-терминал с уже настроенным интерфейсом командной строки gcloud, активируйте Cloud Shell.
  Активировать Cloud Shell
• Локальная оболочка : Для использования локальной среды разработки установите и инициализируйте интерфейс командной строки gcloud.
  Для создания облачного проекта используйте команду ` gcloud projects create :

  gcloud projects create PROJECT_ID

  Замените PROJECT_ID на идентификатор проекта, который вы хотите создать.

Включить выставление счетов для облачного проекта

Консоль Google Cloud

1. В консоли Google Cloud перейдите в menu «Биллинг» . Нажмите меню > Биллинг > Мои проекты .

   Перейдите в раздел «Оплата моих проектов».

2. В разделе «Выберите организацию» выберите организацию, связанную с вашим проектом Google Cloud.
3. В строке проекта откройте меню «Действия» ( more_vert ), нажмите «Изменить выставление счетов» и выберите учетную запись Cloud Billing.
4. Нажмите «Настроить учетную запись» .

gcloud CLI

1. Чтобы отобразить список доступных платежных аккаунтов, выполните следующую команду:

   gcloud billing accounts list

2. Свяжите платежный аккаунт с проектом Google Cloud:

   gcloud billing projects link PROJECT_ID --billing-account=BILLING_ACCOUNT_ID

   Замените следующее:

   • PROJECT_ID — это идентификатор проекта в облаке, для которого вы хотите включить выставление счетов.
   • BILLING_ACCOUNT_ID — это идентификатор платежного аккаунта , который будет связан с проектом Google Cloud.

Включите API

Настройте аутентификацию и авторизацию.

Аутентификация и авторизация позволяют приложению «Чат» получать доступ к ресурсам в Google Workspace и Google Cloud для обработки запросов на реагирование на инциденты.

В этом руководстве вы публикуете приложение внутри компании, поэтому использование информации-заполнителя допустимо. Перед публикацией приложения за пределами компании замените информацию-заполнитель реальной информацией на экране согласия.

1. В консоли Google Cloud перейдите в menu >Google Auth platform > Брендинг .

   Перейти к разделу «Брендинг»

2. Если вы уже настроилиGoogle Auth platformВы можете настроить следующие параметры экрана согласия OAuth в разделах «Брендинг» , «Аудитория» и «Доступ к данным» . Если вы видите сообщение, в котором говорится... Google Auth platform Если конфигурация еще не выполнена , нажмите «Начать» :

   1. В разделе «Информация о приложении» в поле «Название приложения» введите Incident Management with User Auth .
   2. В разделе «Электронная почта службы поддержки пользователей» выберите свой адрес электронной почты или соответствующую группу Google.
   3. Нажмите «Далее» .
   4. В разделе «Аудитория» выберите «Внутренняя» . Если выбрать «Внутренняя» невозможно, выберите «Внешняя» .
   5. Нажмите «Далее» .
   6. В поле «Контактная информация» укажите адрес электронной почты , на который вы сможете получать уведомления об изменениях в вашем проекте.
   7. Нажмите «Далее» .
   8. В разделе «Завершить» ознакомьтесь с Политикой использования пользовательских данных сервисов Google API и, если вы согласны, выберите «Я согласен с Политикой использования пользовательских данных сервисов Google API» .
   9. Нажмите «Продолжить» .
   10. Нажмите «Создать» .
   11. Если для типа пользователя выбран «Внешний» , добавьте тестовых пользователей:
       1. Нажмите «Аудитория» .
       2. В разделе «Проверка пользователей» нажмите «Добавить пользователей» .
       3. Введите свой адрес электронной почты и имена других авторизованных пользователей, участвующих в тестировании, затем нажмите «Сохранить» .

3. Нажмите «Доступ к данным» > «Добавить или удалить области действия ». Откроется панель со списком областей действия для каждого API, который вы включили в своем проекте Google Cloud.

   1. В разделе «Добавить области действия вручную» вставьте следующие области действия:

      • 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

   2. Нажмите «Добавить в таблицу» .

   3. Нажмите «Обновить» .

   4. После выбора областей доступа, необходимых для вашего приложения, на странице «Доступ к данным» нажмите «Сохранить» .

Создайте и разверните приложение «Чат».

В следующем разделе вы скопируете и обновите весь проект Apps Script, содержащий весь необходимый код приложения для вашего чат-приложения, поэтому нет необходимости копировать и вставлять каждый файл по отдельности.

Некоторые функции содержат подчеркивания в конце своих имен, например, concatenateAllSpaceMessages_() из ChatApp.gs . Подчеркивание скрывает функцию на веб-странице инициализации инцидента, когда она открыта в браузере. Для получения дополнительной информации см. раздел «Приватные функции» .

Apps Script поддерживает два типа файлов: скрипты .gs и файлы .html . Для обеспечения этой поддержки клиентский JavaScript приложения включается внутри тегов <script /> , а его CSS — внутри тегов <style /> в HTML-файле.

При желании вы можете посмотреть весь проект на GitHub.

Посмотреть на GitHub

Вот краткий обзор каждого файла:

Consts.gs

Определяет константы, на которые ссылаются другие файлы кода, включая идентификатор вашего проекта Cloud, идентификатор местоположения Vertex AI, идентификатор быстрой команды для закрытия инцидента и модель Gemini.

Просмотреть код Consts.gs

apps-script/chat/incident-response-user-auth/Consts.gs

Посмотреть на GitHub

const PROJECT_ID = 'replace-with-your-project-id';
const VERTEX_AI_LOCATION_ID = 'us-central1';
const CLOSE_INCIDENT_COMMAND_ID = 1;
const MODEL_ID = 'gemini-2.5-flash-lite';

ChatApp.gs

Обрабатывает события взаимодействия в чате, включая сообщения, нажатия кнопок, команды приложения и диалоги. Отвечает на быструю команду Close incident , открывая диалог для сбора подробной информации о разрешении инцидента. Читает сообщения в пространстве, вызывая метод spaces.messages.list в API чата. Получает идентификаторы пользователей, используя службу каталогов Admin SDK в Apps Script.

Просмотреть код ChatApp.gs

apps-script/chat/incident-response-user-auth/ChatApp.gs

Посмотреть на GitHub

/**
 * Responds to a MESSAGE event in Google Chat.
 * 
 * It always responds with a simple "Hello" text message.
 *
 * @param {Object} event the event object from Google Chat
 */
function onMessage(event) {
  return { hostAppDataAction: { chatDataAction: { createMessageAction: { message: {
    text: "Hello from Incident Response app!"
  }}}}};
}

/**
 * Responds to an APP_COMMAND event in Google Chat.
 *
 * @param {Object} event the event object from Google Chat
 */
function onAppCommand(event) {
  if (event.chat.appCommandPayload.appCommandMetadata.appCommandId != CLOSE_INCIDENT_COMMAND_ID) {
    return { hostAppDataAction: { chatDataAction: { createMessageAction: { message: {
      text: "Command not recognized. Use the quick command `Close incident` to close the incident managed by this space."
    }}}}};
  }
  return { action: { navigations: [{ pushCard: { 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" }}
      }]}
    }]
  }]}}]}};
}

/**
 * Responds to a BUTTON_CLICKED event in Google Chat from Close Incident dialog.
 *
 * @param {Object} event the event object from Google Chat
 */
function closeIncident(event) {
  if (event.chat.buttonClickedPayload.isDialogEvent) {
    if (event.chat.buttonClickedPayload.dialogEventType == 'SUBMIT_DIALOG') {
      return processSubmitDialog_(event);
    }
    return { action: { navigations: [{ endNavigation: {
      action: "CLOSE_DIALOG" }
    }]}};
  }
}

/**
 * Responds to a BUTTON_CLICKED event in Google Chat from Close Incident dialog submission.
 *
 * 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.commonEventObject.formInputs.description.stringInputs.value[0];
  const space = event.chat.buttonClickedPayload.space;
  const chatHistory = concatenateAllSpaceMessages_(space.name);
  const chatSummary = summarizeChatHistory_(chatHistory);
  const docUrl = createDoc_(space.displayName, resolution, chatHistory, chatSummary);
  return { hostAppDataAction: { chatDataAction: { createMessageAction: { 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.
 *
 * @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
    .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

Получает данные, введенные пользователями на веб-странице инициализации инцидента, использует их для создания и заполнения чата, а затем публикует сообщение об инциденте.

Посмотреть код ChatSpaceCreator.gs

apps-script/chat/incident-response-user-auth/ChatSpaceCreator.gs

Посмотреть на GitHub

/**
 * Handles an incident by creating a chat space with the provided title and members, and posting a message.
 * All the actions are done using user credentials.
 *
 * @param {Object} formData - The data submitted by the user. It should contain the fields:
 *                           - title: The display name of the chat space.
 *                           - description: The description of the incident.
 *                           - users: A comma-separated string of user emails to be added to the space.
 * @return {string} The resource name of the new space.
 */
function handleIncident(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 chat space.
 *
 * @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"
    },
    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;
}

/**
 * Creates a chat message.
 *
 * @param {string} spaceName - The resource name of the space.
 * @param {string} message - The text to be posted.
 * @return {string} the resource name of the new message.
 */
function createMessage_(spaceName, message) {
  const request = {
    text: message
  };
  // Call Chat API method spaces.messages.create
  const result = Chat.Spaces.Messages.create(request, spaceName);
  return result.name;
}

DocsApi.gs

Вызывает API Google Docs для создания документа Google Docs в Google Диске пользователя и записывает в документ сводную информацию об инциденте, созданную в файле VertexAiApi.gs .

Просмотреть код DocsApi.gs

apps-script/chat/incident-response-user-auth/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. Это резюме публикуется в специально созданном документе в DocsAPI.gs .

Посмотреть код VertexAiApi.gs

apps-script/chat/incident-response-user-auth/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 API_ENDPOINT = `https://${VERTEX_AI_LOCATION_ID}-aiplatform.googleapis.com/v1/projects/${PROJECT_ID}/locations/${VERTEX_AI_LOCATION_ID}/publishers/google/models/${MODEL_ID}:generateContent`;
  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;
  // Get the access token.
  const accessToken = ScriptApp.getOAuthToken();

  const headers = {
    'Authorization': 'Bearer ' + accessToken,
    'Content-Type': 'application/json',
  };
  const payload = {
    'contents': {
      'role': 'user',
      'parts' : [
        {
          'text': prompt
        }
      ]
    }
  }
  const options = {
    'method': 'post',
    'headers': headers,
    'payload': JSON.stringify(payload),
    'muteHttpExceptions': true,
  };
  try {
    const response = UrlFetchApp.fetch(API_ENDPOINT, options);
    const responseCode = response.getResponseCode();
    const responseText = response.getContentText();

    if (responseCode === 200) {
      const jsonResponse = JSON.parse(responseText);
      console.log(jsonResponse)
      if (jsonResponse.candidates && jsonResponse.candidates.length > 0) {
        return jsonResponse.candidates[0].content.parts[0].text; // Access the summarized text
      } else {
        return "No summary found in response.";
      }

    } else {
      console.error("Vertex AI API Error:", responseCode, responseText);
      return `Error: ${responseCode} - ${responseText}`;
    }
  } catch (e) {
    console.error("UrlFetchApp Error:", e);
    return "Error: " + e.toString();
  }
}

WebController.gs

Обслуживает веб-сайт инициализации инцидентов.

Просмотреть код WebController.gs

apps-script/chat/incident-response-user-auth/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/chat/incident-response-user-auth/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

Обрабатывает поведение форм, включая отправку, ошибки и очистку, для веб-сайта инициализации инцидента. Он включается в Index.html с помощью пользовательской функции include в WebController.gs .

Просмотреть код JavaScript.html

apps-script/chat/incident-response-user-auth/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)
      .handleIncident(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-код для веб-сайта инициализации инцидента. Он включается в Index.html с помощью пользовательской функции include в WebController.gs .

Просмотреть код файла Stylesheet.html

apps-script/chat/incident-response-user-auth/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>

Найдите номер и идентификатор вашего облачного проекта.

1. В консоли Google Cloud перейдите к своему проекту в облаке.

   Перейдите в консоль Google Cloud.

2. Нажмите «Настройки и утилиты» > more_vert Настройки проекта» .

3. Обратите внимание на значения в полях «Номер проекта» и «Идентификатор проекта» . Вы будете использовать их в следующих разделах.

Создайте проект Apps Script.

Чтобы создать проект Apps Script и связать его с вашим облачным проектом:

1. Нажмите следующую кнопку, чтобы открыть проект « Приложение чата управления инцидентами с использованием скрипта приложений для аутентификации пользователей» .
   Откройте проект
2. Нажмите на info_outline Overview .
3. На странице обзора нажмите Сделайте копию .

4. Назовите свою копию проекта Apps Script:

   1. Нажмите «Скопировать приложение чата управления инцидентами с авторизацией пользователя» .

   2. В поле «Название проекта» введите Incident Management Chat app with User Auth .

   3. Нажмите «Переименовать» .

5. В вашей копии проекта Apps Script перейдите к файлу Consts.gs и установите PROJECT_ID равным идентификатору вашего облачного проекта.

Установите проект Cloud для проекта Apps Script.

1. В проекте Apps Script нажмите Настройки проекта .
2. В разделе «Проект Google Cloud Platform (GCP)» нажмите «Изменить проект» .
3. В поле "Номер проекта GCP" вставьте номер вашего облачного проекта.
4. Нажмите «Установить проект» . Проект «Облако» и проект «Apps Script» теперь связаны.

Создайте тестовый сценарий развертывания Apps Script.

Теперь, когда весь код готов, разверните проект Apps Script. Идентификатор развертывания используется при настройке приложения «Чат» в Google Cloud.

1. В Apps Script откройте проект приложения для реагирования на инциденты.

   Перейдите в раздел Apps Script.

2. Нажмите «Развернуть» > «Проверить развертывания» .

3. Если надстройка Google Workspace и веб-приложение еще не выбраны, рядом с пунктом «Выберите тип» нажмите «Типы развертывания». и выберите надстройку Google Workspace и веб-приложение .

4. Apps Script предоставляет идентификатор развертывания и URL-адрес для веб-приложения.

5. Запишите URL-адрес веб-приложения , чтобы посетить его позже при создании инцидента. Скопируйте идентификатор развертывания . Этот идентификатор используется при настройке приложения чата в консоли Google Cloud.

6. Нажмите «Готово» .

Настройте приложение «Чат» в консоли Google Cloud.

В этом разделе показано, как настроить API Google Chat в консоли Google Cloud, используя информацию о вашем приложении Chat, включая идентификатор развертывания, которое вы только что создали из своего проекта Apps Script.

1. В консоли Google Cloud перейдите menu > Дополнительные продукты > Google Workspace > Библиотека продуктов > Google Chat API > Управление > Конфигурация .

   Перейдите в раздел «Настройка API чата».

2. В поле «Название приложения» введите Incident Management with User Auth .

3. В поле "URL аватара" введите https://developers.google.com/chat/images/quickstart-app-avatar.png .

4. В поле «Описание» введите Responds to incidents .

5. Переведите переключатель «Включить интерактивные функции» в положение «Вкл.».

6. В разделе «Функциональность» выберите «Присоединяйтесь к пространствам и групповым беседам» .

7. В разделе «Настройки подключения» выберите «Apps Script» .

8. В поле «Идентификатор развертывания» вставьте идентификатор развертывания Apps Script, который вы скопировали ранее из развертывания проекта Apps Script.

9. Зарегистрируйте быструю команду , которую будет использовать полностью реализованное приложение чата:

   1. В разделе «Команды» нажмите «Добавить команду» .

   2. В поле «Идентификатор команды» введите 1 .

   3. В поле «Описание» введите: Closes the incident being discussed in the space.

   4. В разделе «Тип команды» выберите «Быстрая команда» .

   5. В поле «Имя быстрой команды» введите Close incident .

   6. Выберите диалоговое окно .

   7. Нажмите «Готово» . Команда зарегистрирована и отображается в списке.

10. В разделе «Видимость» выберите «Сделать это приложение чата доступным для определенных людей и групп в вашем домене рабочего пространства» и введите свой адрес электронной почты.

11. В разделе «Журналы» выберите « Записывать ошибки в журнал» и перейдите в раздел «Ведение журнала» .

12. Нажмите «Сохранить» . Появится сообщение о сохранении конфигурации, что означает, что приложение готово к тестированию.

Протестируйте приложение для чата

Для проверки работы приложения «Чат» для управления инцидентами создайте инцидент на веб-странице и убедитесь, что приложение «Чат» работает должным образом:

1. Перейдите по URL-адресу веб-приложения, развернутого с помощью Apps Script.

2. Когда Apps Script запросит разрешение на доступ к вашим данным, нажмите «Просмотреть разрешения» , войдите в систему с помощью соответствующей учетной записи Google в домене Google Workspace и нажмите «Разрешить» .

3. Открывается веб-страница инициализации инцидента. Введите тестовую информацию:

   1. В поле «Заголовок инцидента» введите The First Incident .
   2. При желании в разделе «Участники реагирования на инциденты» укажите адреса электронной почты ваших коллег, участвующих в реагировании на инциденты. Они должны быть пользователями с учетной записью Google Chat в вашей организации Google Workspace, иначе создание пространства не удастся. Не вводите свой собственный адрес электронной почты, так как он будет добавлен автоматически.
   3. В поле «Начальное сообщение» введите Testing the incident management Chat app.

4. Нажмите «Создать чат» . Появится сообщение creating space .

5. После создания пространства появится сообщение Space created! . Нажмите «Открыть пространство» , и оно откроется в чате в новой вкладке.

6. При желании вы и другие участники реагирования на инцидент можете отправлять сообщения в этом пространстве. Приложение обобщает эти сообщения с помощью Vertex AI и предоставляет документ с обзором ситуации.

7. Чтобы завершить реагирование на инцидент и начать процесс его устранения, в чате воспользуйтесь быстрой командой Close incident . Откроется диалоговое окно управления инцидентами.

8. В поле «Закрыть инцидент» введите описание решения инцидента, например, Test complete .

9. Нажмите «Закрыть инцидент» .

Приложение для управления инцидентами отображает список сообщений в пространстве, суммирует их с помощью Vertex AI, вставляет краткое описание в документ Google Docs и делится этим документом в пространстве.

Уборка

Чтобы избежать списания средств с вашего аккаунта Google Cloud за ресурсы, использованные в этом руководстве, мы рекомендуем удалить проект Cloud.

1. В консоли Google Cloud перейдите на страницу «Управление ресурсами» menu > IAM и администрирование > Управление ресурсами .

   Перейдите в Диспетчер ресурсов

2. В списке проектов выберите проект, который хотите удалить, и нажмите кнопку «Удалить delete .
3. В диалоговом окне введите идентификатор проекта, а затем нажмите «Завершить» , чтобы удалить проект.

Связанные темы

• Планируйте поездки с помощью ИИ-агента, доступного во всем Google Workspace.
• Отвечайте на вопросы, основанные на диалогах в чате, с помощью приложения Gemini AI Chat.
• Управляйте проектами с помощью Google Chat, Vertex AI и Firestore.
• Проверка фактов с помощью агента ADK AI и модели Gemini.
• Интегрируйте фундаментальные концепции искусственного интеллекта в чат-приложения.
• Создайте приложение для чата в качестве дополнения к Google Workspace с помощью Apps Script.