Reagowanie na incydenty przy użyciu Google Chat, Vertex AI i Apps Script

W tym samouczku pokazujemy, jak utworzyć aplikację Google Chat, która będzie reagować na incydenty w czasie rzeczywistym. Podczas reagowania na incydent aplikacja tworzy i wypełnia pokój Google Chat, ułatwia rozwiązywanie incydentu za pomocą wiadomości, poleceń z użyciem znaku ukośnika i dialogów, a także wykorzystuje AI do podsumowywania reakcji na incydent w dokumencie Dokumentów Google.

Incydent to zdarzenie, które wymaga natychmiastowej uwagi zespołu, aby można było je rozwiązać. Przykłady incydentów:

  • Ważne zgłoszenie jest tworzone na platformie do zarządzania relacjami z klientami (CRM), co wymaga współpracy zespołu pomocy w celu rozwiązania problemu.
  • System zostaje odłączony od sieci, co powoduje wysłanie powiadomienia do grupy inżynierów ds. niezawodności witryny (SRE), aby mogli wspólnie przywrócić system do działania.
  • Występuje silne trzęsienie ziemi, a pracownicy służb ratunkowych muszą skoordynować swoje działania.

Na potrzeby tego samouczka alert o incydencie rozpoczyna się, gdy ktoś zgłosi incydent przez kliknięcie przycisku na stronie internetowej. Strona internetowa symuluje incydent, prosząc użytkowników o podanie podstawowych informacji o incydencie: tytułu, opisu i adresów e-mail osób odpowiadających na zgłoszenie.

Zobacz aplikację Google Chat do zarządzania incydentami w akcji:

  • Witryna, która powoduje wystąpienie incydentu.
    Rysunek 1. Witryna, w której użytkownicy mogą zgłaszać incydenty.
  • Powiadomienie o utworzeniu pokoju czatu dotyczącego incydentu.
    Rysunek 2. Powiadomienie o utworzeniu pokoju czatu dotyczącego incydentu.
  • Pokój Google Chat na potrzeby reagowania na incydenty.
    Rysunek 3. Pokój czatu dotyczący reagowania na incydenty.
  • Rozwiązanie incydentu za pomocą polecenia po ukośniku.
    Rysunek 4. Rozwiązanie problemu za pomocą polecenia po ukośniku.
  • Okno rozwiązania incydentu
    Rysunek 5. Okno rozwiązywania incydentów
  • Dokument Dokumenty Google zawierający rozwiązanie problemu, udostępniony w pokoju.
    Rysunek 6. Dokument Dokumenty Google zawierający rozwiązanie problemu udostępniony w pokoju.
  • Dokument Google zawierający rozwiązanie problemu z podsumowywaniem AI.
    Rysunek 7. Dokument w Dokumentach Google zawierający rozwiązanie problemu z podsumowaniem AI.

Wymagania wstępne

Jeśli chcesz włączyć te wymagania w swojej organizacji, poproś administratora Google Workspace o ich włączenie:

  • Konto Google Workspace w wersji Business lub Enterprise z dostępem do Google Chat.
  • Aby włączyć Katalog (udostępnianie kontaktów) w Google Workspace. Aplikacja do zarządzania incydentami korzysta z katalogu, aby wyszukać dane kontaktowe osób reagujących na incydenty, takie jak imię i nazwisko oraz adres e-mail. Osoby reagujące na incydenty muszą być użytkownikami z kontem Google Chat w Twojej organizacji Google Workspace.

Cele

  • Utwórz aplikację Google Chat, która reaguje na incydenty.
  • Pomóż użytkownikom reagować na incydenty:
    • tworzenie przestrzeni do reagowania na incydenty.
    • publikowanie wiadomości podsumowujących incydenty i odpowiedzi;
    • Wspieranie współpracy za pomocą interaktywnych funkcji aplikacji Google Chat.
  • streszczać rozmowy i rozwiązania za pomocą Vertex AI.

Architektura

Na poniższym diagramie przedstawiono architekturę zasobów Google Workspace i Google Cloud używanych przez aplikację Google Chat do reagowania na incydenty.

Architektura aplikacji Google Chat do reagowania na incydenty

