Se usó la API de Cloud Translation para traducir esta página.

Responda a incidentes con Google Chat, Vertex AI y Apps Script

En este instructivo, se muestra cómo crear una app de Google Chat que responde a incidentes en tiempo real. Cuando responde a un incidente, la app crea y propaga un espacio de Chat, facilita la resolución con mensajes, comandos de barra y diálogos, y usa la IA para resumir la respuesta ante incidentes en un documento de Google.

Un incidente es un evento que requiere la atención inmediata de un equipo de personas por resolver. Estos son algunos ejemplos de incidentes:

Se crea un caso con plazos definidos en una administración de relaciones con clientes (CRM) y requiere que un equipo de servicio colabore en una resolución.
Un sistema se desconecta y alerta a un grupo de ingenieros de confiabilidad de sitios (SRE) para que puedan trabajar juntos y volver a tenerlo en línea.
Se produce un terremoto de gran magnitud y los trabajadores de emergencia necesitan coordinar su respuesta.

A los efectos de este instructivo, la alerta de incidente comienza cuando alguien informa el incidente con un clic en un botón de una página web. La página web simula un incidente pidiéndole a los usuarios que ingresen información básica: título, y las direcciones de correo electrónico de las personas que responden.

Observa cómo funciona la app de Chat de administración de incidentes:

Figura 1: El sitio web donde se puede informar un incidente.
Figura 2: Notificación que indica que se creó el espacio de Chat del incidente
Figura 3: El espacio de Chat de respuesta ante incidentes
Figura 4: Resolver el incidente con un comando de barra
Figura 5: Diálogo de resolución de incidentes.
Figura 6: Documento de Documentos de Google compartido en el espacio de resolución de incidentes
Figura 7: El documento de Documentos de Google sobre la resolución de incidentes de resumen de IA

Requisitos previos

Si necesitas activar alguno de estos requisitos previos para tu organización, pregunta tu administrador de Google Workspace para activarlos:

Una empresa o empresa de Google Workspace con acceso a Google Chat.
Para tener Directorio (uso compartido de los contactos) activado para Google Workspace. La app del incidente usa el directorio para buscar las ubicaciones de las respuestas información de contacto, como el nombre y la dirección de correo electrónico. Las personas que responden ante incidentes deben ser usuarios con una cuenta de Google Chat de tu organización de Google Workspace.

Objetivos

Compilarás una app de Chat que responda a los incidentes.
Ayuda a los usuarios a responder ante los incidentes de la siguiente manera:
- Crear espacios de respuesta ante incidentes
- Publicar mensajes que resuman los incidentes y las respuestas.
- Respaldo la colaboración con de la app de Chat.
Resume conversaciones y resoluciones con Vertex AI.

Arquitectura

En el siguiente diagrama, se muestra la arquitectura de Google Workspace y Recursos de Google Cloud usados por la respuesta ante incidentes App de Google Chat

Arquitectura de la app de Google Chat de respuesta ante incidentes

La arquitectura muestra cómo la respuesta ante incidentes La app de Google Chat procesa un incidente y su resolución.

Un usuario inicia un incidente desde un sitio web externo alojado en Apps Script
El sitio web envía una solicitud HTTP asíncrona al App de Google Chat, también alojada en Apps Script
La app de Google Chat de respuesta ante incidentes procesa la solicitud:
1. El servicio del SDK de Admin de Apps Script obtiene un miembro del equipo información, como el ID de usuario y la dirección de correo electrónico.
2. Con un conjunto de solicitudes HTTP a la API de Chat con el el servicio de chat avanzado de Apps Script, la respuesta ante incidentes La app de Google Chat crea un Chat de incidentes espacio, lo completa con miembros del equipo y envía un mensaje al espacio.
Los miembros del equipo analizan el incidente en el espacio de Chat.
Un miembro del equipo invoca un comando de barra para indicar una resolución al el incidente.
1. Una llamada HTTP a la API de Chat mediante Apps Script El servicio de Chat avanzado muestra todas las los mensajes de tu espacio.
2. Vertex AI recibe los mensajes enumerados y genera un resumen.
3. El servicio DocumentApp de Apps Script crea una de Documentos de Google y se agrega el resumen de Vertex AI al .
4. Las llamadas de la app de Google Chat de respuesta ante incidentes API de Chat para enviar un mensaje con un vínculo al resumen Documento de Documentos.

Prepare el entorno

En esta sección, se muestra cómo crear y configurar un proyecto de Google Cloud para la App de Chat

