الردّ على الحوادث باستخدام Google Chat وVertex AI وبرمجة التطبيقات

يشرح هذا الدليل التوجيهي كيفية إنشاء تطبيق Google Chat للاستجابة للحوادث في الوقت الفعلي. عند الاستجابة لحادث ما، فإن التطبيق إنشاء "مساحة Chat" وتعبئتها، ما يسهّل وقوع الحوادث التي تتضمّن الرسائل وأوامر الشرطة المائلة ومربّعات الحوار وتستخدم الذكاء الاصطناعي لتلخيص الرد على الحادث في مستند مستندات Google.

الحادثة هي حدث يتطلب اهتمامًا فوريًا من فريق الأشخاص لحلها. تشمل أمثلة الحوادث ما يلي:

  • يتم إنشاء حالة حساسة للوقت في إدارة العلاقات مع العملاء (CRM) وتتطلب من فريق خدمة التعاون في إيجاد حل لها.
  • انقطاع اتصال النظام بالإنترنت لتنبيه مجموعة من مهندسي موثوقية المواقع الإلكترونية (SRE) لكي يتمكّنوا من العمل معًا لإعادة عرضها على الإنترنت.
  • يحدث زلزال قوي ويحتاج عمال الطوارئ لتنسيق ردودهم.

لأغراض هذا البرنامج التعليمي، يبدأ التنبيه بشأن الحادث عندما ويبلغ عن الحادث بنقرة زر من إحدى صفحات الويب. تحاكي صفحة الويب لحادث من خلال مطالبة المستخدمين بإدخال معلومات أساسية عن الحادثة: العنوان، ووصفها وعناوين بريدها الإلكتروني للمجيبين.

الاطّلاع على طريقة عمل تطبيق Chat لإدارة الحوادث:

  • الموقع الإلكتروني الذي بدأ الحادثة.
    الشكل 1. الموقع الإلكتروني الذي يمكن فيه الإبلاغ عن حادثة.
  • إشعار بأنّه تم إنشاء "مساحة Chat" للحادثة.
    الشكل 2. إشعار بأنّه تم إنشاء "مساحة Chat" للحادثة.
  • الاستجابة للحادثة في مساحة Chat
    الشكل 3. الاستجابة للحادثة في "مساحة Chat"
  • حل الحادث باستخدام أمر شرطة مائلة.
    الشكل 4 حل المشكلة باستخدام أمر شرطة مائلة.
  • مربّع حوار حلّ الحادثة
    الشكل 5 مربّع حوار حلّ الحادثة
  • تحليل الحادثة، مستند "مستندات Google" الذي تمت مشاركته في المساحة
    الشكل 6. تحليل الحادثة التي تمت مشاركتها في مستند "مستندات Google" في مساحة
  • مستند Google لحلّ حادثة ملخّص الذكاء الاصطناعي
    الشكل 7 مستند حل حادثة ملخّص الذكاء الاصطناعي في "مستندات Google"

المتطلبات الأساسية

في حال الحاجة إلى تفعيل أي من هذه المتطلبات الأساسية لمؤسستك، اطلب لتفعيلها، يمكن لمشرف Google Workspace:

  • نشاط تجاري أو مؤسسة حساب Google Workspace لديه إذن بالوصول إلى Google Chat
  • من أجل الدليل تم تفعيل (مشاركة جهات الاتصال) في Google Workspace. يستخدم تطبيق العرقلة الدليل للبحث عن جهات الاستجابة للحوادث معلومات الاتصال، مثل الاسم وعنوان بريدك الإلكتروني. يجب أن يكون المجيبون على الحوادث من مستخدمي تطبيق Google Chat. في مؤسسة Google Workspace.

الأهداف

  • إنشاء تطبيق في Chat للاستجابة للحوادث
  • ساعِد المستخدمين على التعامل مع الحوادث من خلال اتّباع الخطوات التالية:
    • إنشاء مساحات للاستجابة للحوادث
    • نشر رسائل تلخّص الحوادث والردود
    • دعم التعاون من خلال ميزات تطبيق Chat.
  • تلخيص المحادثات والحلول باستخدام Vertex AI

البنية