Architektura pokazuje, jak aplikacja Google Chat do reagowania na incydenty przetwarza incydent i jego rozwiązanie.

  1. Użytkownik zgłasza incydent z zewnętrznej witryny hostowanej w Apps Script.

  2. Witryna wysyła asynchroniczne żądanie HTTP do aplikacji Google Chat, która jest również hostowana w Apps Script.

  3. Aplikacja Google Chat do reagowania na incydenty przetwarza prośbę:

    1. Usługa pakietu SDK do administracji Apps Script otrzymuje informacje o członkach zespołu, takie jak identyfikator użytkownika i adres e-mail.

    2. Za pomocą zestawu żądań HTTP do interfejsu Chat API za pomocą usługi Chat zaawansowany w Apps Script aplikacja Google Chat tworzy pokój Google Chat dotyczący incydentu, wypełnia go członkami zespołu i wysyła do niego wiadomość.

  4. Członkowie zespołu omawiają zdarzenie w pokoju Google Chat.

  5. Członek zespołu wywołuje polecenie ukośnikowe, aby zasygnalizować rozwiązanie problemu.

    1. Wywołanie HTTP interfejsu Chat API za pomocą usługi Apps Script Advanced Chat, która zawiera listę wszystkich wiadomości w pokoju Google Chat.

    2. Vertex AI odbiera wymienione wiadomości i generuje ich podsumowanie.

    3. Usługa Apps Script DocumentApp tworzy dokument Docs i dodaje do niego streszczenie z Vertex AI.

    4. Aplikacja Google Chat do obsługi incydentów wywołuje interfejs Google Chat API, aby wysłać wiadomość z linkiem do dokumentu Dokumenty z podsumowaniem.

Przygotowywanie środowiska

Z tej sekcji dowiesz się, jak utworzyć i skonfigurować projekt Google Cloud dla aplikacji Google Chat.

Tworzenie projektu Google Cloud

Google Cloud Console

  1. W konsoli Google Cloud kliknij Menu  > Administracja > Utwórz projekt.

    Otwórz stronę Utwórz projekt

  2. W polu Nazwa projektu wpisz nazwę projektu.

    Opcjonalnie: aby edytować identyfikator projektu, kliknij Edytuj. Po utworzeniu projektu nie można zmienić jego identyfikatora. Wybierz więc identyfikator, który będzie odpowiadał Twoim potrzebom przez cały czas trwania projektu.

  3. W polu Lokalizacja kliknij Przeglądaj, aby wyświetlić potencjalne lokalizacje dla projektu. Następnie kliknij Wybierz.
  4. Kliknij Utwórz. Konsola Google Cloud przejdzie do strony Panelu, a Twój projekt zostanie utworzony w ciągu kilku minut.

interfejs wiersza poleceń gcloud

W jednym z tych środowisk programistycznych uzyskaj dostęp do interfejsu wiersza poleceń Google Cloud (gcloud):

  • Cloud Shell: aby korzystać z terminala online z już skonfigurowanym interfejsem gcloud CLI, aktywuj Cloud Shell.
    Aktywuj Cloud Shell
  • Interfejs lokalny: aby korzystać z lokalnego środowiska programistycznego, zainstaluj i inicjuj interfejs wiersza poleceń gcloud.
    Aby utworzyć projekt Cloud, użyj polecenia gcloud projects create: 
    gcloud projects create PROJECT_ID
    Zastąp PROJECT_ID identyfikatorem projektu, który chcesz utworzyć.

Włączanie płatności w projekcie Cloud

Google Cloud Console

  1. W konsoli Google Cloud otwórz Płatności. Kliknij Menu > Płatności > Moje projekty.

    Otwórz stronę Płatności w sekcji Moje projekty

  2. W sekcji Wybierz organizację wybierz organizację powiązaną z Twoim projektem Google Cloud.
  3. W wierszu projektu otwórz menu Działania (), kliknij Zmień ustawienia płatności i wybierz konto rozliczeniowe Cloud Billing.
  4. Kliknij Skonfiguruj konto.