Crea un proyecto de Google Cloud

Consola de Google Cloud

En la consola de Google Cloud, ve a Menú > IAM y Administrador > Crear un proyecto.
Ir a Crear un proyecto
En el campo Nombre del proyecto, ingresa un nombre descriptivo para tu proyecto.
Opcional: Para editar el ID del proyecto, haz clic en Editar. No se puede cambiar el ID del proyecto una vez creado el proyecto, así que elige un ID que se adapte a tus necesidades durante el ciclo de vida del en un proyecto final.
En el campo Ubicación, haz clic en Explorar para mostrar las posibles ubicaciones de tu en un proyecto final. Luego, haga clic en Seleccionar.
Precaución: ¿No encuentras tu organización de Google Workspace?
Esto significa que no accediste a una cuenta de Google Workspace. Algunas funciones que se describen en la documentación para desarrolladores de Google Workspace solo están disponibles para los proyectos asociada con una organización.
Haz clic en Crear. La consola de Google Cloud navega a la página Panel y se crea tu proyecto en unos minutos.

gcloud CLI

En uno de los siguientes entornos de desarrollo, accede a la API de CLI (`gcloud`):

Cloud Shell: Para usar una terminal en línea con gcloud CLI ya configurado, activa Cloud Shell.
Activar Cloud Shell
Local Shell: Para usar un entorno de desarrollo local, instalar y inicializar con gcloud CLI.
Para crear un proyecto de Cloud, usa el comando “gcloud projects create”:
```
gcloud projects create PROJECT_ID
```
Reemplaza PROJECT_ID mediante la configuración del ID del proyecto que deseas crear.

Habilita la facturación para el proyecto de Cloud

Consola de Google Cloud

En la consola de Google Cloud, ve a Facturación. Haz clic en Menú > Facturación > Mis proyectos.
Ir a Facturación para Mis proyectos
En Selecciona una organización, elige la organización asociada con tu proyecto de Google Cloud.
En la fila del proyecto, abre el menú Acciones. (), haz clic en Cambiar facturación y elige Cuenta de Facturación de Cloud.
Haz clic en Establecer cuenta.

gcloud CLI

Para enumerar las cuentas de facturación disponibles, ejecuta el siguiente comando:
```
gcloud billing accounts list
```
Vincula una cuenta de facturación con un proyecto de Google Cloud:
```
gcloud billing projects link PROJECT_ID --billing-account=BILLING_ACCOUNT_ID
```
Reemplaza lo siguiente:
- PROJECT_ID es el ID del proyecto de la Proyecto de Cloud para el que quieres habilitar la facturación.
- BILLING_ACCOUNT_ID es el ID de la cuenta de facturación que se vinculará el proyecto de Google Cloud.

Habilitación de las API

Consola de Google Cloud

En la consola de Google Cloud, habilita la API de Google Chat, la API de Documentos de Google, la API del SDK de Admin y la API de Vertex AI.

Habilitar las API
Confirma que estás habilitando las APIs en la ubicación correcta de Google Cloud y haz clic en Siguiente.
Confirma que estás habilitando las APIs correctas y, luego, haz clic en Habilitar.

gcloud CLI

Si es necesario, configura el proyecto de Cloud actual con el que creaste con el comando gcloud config set project:
```
gcloud config set project PROJECT_ID
```
Reemplaza PROJECT_ID por el ID del proyecto de de Google Cloud que creaste.
Habilitar la API de Google Chat, la API de Documentos de Google, la API del SDK de Admin y la API de Vertex AI con el comando gcloud services enable:
```
gcloud services enable chat.googleapis.com docs.googleapis.com admin.googleapis.com aiplatform.googleapis.com
```

Configura la autenticación y la autorización

La autenticación y la autorización permiten Los recursos de acceso a las apps de Chat en Google Workspace y Google Cloud para procesar una respuesta ante incidentes.

En este instructivo, publicarás la app de forma interna, por lo que está bien usar el marcador de posición información. Antes de publicar la app de forma externa, reemplaza el marcador de posición. información real con información real para la pantalla de consentimiento.

En la consola de Google Cloud, ve a Menú > APIs y Servicios > Pantalla de consentimiento de OAuth.