يوضح الرسم التخطيطي التالي بنية Google Workspace موارد Google Cloud التي تم استخدامها في الاستجابة لمحاولات الاختراق الأمني تطبيق Google Chat

بنية تطبيق Google Chat للاستجابة للحوادث

توضح البنية كيفية الاستجابة للحوادث يعالج تطبيق Google Chat إحدى الحوادث وحلولاً لها.

  1. بدء مستخدم حادثة من موقع إلكتروني خارجي تتم استضافته على برمجة التطبيقات.

  2. يرسل الموقع الإلكتروني طلب HTTP غير متزامن إلى تطبيق Google Chat، مستضاف أيضًا على "برمجة التطبيقات".

  3. يعالج تطبيق Google Chat للاستجابة للحوادث الطلب:

    1. تحصل خدمة SDK لمشرف "برمجة التطبيقات" على عضو في الفريق معلومات، مثل رقم تعريف المستخدم وعنوان البريد الإلكتروني.

    2. مع مجموعة من طلبات HTTP إلى Chat API باستخدام خدمة الدردشة المتقدّمة لبرمجة التطبيقات، الاستجابة للحادث واجه تطبيق Google Chat حادثة في Chat المساحة، وتعبئتها بأعضاء الفريق، وإرسال رسالة إلى المساحة.

  4. يناقش أعضاء الفريق الحادث في "مساحة Chat".

  5. يستدعي أحد أعضاء الفريق أمر الشرطة المائلة للإشارة إلى حل حادثة.

    1. طلب HTTP إلى Chat API باستخدام "برمجة تطبيقات Google" تسرد خدمة الدردشة المتقدمة جميع ميزات Chat رسائل المساحة.

    2. يتلقّى Vertex AI الرسائل المُدرجة وينشئ ملخّصًا.

    3. تنشئ خدمة "برمجة تطبيقات Google" DocumentApp إضافة ملخص Vertex AI إلى جلسة المراجعة.

    4. الاستجابة للحوادث في تطبيق Google Chat Chat API لإرسال رسالة تشارك رابطًا يؤدي إلى الملخّص مستند في "مستندات Google"

تحضير البيئة

يعرض هذا القسم كيفية إنشاء مشروع على Google Cloud وإعداده من أجل تطبيق Chat

إنشاء مشروع على Google Cloud

وحدة التحكّم في Google Cloud

  1. في وحدة التحكّم في Google Cloud، انتقِل إلى القائمة . > إدارة الهوية وإمكانية الوصول و المشرف > إنشاء مشروع.

    الانتقال إلى صفحة "إنشاء مشروع"

  2. في حقل اسم المشروع، أدخِل اسمًا وصفيًا لمشروعك.

    اختياري: لتعديل رقم تعريف المشروع، انقر على تعديل. لا يمكن تغيير رقم تعريف المشروع. بعد إنشاء المشروع، لذا اختر رقم تعريف يلبي احتياجاتك طوال مشروعك.

  3. في حقل الموقع الجغرافي، انقر على تصفّح لعرض المواقع الجغرافية المحتمَلة. مشروعك. بعد ذلك، انقر على اختيار.
  4. انقر على إنشاء. تنتقل Google Cloud Console إلى صفحة "لوحة البيانات" ويتم إنشاء مشروعك. في غضون بضع دقائق.

واجهة سطر الأوامر gcloud

في إحدى بيئات التطوير التالية، يمكنك الوصول إلى Google Cloud واجهة سطر الأوامر (`gcloud`):

  • Cloud Shell: لاستخدام وحدة طرفية على الإنترنت مع gcloud CLI سبق أن تم إعداده، يُرجى تفعيل Cloud Shell.
    تفعيل Cloud Shell
  • Local Shell: لاستخدام بيئة تطوير محلية، تثبيت الإعداد واجهة سطر الأوامر gcloud.
    لإنشاء مشروع على السحابة الإلكترونية، استخدِم الأمر `gcloud project create`: 
    gcloud projects create PROJECT_ID
    استبدِل PROJECT_ID من خلال ضبط رقم تعريف المشروع الذي تريد إنشاءه.

تفعيل الفوترة للمشروع على Google Cloud

