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

W tym samouczku pokazujemy, jak utworzyć aplikację Google Chat, która reaguje na incydenty w czasie rzeczywistym. Reagując na incydenty, aplikacja tworzy i wypełnia pokój czatu, ułatwia rozwiązywanie incydentów za pomocą komunikatów, poleceń i okna po ukośniku oraz wykorzystuje AI do podsumowania odpowiedzi na incydent w dokumencie Dokumentów Google.

Incydent to zdarzenie, które wymaga natychmiastowej interwencji zespołu osób. Przykłady incydentów:

• W systemie zarządzania relacjami z klientami (CRM) tworzona jest wielkość liter, która wymaga czasu. Zespół usługi będzie współpracować nad rozwiązaniem.
• System przechodzi w tryb offline, co informuje grupę inżynierów SRE, którzy mogą współpracować nad przywróceniem go do trybu online.
• Występuje trzęsienie ziemi o dużej sile i pracownicy służb ratunkowych muszą skoordynować swoją reakcję.

Na potrzeby tego samouczka alert o incydentie uruchamia się, gdy ktoś zgłosi incydent kliknięciem 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 służb ratowniczych.

Zobacz, jak działa aplikacja Google Chat do zarządzania incydentami:

Wymagania wstępne

Jeśli musisz włączyć w organizacji któreś z tych wymagań wstępnych, poproś administratora Google Workspace o włączenie tych wymagań:

• konto Google Workspace z dostępem do Google Chat.
• włączyć Katalog (udostępnianie kontaktów) w Google Workspace. Aplikacja incydentu używa katalogu do wyszukiwania danych kontaktowych służb ratowniczych, takich jak imię i nazwisko oraz adres e-mail. Osoby reagujące na incydenty muszą być użytkownikami konta Google Chat w Twojej organizacji korzystającej z Google Workspace.

Cele

• Utwórz aplikację Google Chat, która reaguje na incydenty.
• Pomóż użytkownikom reagować na incydenty, wykonując te czynności:
  • Tworzenie pokoi reakcji na incydenty.
  • Publikowanie wiadomości podsumowujących incydenty i odpowiedzi.
  • Wspomaganie współpracy dzięki interaktywnym funkcjom aplikacji Google Chat.
• Podsumuj rozmowy i rozwiązania za pomocą Vertex AI.

Architektura

Poniższy diagram przedstawia architekturę zasobów Google Workspace i zasobów Google Cloud używanych przez aplikację Google Chat do reagowania na incydenty.

Architektura pokazuje, jak aplikacja Google Chat przetwarza incydent i rozwiązuje ten problem.

1. Użytkownik rozpoczyna incydent w zewnętrznej witrynie hostowanej w Apps Script.

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

3. Odpowiedź na incydent w aplikacji Google Chat przetwarza żądanie:

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

   2. Przy użyciu zestawu żądań HTTP wysyłanych do interfejsu Chat API za pomocą zaawansowanej usługi czatu w Apps Script odpowiedź na incydenty Aplikacja Google Chat tworzy incydentowy pokój czatu, wypełnia go członkami zespołu i wysyła do niego wiadomość.

4. Członkowie zespołu omawiają incydent w pokoju czatu.

5. Członek zespołu wywołuje polecenie po ukośniku, aby zasygnalizować rozwiązanie incydentu.

   1. Wywołanie HTTP do interfejsu Chat API przy użyciu Apps Script Usługa zaawansowanego czatu wyświetla wszystkie wiadomości w pokoju czatu.

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

   3. Usługa Apps Script DocumentApp tworzy dokument w Dokumentach i dodaje do niego podsumowanie Vertex AI.

   4. Odpowiedź na incydent w aplikacji Google Chat wywołuje interfejs Chat API, aby wysłać wiadomość z linkiem do dokumentu z podsumowaniem.

Przygotowywanie środowiska

W tej sekcji dowiesz się, jak utworzyć i skonfigurować projekt Google Cloud na potrzeby aplikacji Google Chat.

Tworzenie projektu Google Cloud

Konsola Google Cloud

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

   Otwórz stronę Utwórz projekt