interfejs wiersza poleceń gcloud

  1. Aby wyświetlić listę dostępnych kont rozliczeniowych, wykonaj te czynności: 
    gcloud billing accounts list
  2. Aby połączyć konto rozliczeniowe z projektem Google Cloud: 
    gcloud billing projects link PROJECT_ID --billing-account=BILLING_ACCOUNT_ID

    Zastąp następujące elementy:

    • PROJECT_ID to identyfikator projektu projektu Cloud, w którym chcesz włączyć płatności.
    • BILLING_ACCOUNT_ID to identyfikator konta rozliczeniowego, które chcesz połączyć z projektem Google Cloud.

Włącz interfejsy API

Google Cloud Console

  1. W konsoli Google Cloud włącz interfejsy API Google Chat, Google Docs, Admin SDK i Vertex AI.

    Włącz interfejsy API

  2. Sprawdź, czy interfejsy API są włączone w prawidłowym projekcie Cloud, a potem kliknij Dalej.

  3. Sprawdź, czy włączasz odpowiednie interfejsy API, a potem kliknij Włącz.

interfejs wiersza poleceń gcloud

  1. W razie potrzeby ustaw bieżący projekt Cloud na ten, który utworzyłeś/utworzyłaś za pomocą polecenia gcloud config set project:

    gcloud config set project PROJECT_ID

    Zastąp PROJECT_ID identyfikatorem projektu utworzonego projektu Cloud.

  2. Włącz interfejsy Google Chat API, Google Docs API, Admin SDK API i Vertex AI API za pomocą polecenia gcloud services enable:

    gcloud services enable chat.googleapis.com docs.googleapis.com admin.googleapis.com aiplatform.googleapis.com

Konfigurowanie uwierzytelniania i autoryzacji

Uwierzytelnianie i autoryzacja umożliwia aplikacji Google Chat dostęp do zasobów w Google Workspace i Google Cloud w celu przetworzenia odpowiedzi na incydent.

W tym samouczku publikujesz aplikację wewnętrznie, więc możesz użyć informacji zastępczych. Zanim opublikujesz aplikację na zewnątrz, zastąp informacje zastępcze na ekranie zgody prawdziwymi informacjami.

  1. W konsoli Google Cloud otwórz Menu  > > Identyfikacja marki.

    Przejdź do sekcji Promowanie marki

  2. Jeśli masz już skonfigurowaną aplikację, możesz skonfigurować te ustawienia ekranu zgody OAuth: Identyfikacja marki, Odbiorcy i Dostęp do danych. Jeśli zobaczysz komunikat jeszcze nie skonfigurowano, kliknij Rozpocznij:

    1. W sekcji Informacje o aplikacji w polu Nazwa aplikacji wpisz Incident Management.
    2. W polu Adres e-mail użytkownika wybierz swój adres e-mail lub odpowiednią grupę Google.
    3. Kliknij Dalej.
    4. W sekcji Odbiorcy wybierz Wewnętrzny. Jeśli nie możesz wybrać opcji Wewnętrzny, wybierz Zewnętrzny.
    5. Kliknij Dalej.
    6. W sekcji Dane kontaktowe wpisz adres e-mail, na który będą wysyłane powiadomienia o zmianach w projekcie.
    7. Kliknij Dalej.
    8. W sekcji Zakończ zapoznaj się z zasadami dotyczącymi danych użytkownika w usługach interfejsu API Google, a potem, jeśli się z nimi zgadzasz, kliknij Akceptuję zasady dotyczące danych użytkownika w usługach interfejsu API Google.
    9. Kliknij Dalej.
    10. Kliknij Utwórz.
    11. Jeśli jako typ użytkownika wybierzesz Zewnętrzny, dodaj użytkowników testowych:
      1. Kliknij Odbiorcy.
      2. W sekcji Użytkownicy testowi kliknij Dodaj użytkowników.
      3. Wpisz swój adres e-mail i adresy innych autoryzowanych użytkowników testowych, a następnie kliknij Zapisz.

  3. Kliknij Dostęp do danych > Dodaj lub usuń zakresy. Pojawi się panel z listą zakresów dostępu do każdego interfejsu API włączonego w projekcie Google Cloud.

    1. W sekcji Ręczne dodawanie zakresów wklej te zakresy:

      • 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. Kliknij Dodaj do tabeli.

    3. Kliknij Aktualizuj.

    4. Po wybraniu zakresów wymaganych przez aplikację na stronie Dostęp do danych kliknij Zapisz.