وحدة التحكّم في Google Cloud

  1. في وحدة تحكُّم Google Cloud، انتقِل إلى الفوترة. (يُرجى النقر.) قائمة الطعام > الفوترة > مشاريعي.

    الانتقال إلى "الفوترة لمشاريعي"

  2. في القسم اختيار مؤسسة، اختَر المؤسسة المرتبطة مشروعك على Google Cloud
  3. في صف المشروع، افتح قائمة الإجراءات. (), انقر على تغيير الفوترة، واختر حساب فوترة Cloud.
  4. انقر على ضبط الحساب.

واجهة سطر الأوامر gcloud

  1. لسرد حسابات الفوترة المتاحة، شغِّل: 
    gcloud billing accounts list
  2. ربط حساب فوترة بمشروع على Google Cloud: 
    gcloud billing projects link PROJECT_ID --billing-account=BILLING_ACCOUNT_ID

    استبدِل ما يلي:

    • PROJECT_ID هو رقم تعريف المشروع المشروع على السحابة الإلكترونية الذي تريد تفعيل الفوترة له
    • BILLING_ACCOUNT_ID هو رقم تعريف حساب الفوترة المطلوب الربط به. لمشروع Google Cloud.

تفعيل واجهات برمجة التطبيقات

وحدة التحكّم في Google Cloud

  1. في Google Cloud Console، فعِّل Google Chat API وGoogle Docs API واجهة برمجة التطبيقات Admin SDK API وVertex AI API

    تفعيل واجهات برمجة التطبيقات

  2. تأكَّد من تفعيل واجهات برمجة التطبيقات بالشكل الصحيح مشروع على Google Cloud، ثم انقر على التالي.

  3. تأكَّد من تفعيل واجهات برمجة التطبيقات الصحيحة، ثم انقر على تفعيل.

واجهة سطر الأوامر gcloud

  1. إذا لزم الأمر، اضبط المشروع الحالي على السحابة الإلكترونية على المشروع الذي أنشأته. باستخدام الأمر gcloud config set project:

    gcloud config set project PROJECT_ID

    استبدِل PROJECT_ID برقم تعريف المشروع المشروع الذي أنشأته على السحابة الإلكترونية

  2. تفعيل Google Chat API وGoogle Docs API وAdmin SDK API وVertex AI API باستخدام الأمر gcloud services enable:

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

إعداد المصادقة والتفويض

تتيح المصادقة والترخيص لـ مراجع حول الوصول إلى تطبيقات Chat في Google Workspace Google Cloud لمعالجة أي حادثة.

في هذا الدليل التوجيهي، ستنشر التطبيق داخليًا ليكون بإمكانك استخدام العنصر النائب المعلومات. قبل نشر التطبيق خارجيًا، استبدِل العنصر النائب ومعلومات حقيقية عن شاشة الموافقة.

  1. في وحدة التحكّم في Google Cloud، انتقِل إلى قائمة الطعام > واجهات برمجة التطبيقات و الخدمات > شاشة موافقة OAuth:

    الانتقال إلى شاشة طلب الموافقة المتعلّقة ببروتوكول OAuth

  2. ضمن نوع المستخدم، اختَر داخلي، ثم انقر على إنشاء.

  3. في اسم التطبيق، اكتب Incident Management.

  4. في البريد الإلكتروني المخصّص لدعم المستخدمين، اختَر عنوان بريدك الإلكتروني أو مجموعة Google.

  5. ضمن معلومات الاتصال بالمطوِّر، أدخِل عنوان بريدك الإلكتروني.

  6. انقر على حفظ ومتابعة.

  7. انقر على إضافة نطاقات أو إزالتها. تظهر لوحة تحتوي على قائمة بالنطاقات لكل واجهة برمجة تطبيقات فعَّلتها في مشروعك على Google Cloud.

  8. ضمن إضافة النطاقات يدويًا، الصِق النطاقات التالية:

    • 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. انقر على إضافة إلى الجدول.

  10. انقر على تعديل.

  11. انقر على حفظ ومتابعة.

  12. راجِع ملخّص تسجيل التطبيق، ثم انقر على الرجوع إلى لوحة البيانات.

إنشاء تطبيق Chat ونشره