Ir a la pantalla de consentimiento de OAuth
En Tipo de usuario, selecciona Interno y, luego, haz clic en Crear.
En Nombre de la app, escribe Incident Management.
En Correo electrónico de asistencia del usuario, selecciona tu dirección de correo electrónico o una Grupo de Google
En Información de contacto del desarrollador, ingresa tu dirección de correo electrónico.
Haga clic en Guardar y continuar.
Haz clic en Add or Remove Scopes. Aparecerá un panel con una lista de alcances para cada API que hayas habilitado en tu proyecto de Cloud.
En Agregar permisos de forma manual, pega los siguientes alcances:
- 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
Haz clic en Add to Table.
Haz clic en Actualizar.
Haga clic en Guardar y continuar.
Revisa el resumen del registro de apps y, luego, haz clic en Volver al panel.

Crea e implementa la app de Chat

En la siguiente sección, copiarás y actualizarás un Proyecto de Apps Script que contiene toda la aplicación necesaria de Google Chat para tu app de Chat, de modo que no es necesario copiar y pegar cada archivo.

Algunas funciones incluyen guiones bajos al final de los nombres, como processSlashCommand_() de ChatApp.gs. El guion bajo oculta la función. desde la página web de inicialización del incidente cuando se abre en un navegador. Para ver más información, consulta Funciones privadas.

Apps Script admite dos tipos de archivos: secuencias de comandos de .gs y .html archivos. Para cumplir con esta compatibilidad, se incluye el código JavaScript del cliente de la app. dentro de etiquetas <script /> y su CSS se incluye dentro de etiquetas <style /> dentro un archivo HTML.

De manera opcional, puedes ver el proyecto completo en GitHub.

Ver en GitHub

A continuación, se incluye una descripción general de cada archivo:

Consts.gs

Define las constantes a las que hacen referencia otros archivos de código. incluido el ID del proyecto de Cloud, el ID de ubicación de Vertex AI y el ID de comando de barra para cerrar un incidente.

Ver código de `Consts.gs`

apps-script/incident-response/Consts.gs

Ver en GitHub

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

ChatApp.gs

Controla los eventos de interacción de Chat, como los siguientes: clics de tarjetas, comandos de barra y diálogos. Responde a las Comando de barra /closeIncident abriendo un diálogo para recopilar incidentes los detalles de la resolución. Leer los mensajes en el espacio llamando al spaces.messages.list en la API de Chat Obtiene los IDs de usuario con el servicio de Directory del SDK de Admin en Apps Script

Ver código de `ChatApp.gs`

apps-script/incident-response/ChatApp.gs

Ver en GitHub

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

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

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

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

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

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

ChatSpaceCreator.gs

Recibir los datos del formulario que los usuarios ingresan en el incidente página web de inicialización y la usa para configurar una conversación espacio creando y propagándolo, y luego publica un mensaje sobre el el incidente.

Ver código de `ChatSpaceCreator.gs`

apps-script/incident-response/ChatSpaceCreator.gs

Ver en GitHub

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

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

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

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

DocsApi.gs

Llama a la API de Documentos de Google para crear un documento de Documentos de Google en una de Google Drive del usuario y escribe un resumen de la información del incidente creada en VertexAiApi.gs, en el documento.

Ver código de `DocsApi.gs`

apps-script/incident-response/DocsApi.gs

Ver en 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

Resume la conversación en el chat. con Vertex AI. Este resumen está publicado en una plataforma documento en DocsAPI.gs.

Ver código de `VertexAiApi.gs`

apps-script/incident-response/VertexAiApi.gs

Ver en GitHub

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

WebController.gs

Entrega el sitio web de inicialización de incidentes.

Ver código de `WebController.gs`

apps-script/incident-response/WebController.gs

Ver en 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

El HTML que comprende el sitio web de inicialización del incidente

Ver código de `Index.html`

apps-script/incident-response/Index.html

Ver en 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

Controla el comportamiento de los formularios, incluidos los envíos, y borra los errores del sitio web de inicialización del incidente. Está incluido en Index.html con la función include personalizada en WebController.gs.

Ver código de `JavaScript.html`

apps-script/incident-response/JavaScript.html

Ver en GitHub

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

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

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

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

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

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

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

Stylesheet.html

El CSS para el sitio web de inicialización del incidente. Es incluidos en Index.html por la función include personalizada en WebController.gs

Ver código de `Stylesheet.html`

apps-script/incident-response/Stylesheet.html

Ver en 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>

Busca el número y el ID de tu proyecto de Cloud

En la consola de Google Cloud, ve a tu proyecto de Cloud.