Tworzenie i wdrażanie aplikacji Google Chat

W następującej sekcji skopiujesz i zaktualizujesz cały projekt Apps Script, który zawiera cały wymagany kod aplikacji dla aplikacji czatu. Nie musisz więc kopiować i wklejać poszczególnych plików.

Niektóre funkcje zawierają podkreślenia na końcu nazwy, np. processSlashCommand_() zamiast ChatApp.gs. Podkreślenie ukrywa funkcję na stronie internetowej inicjowania incydentu, gdy jest ona otwarta w przeglądarce. Więcej informacji znajdziesz w artykule Funkcje prywatne.

Apps Script obsługuje 2 typy plików: .gsskrypty i .htmlpliki. Aby zapewnić zgodność z tymi wymaganiami, kod JavaScript po stronie klienta jest umieszczony w tagach <script />, a kod CSS – w tagach <style /> w pliku HTML.

Opcjonalnie możesz wyświetlić cały projekt na GitHubie.

Wyświetl w GitHubie

Oto krótkie omówienie każdego pliku:

Consts.gs

Określa stałe, do których odwołują się inne pliki kodu, w tym identyfikator projektu Cloud, identyfikator lokalizacji Vertex AI i identyfikator polecenia slash do zamykania incydentów.

Wyświetl kod Consts.gs

apps-script/incident-response/Consts.gs
const PROJECT_ID = 'replace-with-your-project-id';
const VERTEX_AI_LOCATION_ID = 'us-central1';
const CLOSE_INCIDENT_COMMAND_ID = 1;
ChatApp.gs

Obsługuje zdarzenia interakcji z czatem, w tym wiadomości, kliknięcia kart, polecenia i dialogi. Reaguje na znak ukośnika /closeIncident, otwierając okno, w którym można podać szczegóły rozwiązania problemu. Czyta wiadomości w pokoju, wywołując metodę spaces.messages.list w Google Chat API. Pobiera identyfikatory użytkowników za pomocą usługi Directory w pakiecie Admin SDK w Apps Script.

Wyświetl kod ChatApp.gs