في القسم التالي، يمكنك نسخ وتحديث كامل مشروع "برمجة تطبيقات Google" الذي يحتوي على جميع التطبيقات المطلوبة رمز تطبيق في Google Chat، لذلك ليست هناك حاجة إلى نسخ ولصق كل ملف.

تتضمن بعض الدوال شرطات سفلية في نهاية أسمائها، مثل processSlashCommand_() من ChatApp.gs. تخفي الشرطة السفلية الدالة من صفحة الويب الخاصة بتهيئة الحادث عندما تكون مفتوحة في متصفّح. لمزيد من المعلومات، المعلومات، راجع الوظائف الخاصة:

تتوافق "برمجة تطبيقات Google" مع نوعَي من الملفات، هما .gs نص برمجي و.html. الملفات. للالتزام بهذا الدعم، يتم تضمين JavaScript من جهة العميل للتطبيق. داخل علامات <script /> ويتم تضمين خدمة مقارنة الأسعار (CSS) الخاصة به ضمن علامات <style /> ملف HTML.

يمكنك اختياريًا عرض المشروع بالكامل على GitHub.

عرض على GitHub

في ما يلي نظرة عامة على كل ملف:

Consts.gs

لتحديد الثوابت المشار إليها في ملفات التعليمات البرمجية الأخرى، بما في ذلك رقم تعريف مشروعك على Google Cloud ومعرّف موقع Vertex AI معرّف أمر شرطة مائلة لإغلاق حادثة.

عرض رمز Consts.gs

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

التعامل مع أحداث التفاعل في Chat، بما في ذلك الرسائل، والنقرات على البطاقة، والأوامر التي تبدأ بشرطة مائلة، ومربّعات الحوار. يستجيب إلى طلب /closeIncident بشرطة مائلة من خلال فتح مربّع حوار لجمع معلومات عن الحادثة تفاصيل الحل. يقرأ الرسائل في المساحة من خلال استدعاء طريقة واحدة (spaces.messages.list) في Chat API. الحصول على أرقام تعريف المستخدمين باستخدام خدمة "دليل SDK للمشرف" في برمجة التطبيقات.

عرض رمز ChatApp.gs

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

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

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

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

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

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

تلقي بيانات النموذج التي يدخلها المستخدمون حول الحادث صفحة الويب الخاصة بالتهيئة وتستخدمها لإعداد Chat من خلال إنشائها وملؤها، ثم نشر رسالة حول حادثة.

عرض رمز ChatSpaceCreator.gs

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

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

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

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

استدعاء واجهة برمجة تطبيقات مستندات Google لإنشاء مستند مستندات Google في حساب Google Drive الخاص بالمستخدم ويكتب ملخصًا عن معلومات الحادث، تم إنشاؤه في VertexAiApi.gs بالمستند.

عرض رمز DocsApi.gs

apps-script/incident-response/DocsApi.gs
/**
 * Creates a Doc in the user's Google Drive and writes a summary of the incident information to it.
 *
 * @param {string} title The title of the incident
 * @param {string} resolution Incident resolution described by the user
 * @param {string} chatHistory The whole Chat history be included in the document
 * @param {string} chatSummary A summary of the Chat conversation to be included in the document
 * @return {string} the URL of the created Doc
 */
function createDoc_(title, resolution, chatHistory, chatSummary) {
  let doc = DocumentApp.create(title);
  let body = doc.getBody();
  body.appendParagraph(`Post-Mortem: ${title}`).setHeading(DocumentApp.ParagraphHeading.TITLE);
  body.appendParagraph("Resolution").setHeading(DocumentApp.ParagraphHeading.HEADING1);
  body.appendParagraph(resolution);
  body.appendParagraph("Summary of the conversation").setHeading(DocumentApp.ParagraphHeading.HEADING1);
  body.appendParagraph(chatSummary);
  body.appendParagraph("Full Chat history").setHeading(DocumentApp.ParagraphHeading.HEADING1);
  body.appendParagraph(chatHistory);
  return doc.getUrl();
}
VertexAiApi.gs

تلخيص المحادثة في Chat إلى الفضاء باستخدام Vertex AI تم نشر هذا الملخص في ملف تم إنشاؤه بشكل خاص مستند في DocsAPI.gs.

