Google Chat, Vertex AI ve Apps Komut Dosyası ile olaylara yanıt verme

Bu eğitimde, olaylara gerçek zamanlı olarak yanıt verir. Uygulama bir olaya müdahale ederken Chat alanı oluşturup doldurur, olayı kolaylaştırır mesajları, eğik çizgi komutları ve iletişim kutularıyla çözünür ve özetlemek için yapay zekayı kullanır. Google Dokümanlar dokümanına koyabilirsiniz.

Olay, ekibin hemen ilgilenmesi gereken olaylardır. çok sayıda kişi var. Olaylara örnek olarak şunlar verilebilir:

• Müşteri İlişkileri Yönetimi'nde (CRM) zamana duyarlı bir destek kaydı oluşturulur bir hizmet ekibinin bir çözüm için iş birliği yapmasını gerektiriyor.
• Bir sistem çevrimdışı olduktan sonra bir grup site güvenilirliği mühendislerini (SRE'ler) uyarır. Böylece uygulamayı tekrar çevrimiçi duruma getirmek üzere birlikte çalışabilirler.
• Yüksek büyüklükte bir deprem meydana geliyor ve acil durum çalışanları ve cevaplarını koordine etmektir.

Bu eğitimde belirtildiği gibi, olay uyarısı bir kullanıcı bir web sayfasından yapılan düğmeyi tıklayarak olayı bildirir. Web sayfası kullanıcılardan şu temel olay bilgilerini girmelerini isteyen bir olaydır: başlık, ve katılımcıların e-posta adreslerini girin.

Chat olay yönetimi uygulamasını çalışırken görün:

• 

  Şekil 1. Kullanıcıların olayı bildirebileceği web sitesi.

• .
  Şekil 2. Chat alanının oluşturulduğuna dair bildirim.
• .
  Şekil 3. Olay yanıtı Chat alanı.
• .
  Şekil 4. Eğik çizgi komutuyla olayı çözme.
• .
  Şekil 5. Olay çözme iletişim kutusu.
• .
  Şekil 6. Alanda paylaşılan sorun çözme Google Dokümanlar dokümanı.
• .
  Şekil 7. Google Dokümanlar'da yapay zeka özeti olay çözümü belgesi.

Ön koşullar

Kuruluşunuzda bu ön koşullardan herhangi birinin etkinleştirilmesi gerekiyorsa Google Workspace yöneticinize başvurarak:

• İşletme veya Kuruluş Şuna erişimi olan Google Workspace hesabı: Google Chat.
• Mevcut Dizin (kişi paylaşımı) Google Workspace için etkinleştirilmiş olmalıdır. Olay uygulaması, olaya müdahale edenlerin iletişim bilgileri (ör. ad) ve e-posta adresi. Olay müdahale ekibi, Google Chat kullanıcısı olmalıdır hesabınızda oturum açın.

Hedefler

• Olaylara yanıt veren bir Chat uygulaması derleyin.
• Aşağıdakileri yaparak kullanıcıların olaylara yanıt vermesine yardımcı olun:
  • Olay yanıt alanları oluşturuluyor.
  • Olayları ve yanıtları özetleyen iletiler yayınlama.
  • Ortak çalışmayı desteklemek için etkileşimli araçlar Chat uygulaması özellikleri.
• Vertex AI ile konuşmaları ve çözümleri özetleyin.

Mimari

Aşağıdaki şemada, Google Workspace ve Olay yanıtı tarafından kullanılan Google Cloud kaynakları Google Chat uygulaması.

Mimari, olaya verilen yanıtın Google Chat uygulaması bir olayı ve çözümü işler.

1. Bir kullanıcı, şurada barındırılan harici bir web sitesinden bir olay başlatır: Apps Komut Dosyası.

2. Web sitesi, Apps Komut Dosyası'nda da barındırılan Google Chat uygulaması

3. Olay yanıtı Google Chat uygulaması, isteği işler:

   1. Apps Komut Dosyası Yönetici SDK'sı hizmetine ekip üyesi eklenir kullanıcı kimliği ve e-posta adresi gibi bilgileri dahil edin.

   2. Chat API'ye yapılan bir dizi HTTP isteğiyle Apps Komut Dosyası Gelişmiş Sohbet hizmeti, olaya verilen yanıt Google Chat uygulaması Chat'te olay oluşturur alanı ekip üyeleriyle doldurur ve alana bir mesaj gönderir.

4. Ekip üyeleri Chat alanında olay hakkında tartışır.

5. Bir ekip üyesi, paydaşa bir çözüm olduğunu belirtmek için eğik çizgi komutu çağırır gösterir.

   1. Apps Komut Dosyası'nı kullanarak Chat API'ye yapılan bir HTTP çağrısı Gelişmiş Chat hizmeti, tüm Chat sohbetlerini alanın mesajları görünür.

   2. Vertex AI, listelenen mesajları alıp bir özet oluşturur.

   3. Apps Komut Dosyası DocumentApp hizmeti, yardımcı olur ve Vertex AI'ın özetini uygulayacaksınız.

   4. Google Chat uygulamasının aradığı olay yanıtı Özet bağlantısının paylaşıldığı bir mesaj göndermek için Chat API'si Dokümanlar dokümanı.

Ortamı hazırlama

Bu bölümde, web sitesi için Google Cloud projesinin nasıl Chat uygulaması.

Google Cloud projesi oluşturma

Google Cloud Console

1. Google Cloud konsolunda Menü'ye gidin > IAM ve Yönetici > Proje oluşturun'u tıklayın.

   Proje Oluştur'a gidin

2. Proje Adı alanına projeniz için açıklayıcı bir ad girin.

   İsteğe bağlı: Proje Kimliği'ni düzenlemek için Düzenle'yi tıklayın. Proje kimliği değiştirilemez Bu nedenle, ilk deneme süresi boyunca ihtiyaçlarınızı karşılayan bir kimlik seçin. belirler.

3. Konum alanında, işletmenizin olası konumlarını görüntülemek için Göz at'ı tıklayın belirler. Ardından Seç'i tıklayın.
   Dikkat: Google Workspace kuruluşunuzu bulamıyor musunuz?
   . Bu, bir Google Workspace hesabında oturum açmadığınız anlamına gelir. Bazı özellikler Google Workspace geliştirici belgelerinde açıklanan özelliklere yalnızca bir kuruluşla ilişkilendirilebilir.
4. Oluştur'u tıklayın. Google Cloud Console, Kontrol Paneli sayfasına gider ve projeniz oluşturulur birkaç dakika.

gcloud CLI

Aşağıdaki geliştirme ortamlarından birinde Google Cloud KSA (`gcloud`):

• Cloud Shell: gcloud CLI ile online terminal kullanmak için Cloud Shell'i etkinleştirin.
  . Cloud Shell'i etkinleştir
• Yerel Kabuk: Yerel geliştirme ortamı kullanmak için yükle ve başlatmak öğrenin.
  . Bir Cloud projesi oluşturmak için "gcloud projects create" komutunu kullanın:

  gcloud projects create PROJECT_ID

  Oluşturmak istediğiniz projenin kimliğini ayarlayarak PROJECT_ID değerini değiştirin.

Cloud projesi için faturalandırmayı etkinleştirin

Bir faturalandırma hesabını bağlayamazsanız Bu değişikliği yapmak için gereken izinler. Daha fazla bilgi için bkz. Faturalandırmayı etkinleştirmek için gereken izinler.

Google Cloud Console

1. Google Cloud konsolunda Faturalandırma'ya gidin. Sonraki slayta geçin Menü > Faturalandırma > Projelerim'i tıklayın.

   Projelerim İçin Faturalandırma'ya gidin

2. Bir kuruluş seçin bölümünde, ilişkili kuruluşu seçin Google Cloud projenize ekleyin.
3. Proje satırında İşlemler menüsünü açın (), Faturalandırmayı değiştir'i tıklayın ve Cloud Faturalandırma Hesabı'nı seçin.
4. Hesap belirle'yi tıklayın.

gcloud CLI

1. Kullanılabilir faturalandırma hesaplarını listelemek için şu komutu çalıştırın:

   gcloud billing accounts list

   .
2. Faturalandırma hesabını bir Google Cloud projesine bağlayın:

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

   .

   Aşağıdakini değiştirin:

   • PROJECT_ID şu öğenin Proje Kimliğidir: Faturalandırmayı etkinleştirmek istediğiniz bulut projesi.
   • BILLING_ACCOUNT_ID, bağlanacak faturalandırma hesabı kimliğidir. Google Cloud projesinden bahsedeceğiz.

API'leri etkinleştirme

Google Cloud Console

1. Google Cloud konsolunda Google Chat API'yi, Google Docs API'yi ve Admin SDK API ve Vertex AI API.

   API'leri etkinleştirme

2. API'leri doğru şekilde etkinleştirdiğinizden emin olun. Cloud projesine, ardından İleri'yi tıklayın.

3. Doğru API'leri etkinleştirdiğinizden emin olun ve ardından Etkinleştir'i tıklayın.

gcloud CLI

1. Gerekirse mevcut Cloud projesini, oluşturduğunuz projeye ayarlayın gcloud config set project komutuyla:

   gcloud config set project PROJECT_ID
   

   PROJECT_ID değerini projenin Proje Kimliği ile değiştirin Oluşturduğunuz Cloud projesi.

2. Google Chat API, Google Docs API, Admin SDK API ve Vertex AI API'yi etkinleştirme gcloud services enable komutuyla:

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

Kimlik doğrulama ve yetkilendirme ayarlarını yapma

Kimlik doğrulama ve yetkilendirme, Google Workspace'te Chat uygulaması erişim kaynaklarına ve Google Cloud'un kullandığı bir teknolojidir.

Bu eğiticide, uygulamayı dahili olarak yayınladığınız için yer tutucu kullanmanın bir sakıncası yoktur ekleyebilirsiniz. Uygulamayı harici olarak yayınlamadan önce yer tutucunun yerine gerçek bilgilerle donatılmış bilgiler yer alır.

1. Google Cloud konsolunda şu adrese gidin: Menü > API'ler ve Hizmetler > OAuth izin ekranı'nı tıklayın.

   OAuth izin ekranına gidin.

2. Kullanıcı türü bölümünde Dahili'yi seçin ve ardından Oluştur'u tıklayın.

3. Uygulama adı alanına Incident Management yazın.

4. Kullanıcı desteği e-postası bölümünde e-posta adresinizi veya Google grubu.

5. Geliştirici iletişim bilgileri bölümünün altına e-posta adresinizi girin.

6. Kaydet ve Devam Et'i tıklayın.

7. Kapsam Ekle veya Kaldır'ı tıklayın. Kapsamların listesini içeren bir panel görüntülenir Cloud projenizde etkinleştirdiğiniz her API için otomatik olarak oluşturulur.

8. Kapsamları manuel olarak ekle bölümüne aşağıdaki kapsamları yapıştırın:

   • 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. Add to Table'ı (Tabloya Ekle) tıklayın.

10. Güncelle'yi tıklayın.

11. Kaydet ve Devam Et'i tıklayın.

12. Uygulama kaydı özetini inceleyin ve ardından Kontrol Paneline Dön'ü tıklayın.

Chat uygulamasını oluşturma ve dağıtma

Aşağıdaki bölümde bir Gerekli tüm uygulamaları içeren Apps Komut Dosyası projesi olduğundan emin olmak için hem mevcut hem de her dosyayı yapıştırın.

Bazı işlevlerin adlarının sonunda alt çizgi vardır. Örneğin: processSlashCommand_(), kalkış: ChatApp.gs. Alt çizgi, işlevi gizler olay başlatma web sayfasından erişilebilir. Daha fazla bkz. Özel işlevler.

Apps Komut Dosyası, .gs komut dosyaları ve .html olmak üzere iki dosya türünü destekler. dosyası olarak da kaydedebilir. Bu desteğe uymak için uygulamanın istemci taraflı JavaScript'i <script /> etiketlerinin içinde ve CSS'si, içindeki <style /> etiketlerinin içinde bir HTML dosyası oluşturun.

Dilerseniz projenin tamamını GitHub'da görüntüleyebilirsiniz.

GitHub'da göster

Aşağıda, her bir dosyaya ilişkin genel bakış bulabilirsiniz:

Consts.gs

Diğer kod dosyalarının başvurduğu sabit değerleri tanımlar, Buna Cloud proje kimliğiniz, Vertex AI konum kimliğiniz ve bir olayı kapatmak için eğik çizgi komutu kimliği.

Consts.gs kodunu göster

apps-script/incident-response/Consts.gs

GitHub'da göster

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

ChatApp.gs

Aşağıdakiler dahil olmak üzere Chat etkileşimi etkinliklerini yönetir: mesajlar, kart tıklamaları, eğik çizgi komutları ve iletişim kutularıdır. Yanıt /closeIncident Olay toplamak için iletişim kutusu açarak eğik çizgi komutunu kullanın daha fazla bilgi edinebilirsiniz. Alandaki mesajları okumak için spaces.messages.list yöntemini çağırın. Şuradaki Yönetici SDK'sı Dizini hizmetini kullanarak kullanıcı kimliklerini alır: Apps Komut Dosyası.

ChatApp.gs kodunu göster

apps-script/incident-response/ChatApp.gs

GitHub'da göster

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

Kullanıcıların olayda girdiği form verilerini alır ilk kullanıma hazırlama web sayfasını sağlar ve bu API'yi kullanarak alan adını oluşturup doldurduktan sonra gösterir.

ChatSpaceCreator.gs kodunu göster

apps-script/incident-response/ChatSpaceCreator.gs

GitHub'da göster

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

Bir Google Dokümanlar dokümanı oluşturmak için Google Docs API'yi kullanıcının Google Drive'ına gönderir ve olay bilgilerinin bir özetini yazarsa, VertexAiApi.gs ürününde oluşturuldu.

DocsApi.gs kodunu göster

apps-script/incident-response/DocsApi.gs

GitHub'da göster

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

Chat'teki görüşmeyi özetler Vertex AI'ı kullanarak yeni şeyler öğrenebilirsiniz. Bu özet, özel olarak oluşturulmuş bir DocsAPI.gs uygulamasında doküman.

VertexAiApi.gs kodunu göster

apps-script/incident-response/VertexAiApi.gs

GitHub'da göster

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

Olay başlatma web sitesini sunar.

WebController.gs kodunu göster

apps-script/incident-response/WebController.gs

GitHub'da göster

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

Olay başlatma web sitesini oluşturan HTML.

Index.html kodunu göster

apps-script/incident-response/Index.html

GitHub'da göster

<!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

Gönderme, gönderme, hesap ve bildirim gibi form davranışlarını yönetir. ve olay başlatma web sitesiyle ilgili sorunları giderir. Her şey dahil WebController.gs içindeki özel include işleviyle Index.html işlevine dönüştürülebilir.

JavaScript.html kodunu göster

apps-script/incident-response/JavaScript.html

GitHub'da göster

<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

Olay başlatma web sitesinin CSS'si. İnsanların Index.html içine özel include işlevi tarafından dahil edilir WebController.gs.

Stylesheet.html kodunu göster

apps-script/incident-response/Stylesheet.html

GitHub'da göster

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

Cloud proje numaranızı ve kimliğinizi bulma

1. Google Cloud konsolunda Cloud projenize gidin.

   Google Cloud konsoluna git

2. Ayarlar ve Yardımcı Programlar'ı tıklayın. > Proje ayarları.

3. Proje numarası ve Proje Kimliği alanlarındaki değerleri not edin. Siz kullanabilirsiniz.

Apps Komut Dosyası projesini oluşturma

Apps Komut Dosyası projesi oluşturmak ve bu projeyi Cloud projesi:

1. Aşağıdaki düğmeyi tıklayarak Google Chat ile olaylara yanıt verin Apps Komut Dosyası projesini açın.
   Projeyi açın
2. Genel Bakış'ı tıklayın.
3. Genel bakış sayfasında Kopya oluştur'u tıklayın.

4. Apps Komut Dosyası projesinin kopyanıza ad verin:

   1. Google Chat ile ilgili olaylara yanıt verme kopyası'nı tıklayın.

   2. Proje başlığı'na Incident Management Chat app yazın.

   3. Yeniden adlandır'ı tıklayın.

5. Apps Komut Dosyası projesi için oluşturduğunuz kopyada Consts.gs adresine gidin. dosyasını seçin ve YOUR_PROJECT_ID yerine Cloud projesi.

Apps Komut Dosyası projesinin Cloud projesini ayarlayın

1. Apps Komut Dosyası projenizde, Proje Ayarları'nı tıklayın.
2. Google Cloud Platform (GCP) Project bölümünde Projeyi değiştir seçeneğini tıklayın.
3. GCP proje numarası alanına Cloud projenizin proje numarasını yapıştırın.
4. Proje ayarla'yı tıklayın. Cloud projesi ve Apps Komut Dosyası şimdi de bağlantılı.

Apps Komut Dosyası dağıtımı oluşturma

Tüm kod yerleştirildikten sonra Apps Komut Dosyası'nı dağıtın. belirler. Dağıtım kimliğini, Google Cloud'daki Chat uygulaması.

1. Apps Komut Dosyası'nda olaya yanıt uygulamasının projesini açın.

   Apps Komut Dosyası'na gidin

2. Dağıt'ı tıklayın > Yeni dağıtım.

3. Eklenti ve Web uygulaması seçili değilse Tür seçin, dağıtım türlerini tıklayın, ardından Eklenti ve Web uygulaması'nı seçin.

4. Açıklama bölümünde, bu sürüm için aşağıdaki gibi bir açıklama girin: Complete version of incident management app.

5. Farklı yürüt bölümünde Web uygulamasına erişen kullanıcı'yı seçin.

6. Erişimi olanlar bölümünde Workspace kuruluşunuzdaki herkes'i seçin. Burada "Workspace kuruluşunuz" kişinin adı Google Workspace kuruluşu.

7. Dağıt'ı tıklayın. Apps Komut Dosyası raporları başarılı dağıtım ve olay için dağıtım kimliği ile URL sağlar ilk kullanıma hazırlama web sayfası.

8. Daha sonra bir olay başlattığınızda ziyaret edilecek Web uygulaması URL'sini not edin. Deployment ID'yi (Dağıtım Kimliği) kopyalayın. Google Cloud Console'daki Chat uygulaması

9. Bitti'yi tıklayın.

Google Cloud Console'da Chat uygulamasını yapılandırma

Bu bölümde, Google Cloud Console'da Google Chat API'nin nasıl yapılandırılacağı gösterilmektedir Aşağıdakiler de dahil olmak üzere Chat uygulamanızla ilgili bilgileri içeren Apps Komut Dosyanızdan yeni oluşturduğunuz dağıtımın kimliği belirler.

1. Google Cloud konsolunda Menü'yü tıklayın. > Diğer ürünler > Google Workspace > Ürün Kitaplığı > Google Chat API > Yönet > Yapılandırma.

   Chat API yapılandırmasına git

2. Uygulama adı alanına Incident Management yazın.

3. Avatar URL'si alanına https://developers.google.com/chat/images/quickstart-app-avatar.png yazın.

4. Açıklama alanına Responds to incidents. yazın.

5. Etkileşimli özellikleri etkinleştir düğmesini tıklayarak açık konuma getirin.

6. İşlevler bölümünde Bire bir mesaj al, Alanlara ve grup görüşmelerine katıl'ı seçin.

7. Bağlantı ayarları bölümünde Apps Komut Dosyası projesi'ni seçin.

8. Deployment ID (Dağıtım Kimliği) alanına Apps Komut Dosyası Dağıtım Kimliğini yapıştırın. daha önce Apps Komut Dosyası projesinden kopyaladığınız dağıtım.

9. Şu boyutta bir eğik çizgi komutu kaydedin: tam olarak uygulanmış Chat uygulamasında şunlar kullanılır:

   1. Eğik çizgi komutları altında, Eğik çizgi komutu ekle'yi tıklayın.

   2. Ad alanına /closeIncident yazın.

   3. Komut Kimliği'ne 1 yazın.

   4. Açıklama alanına şunu yazın: Closes the incident being discussed in the space.

   5. İletişim kutusu açar'ı seçin.

   6. Bitti'yi tıklayın. Eğik çizgi komutu kaydedilir ve listelenir.

10. Görünürlük altında Bu Chat uygulamasını, Workspace Alanı'nı tıklayın ve e-posta adresinizi girin.

11. Günlükler bölümünde, Hataları günlüğe kaydetme'yi seçin.

12. Kaydet'i tıklayın. Yapılandırma tarafından kaydedilmiş bir mesaj görünür. Bu mesaj, uygulamanın hazır olduğunu göreceksiniz.

Chat uygulamasını test etme

Olay yönetimi Chat uygulamasını test etmek için olup olmadığını kontrol edin ve Chat uygulamasının beklendiği gibi çalışıyor:

1. Apps Komut Dosyası dağıtım web uygulaması URL'sine gidin.

2. Apps Komut Dosyası, verilerinize erişmek için izin istediğinde İzinleri incele'yi tıklayın, uygun bir Google Hesabı ile oturum açın seçin ve İzin ver'i tıklayın.

3. Olay başlatma web sayfası açılır. Test bilgilerini girin:

   1. Olay başlığı alanına The First Incident yazın.
   2. İsterseniz Olay müdahale ekipleri bölümüne şu e-posta adreslerini de girebilirsiniz: yanıt verebilirsiniz. Belirli bir Google Workspace kuruluşunuzdaki Google Chat hesabınız veya alan oluşturulamadı. dahil edilir.
   3. İlk mesaj'a Testing the incident management Chat app. yazın.

4. Chat alanı oluştur'u tıklayın. Bir creating space mesajı gösterilir.

5. Alan oluşturulduktan sonra bir Space created! mesajı gösterilir. Sonraki slayta geçin Alanı aç: Bu işlem, alanı Chat'te yeni bir sekmede açar.

6. İsterseniz siz ve diğer olay müdahale ekipleri, boşluk oluşturur. Uygulama, Vertex AI'ı kullanarak bu mesajları özetler ve retrospektif belgesidir.

7. Olay yanıtını sonlandırmak ve çözüm sürecini başlatmak için Chat alanı, /closeIncident yazın. Olay yönetimi iletişim kutusu açılır.

8. Olay kapatma bölümünde, olayın çözümü için bir açıklama girin. Test complete gibi.

9. Olay Kapat'ı tıklayın.

Olay Yönetimi uygulaması, alandaki mesajları listeler ve özetler özeti bir Google Dokümanlar dokümanına yapıştırır ve kullanabilirsiniz.

Temizleme

Aşağıdaki işlem için Google Cloud hesabınızdan ücret alınmasını önlemek amacıyla: kaynaklardan yararlanabilmeniz için Cloud projesi.

Dikkat: Proje silmenin aşağıdaki etkileri vardır:

• Projedeki her şey silinir. Bu eğitim için mevcut bir projeyi kullandıysanız bu projeyi sildiğinizde, projede yaptığınız diğer çalışmaları da silmiş olursunuz.
• Özel proje kimlikleri kaybolur. Bu projeyi oluştururken, gelecekte kullanmak istediğiniz özel bir proje kimliği oluşturmuş olabilirsiniz. Proje kimliğini kullanan URL'leri (ör. appspot.com'daki bir URL) korumak için projenin tamamını silmek yerine proje içindeki seçili kaynakları silin.