2. W polu Nazwa projektu wpisz opisową nazwę projektu.

   Opcjonalnie: aby edytować identyfikator projektu, kliknij Edytuj. Po utworzeniu projektu nie można zmienić identyfikatora, więc wybierz taki, który spełnia Twoje potrzeby przez cały okres istnienia projektu.

3. W polu Lokalizacja kliknij Przeglądaj, aby wyświetlić potencjalne lokalizacje swojego projektu. Następnie kliknij Wybierz.
4. Kliknij Utwórz. W konsoli Google Cloud otworzy się strona panelu, a w ciągu kilku minut zostanie utworzony projekt.

interfejs wiersza poleceń gcloud

Uzyskaj dostęp do interfejsu wiersza poleceń Google Cloud („gcloud”) w jednym z tych środowisk programistycznych:

• Cloud Shell: aby używać terminala online ze skonfigurowanym już interfejsem wiersza poleceń gcloud, aktywuj Cloud Shell.
  Aktywuj Cloud Shell
• Local Shell (Powłoka lokalna): aby używać lokalnego środowiska programistycznego, zainstaluj i initialize interfejs wiersza poleceń gcloud.
  Aby utworzyć projekt Cloud, użyj polecenia `gcloud projects create`:

  gcloud projects create PROJECT_ID

  Zastąp PROJECT_ID, ustawiając identyfikator projektu, który chcesz utworzyć.

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

Konsola Google Cloud

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

   Otwórz stronę Płatności w moich projektach

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

interfejs wiersza poleceń gcloud

1. Aby wyświetlić listę dostępnych kont rozliczeniowych, uruchom polecenie:

   gcloud billing accounts list

2. Połącz 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 ma zostać połączone z projektem Google Cloud.

Włącz interfejsy API

Konfigurowanie uwierzytelniania i autoryzacji

Uwierzytelnianie i autoryzacja zapewnia 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, aby można było używać informacji zastępczych. Zanim opublikujesz aplikację na zewnątrz, zastąp informacje zastępcze rzeczywistymi informacjami wyświetlanymi na ekranie zgody.

1. W konsoli Google Cloud kliknij Menu menu > Interfejsy API i usługi > Ekran akceptacji OAuth.

   Otwórz ekran zgody OAuth

2. W sekcji Typ użytkownika wybierz Wewnętrzny i kliknij Utwórz.

3. W polu Nazwa aplikacji wpisz Incident Management.

4. W sekcji Adres e-mail pomocy technicznej dla użytkowników wybierz swój adres e-mail lub odpowiednią grupę dyskusyjną Google.

5. W sekcji Informacje kontaktowe dewelopera wpisz swój adres e-mail.

6. Kliknij Save and Continue.

7. Kliknij Dodaj lub usuń zakresy. Pojawi się panel z listą zakresów dla każdego interfejsu API włączonego w projekcie Cloud.

8. W sekcji Dodaj zakresy ręcznie 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

9. Kliknij Dodaj do tabeli.

10. Kliknij Aktualizuj.

11. Kliknij Save and Continue.

12. Przejrzyj podsumowanie rejestracji aplikacji i kliknij Powrót do panelu.

Tworzenie i wdrażanie aplikacji Google Chat

W kolejnej sekcji skopiujesz i zaktualizujesz cały projekt Apps Script, który zawiera cały kod wymagany do aplikacji do obsługi czatu. Nie musisz więc kopiować i wklejać każdego pliku.

Niektóre funkcje mają na końcu nazwy podkreślenia, np. processSlashCommand_() w polu 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: skrypty .gs i pliki .html. Aby zapewnić zgodność z tą obsługą, kod JavaScript po stronie klienta jest zawarty w tagach <script />, a kod CSS jest zawarty w tagach <style /> w pliku HTML.

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

Wyświetl w GitHubie

Poniżej znajdziesz omówienie każdego pliku:

Consts.gs

Definiuje stałe, do których odwołują się inne pliki kodu, w tym identyfikator projektu Cloud, identyfikator lokalizacji Vertex AI oraz identyfikator polecenia po ukośniku służący do zamknięcia incydentu.