عرض رمز VertexAiApi.gs

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

عرض الموقع الإلكتروني الخاص بتهيئة العرقلة

عرض رمز WebController.gs

apps-script/incident-response/WebController.gs
/**
 * Serves the web page from Index.html.
 */
function doGet() {
  return HtmlService
    .createTemplateFromFile('Index')
    .evaluate();
}

/**
 * Serves the web content from the specified filename.
 */
function include(filename) {
  return HtmlService
    .createHtmlOutputFromFile(filename)
    .getContent();
}

/**
 * Returns the email address of the user running the script.
 */
function getUserEmail() {
  return Session.getActiveUser().getEmail();
}
Index.html

محتوى HTML الذي يتألف من الموقع الإلكتروني الخاص بتهيئة الحادثة

عرض رمز Index.html

apps-script/incident-response/Index.html
<!DOCTYPE html>
<html>
  <head>
    <base target="_top">
    <link href='https://fonts.googleapis.com/css?family=Roboto' rel='stylesheet'>
    <?!= include('Stylesheet'); ?>
  </head>
  <body>
    <div class="container">
      <div class="content">
        <h1>Incident Manager</h1>
        <form id="incident-form" onsubmit="handleFormSubmit(this)">
          <div id="form">
            <p>
              <label for="title">Incident title</label><br/>
              <input type="text" name="title" id="title" />
            </p>
            <p>
              <label for="users">Incident responders</label><br/>
              <small>
                Please enter a comma-separated list of email addresses of the users
                that should be added to the space.
                Do not include <?= getUserEmail() ?> as it will be added automatically.
              </small><br/>
              <input type="text" name="users" id="users" />
            </p>
            <p>
              <label for="description">Initial message</label></br>
              <small>This message will be posted after the space is created.</small><br/>
              <textarea name="description" id="description"></textarea>
            </p>
            <p class="text-center">
              <input type="submit" value="CREATE CHAT SPACE" />
            </p>
          </div>
          <div id="output" class="hidden"></div>
          <div id="clear" class="hidden">
            <input type="reset" value="CREATE ANOTHER INCIDENT" onclick="onReset()" />
          </div>
        </form>
      </div>
    </div>
    <?!= include('JavaScript'); ?>
  </body>
</html>
JavaScript.html

الأسماء المعرِّفة لسلوك النموذج، بما في ذلك عمليات الإرسال وإصلاح الأخطاء في الموقع الإلكتروني الخاص بتهيئة العرقلة. مضمَّن إلى Index.html بواسطة الدالة include المخصصة في WebController.gs.

عرض رمز JavaScript.html

apps-script/incident-response/JavaScript.html
<script>
  var formDiv = document.getElementById('form');
  var outputDiv = document.getElementById('output');
  var clearDiv = document.getElementById('clear');

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

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

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

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

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

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

خدمة مقارنة الأسعار (CSS) للموقع الإلكتروني الخاص بتهيئة العرقلة من المهم تم تضمينه في Index.html من خلال الدالة include المخصصة في WebController.gs

عرض رمز Stylesheet.html

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

البحث عن رقم مشروعك على Google Cloud ورقم تعريفه

  1. في وحدة التحكّم في Google Cloud، انتقِل إلى مشروعك على Google Cloud.

    الانتقال إلى وحدة التحكّم في Google Cloud

  2. انقر على "الإعدادات والأدوات المساعدة" &gt; إعدادات المشروع.

  3. دوِّن القيم في حقلَي رقم المشروع ورقم تعريف المشروع. إِنْتَ كيفية استخدامها في الأقسام التالية.

إنشاء مشروع "برمجة تطبيقات Google"