Birden fazla eğiticiyi ve hızlı başlangıç kılavuzunu keşfetmeyi planlıyorsanız projeleri yeniden kullanarak proje kota sınırlarını aşmaktan kaçınabilirsiniz.

1. Google Cloud konsolunda Kaynakları yönetin sayfasına gidin. Sonraki slayta geçin Menü > IAM ve Yönetici > Kaynakları Yönetin.

   Resource Manager'a git 'nı inceleyin.

2. Proje listesinden silmek istediğiniz projeyi seçin ve ardından Sil: .
3. İletişim kutusuna proje kimliğini yazın ve silmek için Kapat'ı tıklayın gösterir.

İlgili konular

• Gemini AI Chat uygulamasıyla Chat sohbetlerine dayalı soruları yanıtlama
• Google Chat, Vertex AI ve Firestore ile projeleri yönetme
• Olay yanıt uygulaması, API'leri çağırmak için kullanıcı kimlik bilgileriyle kimlik doğrular ve Chat API ile Vertex AI API gibi Google Cloud hizmetlerini çağırın. Yani, olayı başlatan kullanıcının şunlara erişmesi gerekir: kullanıma sunuyoruz. Uygulamayı daha sağlam hale getirmek için Vertex AI API'yi çağırmayı düşünebilirsiniz kullanıcının çağırdığı kullanıcı kimlik bilgileri yerine hizmet hesabı olarak kullanılır. /closeIncident eğik çizgi komutu. Hizmet hesabını yapılandırma konusunda yardım için Vertex AI API hakkında Özel hizmet hesabı kullanın.