apps-script/incident-response/ChatApp.gs
/**
 * 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

Odbiera dane z formularza, który użytkownicy wypełniają na stronie początkowej zgłoszenia incydentu, i wykorzystuje je do skonfigurowania pokoju Google Chat, tworząc go i uzupełniając, a następnie publikuje wiadomość dotyczącą incydentu.

Wyświetl kod ChatSpaceCreator.gs

apps-script/incident-response/ChatSpaceCreator.gs
/**
 * 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

Wywołuje interfejs Google Docs API, aby utworzyć dokument Dokumenty Google na Dysku Google użytkownika, i zapisuje w nim podsumowanie informacji o incydencie utworzonych w VertexAiApi.gs.

Wyświetl kod DocsApi.gs

apps-script/incident-response/DocsApi.gs
/**
 * 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

Podsumuje rozmowę w pokoju czatu za pomocą Vertex AI. Podsumowanie jest publikowane w specjalnie utworzonym dokumencie w DocsAPI.gs.

Wyświetl kod VertexAiApi.gs

apps-script/incident-response/VertexAiApi.gs
/**
 * 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

Udostępnia stronę internetową inicjowania incydentu.

Wyświetl kod WebController.gs

apps-script/incident-response/WebController.gs
/**
 * 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

Kod HTML strony inicjującej zdarzenie.

Wyświetl kod Index.html

apps-script/incident-response/Index.html
<!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

Obsługuje zachowanie formularza, w tym przesyłanie, błędy i czyszczenie, w przypadku witryny inicjującej zdarzenie. Jest ona uwzględniana w pliku Index.html przez niestandardową funkcję include w pliku WebController.gs.

Wyświetl kod JavaScript.html

apps-script/incident-response/JavaScript.html
<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

Kod CSS strony internetowej inicjującej zdarzenie. Jest ona uwzględniana w Index.html za pomocą niestandardowej funkcji include w WebController.gs.

Wyświetl kod Stylesheet.html

apps-script/incident-response/Stylesheet.html
<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>

Znajdowanie numeru i identyfikatora projektu Cloud

  1. W konsoli Google Cloud otwórz swój projekt Cloud.

    Otwórz konsolę Google Cloud

  2. Kliknij Ustawienia i narzędzia > Ustawienia projektu.

  3. Zapisz sobie wartości w polach Numer projektu i Identyfikator projektu. Użyjesz ich w następnych sekcjach.

Tworzenie projektu Apps Script

Aby utworzyć projekt Apps Script i połączyć go z projektem Cloud:

  1. Kliknij ten przycisk, aby otworzyć projekt Google Apps Script Odpowiedzi na incydenty w Google Chat.
    Otwórz projekt
  2. Kliknij Przegląd.
  3. Na stronie Przegląd kliknij Ikona kopiowania Utwórz kopię.

  4. Nadaj nazwę kopii projektu Apps Script:

    1. Kliknij Kopia odpowiedzi na incydenty w Google Chat.

    2. W polu Nazwa projektu wpisz Incident Management Chat app.

    3. Kliknij Zmień nazwę.

  5. W swojej kopii projektu Apps Script otwórz plik Consts.gs i zastąp YOUR_PROJECT_ID identyfikatorem swojego projektu Cloud.

Ustawianie projektu Google Cloud w projekcie Apps Script

  1. W projekcie Apps Script kliknij Ikona ustawień projektu Ustawienia projektu.
  2. W sekcji Projekt Google Cloud Platform (GCP) kliknij Zmień projekt.
  3. W polu Numer projektu GCP wklej numer swojego projektu Cloud.
  4. Kliknij Ustaw projekt. Projekt w chmurze i projekt Apps Script są teraz połączone.

Tworzenie wdrożenia Apps Script

Po umieszczeniu całego kodu w odpowiednim miejscu wdruż projekt Apps Script. Używasz go podczas konfigurowania aplikacji Google Chat w Google Cloud.

  1. W Google Apps Script otwórz projekt aplikacji do reagowania na incydenty.

    Otwórz Apps Script

  2. Kliknij Wdróż > Nowe wdrożenie.

  3. Jeśli Dodatki i Aplikacje internetowe nie są jeszcze zaznaczone, obok Wybierz typ kliknij typ wdrożenia Ikona ustawień projektu i wybierz Dodatki i Aplikacje internetowe.

  4. W polu Opis wpisz opis tej wersji, na przykład Complete version of incident management app.

  5. W sekcji Wykonaj jako wybierz Użytkownik korzystający z aplikacji internetowej.

  6. W sekcji Kto ma dostęp wybierz Każdy w organizacji Workspace, gdzie „Twoja organizacja Workspace” to nazwa Twojej organizacji Google Workspace.

  7. Kliknij Wdróż. Apps Script zgłasza pomyślne wdrożenie i udostępnia identyfikator wdrożenia oraz adres URL strony internetowej z inicjalizacją incydentu.

  8. Zanotuj adres URL aplikacji internetowej, aby odwiedzić ją później, gdy uruchomisz zgłoszenie. Skopiuj identyfikator wdrożenia. Używasz tego identyfikatora podczas konfigurowania aplikacji Google Chat w konsoli Google Cloud.

  9. Kliknij Gotowe.

Konfigurowanie aplikacji Google Chat w konsoli Google Cloud

W tej sekcji dowiesz się, jak skonfigurować interfejs Google Chat API w konsoli Google Cloud, podając informacje o aplikacji Google Chat, w tym identyfikator wdrożenia utworzonego w projekcie Apps Script.

  1. W konsoli Google Cloud kliknij Menu > Więcej usług > Google Workspace > Biblioteka usług > Interfejs API Google Chat > Zarządzaj > Konfiguracja.

    Otwórz konfigurację interfejsu Chat API

  2. W polu Nazwa aplikacji wpisz Incident Management.

  3. W polu URL awatara wpisz https://developers.google.com/chat/images/quickstart-app-avatar.png.

  4. W polu Opis wpisz Responds to incidents..

  5. Kliknij przełącznik Włącz funkcje interaktywne, aby go włączyć.

  6. W sekcji Funkcje wybierz Odbieranie wiadomości 1:1 i Dołączanie do pokoi i rozmów grupowych.

  7. W sekcji Ustawienia połączenia kliknij Apps Script.

  8. W polu Identyfikator wdrożenia wklej identyfikator wdrożenia Apps Script skopiowany wcześniej z wdrożenia projektu Apps Script.

  9. Zarejestruj polecenie po ukośniku, którego używa prawidłowo wdrożona aplikacja Google Chat:

    1. W sekcji Polecenia po ukośniku kliknij Dodaj polecenie po ukośniku.

    2. W polu Nazwa wpisz /closeIncident.

    3. W polu Identyfikator polecenia wpisz 1.

    4. W polu Opis wpisz:Closes the incident being discussed in the space.

    5. Kliknij Otwiera okno.

    6. Kliknij Gotowe. Polecenie po ukośniku jest zarejestrowane i wyświetlane na liście.

  10. W sekcji Widoczność wybierz Udostępnij tę aplikację do obsługi czatu konkretnym osobom i grupom w domenie Google Workspace i wpisz swój adres e-mail.

  11. W sekcji Logi wybierz Loguj błędy w usłudze Logging.

  12. Kliknij Zapisz. Pojawi się wiadomość o zapisanej konfiguracji, co oznacza, że aplikacja jest gotowa do testowania.

Testowanie aplikacji Google Chat

Aby przetestować aplikację Google Chat do zarządzania incydentami, utwórz incydent na stronie internetowej i sprawdź, czy aplikacja Google Chat działa zgodnie z oczekiwaniami:

  1. Otwórz URL aplikacji internetowej wdrożenia Apps Script.

  2. Gdy Apps Script poprosi o dostęp do Twoich danych, kliknij Sprawdź uprawnienia, zaloguj się na odpowiednie konto Google w domenie Google Workspace i kliknij Zezwól.

  3. Otworzy się strona internetowa inicjowania incydentu. Wpisz informacje o teście:

    1. W polu Tytuł incydentu wpisz The First Incident.
    2. Opcjonalnie w sekcji Osoby reagujące na incydenty wpisz adresy e-mail osób, które będą reagować na incydenty. Muszą to być użytkownicy z kontem Google Chat w organizacji Google Workspace, w przeciwnym razie utworzenie pokoju się nie uda. Nie wpisuj swojego adresu e-mail, ponieważ jest on dodawany automatycznie.
    3. W polu Pierwsza wiadomość wpisz Testing the incident management Chat app..

  4. Kliknij Utwórz pokój na czacie. Pojawi się komunikat creating space.

  5. Po utworzeniu pokoju pojawi się komunikat Space created!. Kliknij Otwórz pokój, aby otworzyć pokój w Google Chat w nowej karcie.

  6. Opcjonalnie Ty i inni uczestnicy mogą wysyłać wiadomości w pokoju. Aplikacja podsumowuje te wiadomości za pomocą Vertex AI i udostępnia dokument retrospektywny.

  7. Aby zakończyć proces reagowania na incydent i rozpocząć proces rozwiązywania problemu, w pokoju czatu wpisz /closeIncident. Otworzy się okno zarządzania incydentem.

  8. W polu Zamknij incydent wpisz opis rozwiązania incydentu, na przykład Test complete.

  9. Kliknij Zamknij zgłoszenie.

Aplikacja do zarządzania incydentami wyświetla listę wiadomości w pokoju, podsumowuje je za pomocą Vertex AI, wkleja podsumowanie w dokumencie Dokumenty Google i udostępnia dokument w pokoju.

Czyszczenie danych

Aby uniknąć obciążenia konta Google Cloud opłatami za zasoby zużyte w tym samouczku, zalecamy usunięcie projektu Google Cloud.

  1. W konsoli Google Cloud otwórz stronę Zarządzanie zasobami. Kliknij Menu > Administracja > Zarządzaj zasobami.

    Otwórz Menedżera zasobów

  2. Na liście projektów wybierz projekt, który chcesz usunąć, a potem kliknij Usuń .
  3. W oknie wpisz identyfikator projektu i kliknij Wyłącz, aby usunąć projekt.