Wyświetl kod Consts.gs

apps-script/incident-response/Consts.gs

Wyświetl w GitHubie

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 Google Chat, w tym wiadomości, kliknięcia kart, polecenia po ukośniku i okna. Odpowiada na polecenie po ukośniku /closeIncident, otwierając okno, aby zebrać szczegóły dotyczące rozwiązywania incydentów. Odczyt wiadomości w pokoju przez wywołanie metody spaces.messages.list w interfejsie Chat API. Pobiera identyfikatory użytkowników za pomocą usługi katalogowej pakietu Admin SDK w Apps Script.

Wyświetl kod ChatApp.gs

apps-script/incident-response/ChatApp.gs

Wyświetl w GitHubie

/**
 * 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

Otrzymuje dane z formularza wpisywane przez użytkowników na stronie internetowej służącej do inicjowania incydentu, a następnie używa ich do konfigurowania pokoju czatu przez utworzenie i wypełnienie go, a następnie publikuje komunikat o incydencie.

Wyświetl kod ChatSpaceCreator.gs

apps-script/incident-response/ChatSpaceCreator.gs

Wyświetl w GitHubie

/**
 * 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 Dokumenty API w celu utworzenia dokumentu na Dysku Google użytkownika i zapisuje w dokumencie podsumowanie informacji o incydencie, które zostały utworzone w VertexAiApi.gs.

Wyświetl kod DocsApi.gs

apps-script/incident-response/DocsApi.gs

Wyświetl w GitHubie

/**
 * 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

podsumowuje rozmowę w pokoju Google Chat za pomocą Vertex AI; Podsumowanie zostanie opublikowane w specjalnie utworzonym dokumencie w usłudze DocsAPI.gs.

Wyświetl kod VertexAiApi.gs

apps-script/incident-response/VertexAiApi.gs

Wyświetl w GitHubie

/**
 * 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

Obsługuje witrynę inicjowania incydentu.

Wyświetl kod WebController.gs

apps-script/incident-response/WebController.gs

Wyświetl w GitHubie

/**
 * 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 zawierający witrynę inicjowania incydentu.

Wyświetl kod Index.html

apps-script/incident-response/Index.html

Wyświetl w GitHubie

<!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ługa zachowania formularza w witrynie inicjowania incydentu, w tym przesyłanie, błędy i usuwanie danych. Uwzględniono go w polu Index.html przez niestandardową funkcję include w komponencie WebController.gs.

Wyświetl kod JavaScript.html

apps-script/incident-response/JavaScript.html

Wyświetl w GitHubie

<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 witryny inicjowania incydentu. Jest on uwzględniany w elemencie Index.html przez niestandardową funkcję include w komponencie WebController.gs.

Wyświetl kod Stylesheet.html

apps-script/incident-response/Stylesheet.html

Wyświetl w GitHubie

<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 more_vert > Ustawienia projektu.

3. Zapisz wartości w polach Numer projektu i Identyfikator projektu. Będziesz ich używać w kolejnych sekcjach.

Tworzenie projektu Apps Script

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

1. Kliknij przycisk poniżej, aby otworzyć projekt Apps Script Odpowiadanie na incydenty przy użyciu Google Chat.
   Otwórz projekt
2. Kliknij info_outline Przegląd.
3. Na stronie przeglądu kliknij Utwórz kopię.

4. Nazwij swoją kopię projektu Apps Script:

   1. Kliknij Kopia odpowiedzi na incydenty w Google Chat.

   2. W polu Tytuł 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 Cloud dla projektu Apps Script

1. W projekcie Apps Script kliknij Ustawienia projektu.
2. W sekcji Projekt Google Cloud Platform (GCP) kliknij Zmień projekt.
3. W polu Numer projektu GCP wklej numer projektu Cloud.
4. Kliknij Ustaw projekt. Projekt Cloud i projekt Apps Script zostały połączone.

Tworzenie wdrożenia Apps Script

Teraz, gdy cały kod jest gotowy, wdróż projekt Apps Script. Identyfikatora wdrożenia użyjesz podczas konfigurowania aplikacji Google Chat w Google Cloud.

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

   Otwórz Apps Script

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

3. Jeśli opcje Dodatek i Aplikacja internetowa nie są jeszcze wybrane, obok opcji Wybierz typ kliknij typy wdrożeń , a następnie wybierz Dodatek i Aplikacja internetowa.

4. W polu Opis wpisz opis tej wersji, np. Complete version of incident management app.

5. W sekcji Wykonaj jako wybierz Użytkownik uzyskujący dostęp do aplikacji internetowej.

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

7. Kliknij Wdróż. Apps Script informuje o udanym wdrożeniu i udostępnia identyfikator wdrożenia oraz adres URL strony internetowej inicjowania incydentu.

8. Zapisz adres URL aplikacji internetowej, aby móc go otworzyć później po rozpoczęciu incydentu. Skopiuj wartość pola Deployment ID (Identyfikator wdrożenia). Tego identyfikatora używasz do 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 przy użyciu informacji o aplikacji do obsługi czatu, w tym identyfikatora wdrożenia utworzonego przed chwilą z projektu Apps Script.

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

   Otwórz stronę konfiguracji 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 ustawić go w pozycji włączenia.

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

7. W sekcji Ustawienia połączenia wybierz Projekt 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 w pełni zaimplementowana 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. Wybierz Otwiera okno.

   6. Kliknij Gotowe. Polecenie po ukośniku jest rejestrowane i wyświetlane.

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

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

12. Kliknij Zapisz. Pojawi się komunikat o zapisanej konfiguracji, który oznacza, że aplikacja jest gotowa do testowania.

Testowanie aplikacji Google Chat

Aby przetestować aplikację do zarządzania incydentami, zainicjuj incydent na stronie internetowej i sprawdź, czy działa ona zgodnie z oczekiwaniami:

1. Otwórz adres 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 swojej domenie Google Workspace i kliknij Zezwól.

3. Otworzy się strona internetowa inicjowania incydentu. Wprowadź informacje dotyczące testu:

   1. W polu Tytuł incydentu wpisz The First Incident.
   2. Opcjonalnie w polu Osoby reagujące na incydenty wpisz adresy e-mail innych osób walczących z incydentami. Muszą to być użytkownicy z kontem Google Chat w organizacji Google Workspace. W przeciwnym razie nie uda się utworzyć pokoju. Nie wpisuj swojego adresu e-mail, ponieważ jest on uwzględniany automatycznie.
   3. W polu Wstępna wiadomość wpisz Testing the incident management Chat app.

4. Kliknij Utwórz pokój czatu. 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 inne osoby, które reagują na incydenty, możecie wysyłać wiadomości w tym pokoju. Aplikacja podsumowuje te wiadomości za pomocą Vertex AI i udostępnia archiwalny dokument.

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

8. W polu Zamknij incydent wpisz opis rozwiązania incydentu, np. Test complete.

9. Kliknij Zamknij incydent.

Aplikacja do zarządzania incydentami wyświetla listę wiadomości w pokoju, podsumowuje je za pomocą Vertex AI, wkleja podsumowanie w dokumencie Dokumentów 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 Cloud.

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

   Otwórz menedżera zasobów

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

Powiązane artykuły

• Odpowiadanie na pytania na podstawie rozmów z Google Chat w aplikacji Gemini AI Chat
• Zarządzanie projektami za pomocą Google Chat, Vertex AI i Firestore
• Aplikacja do reagowania na incydenty uwierzytelnia się za pomocą danych logowania użytkownika, aby wywoływać interfejsy API i usługi Google Cloud, takie jak Chat API i Vertex AI API. Oznacza to, że użytkownik inicjujący incydent musi mieć dostęp do tych usług. Aby aplikacja była bardziej niezawodna, rozważ wywołanie interfejsu Vertex AI API jako konta usługi zamiast danych logowania użytkownika wywołujących polecenie /closeIncident po ukośniku. Jeśli potrzebujesz pomocy w konfigurowaniu konta usługi na potrzeby interfejsu Vertex AI API, przeczytaj artykuł Używanie niestandardowego konta usługi.