Ir a la consola de Google Cloud
Haz clic en Configuración y utilidades > Configuración del proyecto.
Anota los valores en los campos Project number y Project ID. Tú las usarás en las siguientes secciones.

Crea el proyecto de Apps Script

Para crear un proyecto de Apps Script y conectarlo a tu Proyecto de Cloud:

Haz clic en el siguiente botón para abrir el proyecto de Apps Script Responde a incidentes con Google Chat.
Abrir el proyecto
Haz clic en Descripción general.
En la página de descripción general, haz clic en Crear una copia.
Asigna un nombre a la copia del proyecto Apps Script:
1. Haz clic en Copia de Responder a incidentes con Google Chat.
2. En Título del proyecto, escribe Incident Management Chat app.
3. Haga clic en Cambiar nombre.
En tu copia del proyecto de Apps Script, ve a Consts.gs. y reemplaza YOUR_PROJECT_ID por el ID de tu Cloud.

Configura el proyecto de Cloud del proyecto de Apps Script

En tu proyecto de Apps Script, Haz clic en Project Settings.
En Proyecto de Google Cloud Platform (GCP), haz clic en Cambiar proyecto.
En Número de proyecto de GCP, pega el número de tu proyecto de Cloud.
Haz clic en Establecer el proyecto. El proyecto de Cloud y Apps Script proyecto ya están conectados.

Crea una implementación de Apps Script

Ahora que está listo todo el código, implementa Apps Script en un proyecto final. El ID de implementación se usa para configurar App de Chat en Google Cloud.

En Apps Script, abre el proyecto de la app de respuesta ante incidentes.

Ir a Apps Script
Haz clic en Implementar > Implementación nueva.
Si las opciones Complemento y Aplicación web no están seleccionadas, junto a Selecciona el tipo, haz clic en los tipos de implementación y selecciona Complemento y Aplicación web.
En Descripción, ingresa una descripción para esta versión, como Complete version of incident management app
En Ejecutar como, selecciona Usuario que accede a la aplicación web.
En Usuarios con acceso, selecciona Cualquier miembro de tu organización de Workspace. en los que “tu organización de Workspace” es el nombre de tu organización de Google Workspace.
Haz clic en Implementar. Se realizaron correctamente los informes de Apps Script Deployment y proporciona un ID de implementación y una URL para el incidente página web de inicialización.
Toma nota de la URL de la aplicación web para visitarla más tarde cuando inicies un incidente. Copia el ID de implementación. Este ID se usa para configurar App de Chat en la consola de Google Cloud.
Haz clic en Listo.

Configura la app de Chat en la consola de Google Cloud

En esta sección, se muestra cómo configurar la API de Google Chat en la consola de Google Cloud con información sobre la app de Chat, incluida la ID de la implementación que acabas de crear desde Apps Script en un proyecto final.

En la consola de Google Cloud, haz clic en Menú. > Más productos > Google Workspace > Biblioteca de productos > API de Google Chat > Administrar > Configuración.

Ir a la configuración de la API de Chat
En Nombre de la app, escribe Incident Management.
En URL del avatar, escribe https://developers.google.com/chat/images/quickstart-app-avatar.png.
En Description, escribe Responds to incidents..
Haz clic en el botón de activación Enable Interactive features.
En Funcionalidad, selecciona Recibir mensajes 1:1 y Unirse a espacios y conversaciones grupales.
En Configuración de la conexión, selecciona Proyecto de Apps Script.
En Deployment ID, pega el ID de implementación de Apps Script. que copiaste antes en el proyecto Apps Script de Google Workspace.
Registra un comando de barra que La app de Chat completamente implementada usa lo siguiente:
1. En Comandos de barra, haz clic en Agregar un comando de barra.
2. En Nombre, escribe /closeIncident.
3. En ID de comando, escribe 1.
4. En Description, escribe Closes the incident being discussed in the space.
5. Selecciona Abrir un diálogo.
6. Haz clic en Listo. El comando de barra se registra y aparece en la lista.
En Visibilidad (Visibility), selecciona Haz que esta app de Chat esté disponible para personas y grupos específicos de tu Dominio de Workspace y, luego, ingresa tu dirección de correo electrónico.
En Registros, selecciona Registrar errores en Logging.
Haz clic en Guardar. Aparecerá un mensaje de configuración guardada, lo que significa que la aplicación está listo para la prueba.

Prueba la app de Chat

Para probar la app de chat de administración de incidentes, inicia una incidente desde la página web y verificar que la app de Chat funciona como se espera:

Ve a la URL de la aplicación web de implementación de Apps Script.
Cuando Apps Script solicita permiso para acceder a tus datos, Haz clic en Revisar permisos y accede con una Cuenta de Google apropiada. en tu dominio de Google Workspace y haz clic en Permitir.
Se abrirá la página web de inicialización del incidente. Ingrese la información de la prueba:
1. En Título del incidente, escribe The First Incident.
2. De forma opcional, en Agentes de respuesta ante incidentes, ingresa las direcciones de correo electrónico de tus compañeros responsables de la respuesta ante incidentes. Deben ser usuarios con un Cuenta de Google Chat de tu organización de Google Workspace o se produce un error al crear el espacio. No ingreses tu propia dirección de correo electrónico porque es se incluyen automáticamente.
3. En Initial message, escribe Testing the incident management Chat app..
Haz clic en Crear espacio de Chat. Aparecerá el mensaje creating space.
Después de crear el espacio, aparecerá un mensaje Space created!. Haz clic en Abrir el espacio: Se abrirá el espacio en Chat en una pestaña nueva.
Opcionalmente, tú y los demás responsables de la respuesta ante incidentes pueden enviar mensajes en la espacio. La app resume esos mensajes con Vertex AI y comparte un documento retrospectivo.
Para finalizar la respuesta ante incidentes y comenzar el proceso de resolución, en la Un espacio de Chat, escribe /closeIncident. Un modelo de administración de incidentes cuando lo hagas.
En Cerrar incidente, ingrese una descripción para la resolución del incidente. como Test complete.
Haz clic en Cerrar incidente.

La app de administración de incidentes enumera los mensajes en el espacio y los resume con Vertex AI, pega el resumen en un archivo de Documentos de Google y comparte el documento en el espacio.

Limpia

Para evitar que se apliquen cargos a tu cuenta de Google Cloud por el recursos usados en este instructivo, te recomendamos que borres el Cloud.

En la consola de Google Cloud, ve a la página Administrar recursos. Haz clic en Menú > IAM y Administrador > Administrar recursos.
Ir a Resource Manager
En la lista de proyectos, elige el proyecto que quieres borrar y haz clic en Borra .
En el diálogo, escribe el ID del proyecto y, luego, haz clic en Cerrar para borrarlo. el proyecto.

Responde preguntas basadas en conversaciones de Chat con una app de Chat de IA de Gemini
Administra proyectos con Google Chat, Vertex AI y Firestore
La app de respuesta ante incidentes se autentica con credenciales de usuario para llamar a las APIs. para invocar servicios de Google Cloud, como la API de Chat y la API de Vertex AI. Esto significa que el usuario que inicializa un incidente debe tener acceso a estos de Google Cloud. Para que la app sea más sólida, considera llamar a la API de Vertex AI con una cuenta de servicio en lugar de las credenciales del usuario que invoca el comando de barra /closeIncident. Obtén ayuda para configurar una cuenta de servicio para la API de Vertex AI, consulta Usa una cuenta de servicio personalizada.

Responda a incidentes con Google Chat, Vertex AI y Apps Script

Requisitos previos

Objetivos

Arquitectura

Prepare el entorno

Crea un proyecto de Google Cloud

Consola de Google Cloud

gcloud CLI

Habilita la facturación para el proyecto de Cloud

Consola de Google Cloud

gcloud CLI

Habilitación de las API

Consola de Google Cloud

gcloud CLI

Configura la autenticación y la autorización

Crea e implementa la app de Chat

Ver código de Consts.gs

Ver código de ChatApp.gs

Ver código de ChatSpaceCreator.gs

Ver código de DocsApi.gs

Ver código de VertexAiApi.gs

Ver código de WebController.gs

Ver código de Index.html

Ver código de JavaScript.html

Ver código de Stylesheet.html

Busca el número y el ID de tu proyecto de Cloud

Crea el proyecto de Apps Script

Configura el proyecto de Cloud del proyecto de Apps Script

Crea una implementación de Apps Script

Configura la app de Chat en la consola de Google Cloud

Prueba la app de Chat

Limpia

Temas relacionados

Ver código de `Consts.gs`

Ver código de `ChatApp.gs`

Ver código de `ChatSpaceCreator.gs`

Ver código de `DocsApi.gs`

Ver código de `VertexAiApi.gs`

Ver código de `WebController.gs`

Ver código de `Index.html`

Ver código de `JavaScript.html`

Ver código de `Stylesheet.html`