لإنشاء مشروع "برمجة تطبيقات Google" وربطه المشروع على السحابة الإلكترونية:

  1. انقر على الزر التالي لفتح مشروع الردّ على الحوادث باستخدام Google Chat في "برمجة تطبيقات Google".
    فتح المشروع
  2. انقر على رمز نظرة عامة.
  3. في صفحة النظرة العامة، انقر على رمز إنشاء نسخة إنشاء نسخة.

  4. تسمية نسختك من مشروع برمجة التطبيقات:

    1. انقر على نسخة من "الرد على الحوادث باستخدام Google Chat".

    2. في عنوان المشروع، اكتب Incident Management Chat app.

    3. انقر على إعادة تسمية.

  5. في نسختك من مشروع "برمجة التطبيقات"، انتقِل إلى Consts.gs. واستبدل YOUR_PROJECT_ID بمعرّف ملف المشروع على السحابة الإلكترونية.

إعداد مشروع "برمجة تطبيقات Google" على السحابة الإلكترونية

  1. في مشروع "برمجة تطبيقات Google"، انقر على رمز إعدادات المشروع إعدادات المشروع.
  2. ضمن مشروع Google Cloud Platform (GCP)، انقر على تغيير المشروع.
  3. في رقم مشروع Google Cloud Platform، الصِق رقم مشروع مشروعك على Google Cloud.
  4. انقر على ضبط المشروع. المشروع على السحابة الإلكترونية و"برمجة تطبيقات Google" يرتبط بها مشروعك الآن.

إنشاء عملية نشر "برمجة تطبيقات Google"

الآن وبعد أن أصبحت جميع الرموز في مكانها الصحيح، انشر النص البرمجي لـ Apps مشروعك. يمكنك استخدام معرّف النشر عند ضبط تطبيق Chat في Google Cloud.

  1. في "برمجة تطبيقات Google"، افتح مشروع تطبيق الاستجابة للحوادث.

    الانتقال إلى "برمجة تطبيقات Google"

  2. انقر على نشر > عملية نشر جديدة:

  3. إذا لم يتم تحديد الإضافة وتطبيق الويب من قبل، بجانب اختَر النوع، وانقر على أنواع النشر رمز إعدادات المشروع ثم اختَر إضافة وتطبيق ويب.

  4. في الوصف، أدخِل وصفًا لهذا الإصدار، مثل Complete version of incident management app

  5. في تنفيذ باسم، اختَر مستخدم يصل إلى تطبيق الويب.

  6. في القسم من لديه إذن الوصول، اختَر أي شخص داخل مؤسستك على Workspace، حيث تظهر عبارة "مؤسستك على Workspace" هو اسم Google Workspace.

  7. انقر على نشر. تم بنجاح إعداد تقارير "برمجة تطبيقات Google" النشر وتوفير رقم تعريف نشر وعنوان URL للحادثة صفحة الويب الخاصة بالتهيئة.

  8. دوِّن عنوان URL لتطبيق الويب للرجوع إليه لاحقًا عند بدء حادثة. انسخ رقم تعريف النشر. وتستخدم هذا المعرّف أثناء إعداد تطبيق Chat في Google Cloud Console

  9. انقر على تم.

ضبط تطبيق Chat في وحدة تحكّم Google Cloud

يعرض هذا القسم كيفية ضبط Google Chat API في وحدة تحكّم Google Cloud. بمعلومات عن تطبيق Chat، بما في ذلك رقم تعريف عملية النشر التي أنشأتها للتو من "برمجة تطبيقات Google" مشروعك.

  1. في وحدة تحكُّم Google Cloud، انقر على القائمة &gt; مزيد من المنتجات &gt; Google Workspace &gt; مكتبة المنتجات &gt; Google Chat API &gt; إدارة &gt; الإعداد.

    الانتقال إلى إعدادات Chat API

  2. في اسم التطبيق، اكتب Incident Management.

  3. في عنوان URL للصورة الرمزية، اكتب https://developers.google.com/chat/images/quickstart-app-avatar.png.

  4. في الوصف، اكتب Responds to incidents..

  5. انقر على مفتاح التبديل تفعيل الميزات التفاعلية لتفعيله.

  6. ضمن الوظائف، اختَر تلقّي الرسائل بين شخصين، الانضمام إلى المساحات والمحادثات الجماعية.

  7. ضمن إعدادات الربط، اختَر مشروع برمجة التطبيقات.

  8. في رقم تعريف النشر، الصِق رقم تعريف نشر برمجة التطبيقات الذي نسخته سابقًا من مشروع "برمجة التطبيقات" النشر.

  9. سجِّل أمرًا شرطة مائلة تريد يستخدم تطبيق Chat الذي تم تنفيذه بالكامل ما يلي:

    1. ضمن أوامر الشرطة المائلة، انقر على إضافة أمر شرطة مائلة.

    2. في الاسم، اكتب /closeIncident.

    3. في رقم تعريف الطلب، اكتب 1.

    4. في الوصف، اكتب Closes the incident being discussed in the space.

    5. انقر على فتح مربّع حوار.

    6. انقر على تم. تم تسجيل الأمر slash وإدراجه.

  10. ضمن مستوى الرؤية، اختَر إتاحة تطبيق Chat هذا لمستخدمين محدّدين ومجموعات محدّدة في Workspace Domain وأدخِل عنوان بريدك الإلكتروني.

  11. ضمن السجلات، اختَر تسجيل الأخطاء في التسجيل.

  12. انقر على حفظ. تظهر رسالة محفوظة للإعدادات، ما يعني أن التطبيق وجاهزة للاختبار.

اختبار تطبيق Chat

لاختبار تطبيق Chat لإدارة الحوادث، عليك بدء حادثة من صفحة الويب وتحقَّق من أن تطبيق Chat على النحو المتوقع:

  1. انتقِل إلى عنوان URL لتطبيق الويب لنشر "برمجة التطبيقات".

  2. عندما تطلب "برمجة التطبيقات" الإذن بالوصول إلى بياناتك، انقر على مراجعة الأذونات، ثم سجِّل الدخول باستخدام حساب Google مناسب. في نطاق Google Workspace، ثم انقر على السماح.

  3. يتم فتح صفحة الويب الخاصة بتهيئة الحادثة. أدخِل معلومات الاختبار:

    1. في عنوان الحادثة، اكتب The First Incident.
    2. أدخِل عناوين البريد الإلكتروني لكل من المجيبين على الحوادث، إذا أردت ذلك زملائك من المستجيبين للحوادث. يجب أن يكونوا من المستخدمين الذين لديهم حساب Google Chat في مؤسستك على Google Workspace فشل إنشاء مساحة. لا تدخل عنوان بريدك الإلكتروني لأنه تلقائيًا.
    3. في الرسالة الأولية، اكتب Testing the incident management Chat app..

  4. انقر على إنشاء مساحة Chat. ستظهر رسالة creating space.

  5. بعد إنشاء المساحة، تظهر رسالة Space created!. (يُرجى النقر.) فتح المساحة: يؤدي هذا الإجراء إلى فتح المساحة في Chat في علامة تبويب جديدة.

  6. يمكنك، إذا أردت، أنت والجهات الأخرى المستجيبة للحوادث إرسال رسائل من خلال مساحة. يلخص التطبيق هذه الرسائل باستخدام Vertex AI ويشارك وثيقة جلسة مراجعة.

  7. لإنهاء الاستجابة للحادث وبدء عملية الحل، في مساحة Chat، اكتب /closeIncident. إدارة الحوادث يفتح مربع حوار

  8. في إغلاق الحادثة، أدخِل وصفًا لحل الحادث، مثل Test complete.

  9. انقر على إغلاق الحادثة.

يسرد تطبيق "إدارة الحوادث" الرسائل في المساحة ويلخصها باستخدام Vertex AI، يلصق الملخّص في مستند على "مستندات Google" ويشارك الوثيقة في المساحة.

تَنظيم

لتجنب تكبد أي رسوم إلى حسابك في Google Cloud مقابل الموارد المستخدمة في هذا البرنامج التعليمي، نوصيك بحذف المشروع على السحابة الإلكترونية.

  1. في وحدة تحكُّم Google Cloud، انتقِل إلى صفحة إدارة الموارد. (يُرجى النقر.) قائمة الطعام &gt; إدارة الهوية وإمكانية الوصول و المشرف &gt; إدارة الموارد.

    الانتقال إلى "مدير الموارد"

  2. في قائمة المشاريع، اختَر المشروع الذي تريد حذفه ثم انقر على حذف .
  3. في مربّع الحوار، اكتب رقم تعريف المشروع ثم انقر على إيقاف التشغيل لحذفه. للمشروع.