יצירת אפליקציית HTTP של Google Chat באמצעות Cloud Functions

בדף הזה מוסבר איך יוצרים אפליקציית HTTP ל-Chat. יש כמה דרכים ליישם את הארכיטקטורה הזו. ב-Google Cloud, יכולים להשתמש ב-Cloud Functions, ב-Cloud Run וב-App Engine. במדריך למתחילים הזה לכתוב ולפרוס פונקציה של Cloud Functions שאפליקציית Chat משתמשת בה כדי לענות להודעות של משתמשים.

בעזרת הארכיטקטורה הזו תוכלו להגדיר ש-Chat ישתלב עם ב-Google Cloud או בשרת מקומי באמצעות HTTP, כמו שמוצג את התרשים הבא:

יצירת ארכיטקטורה של אפליקציית Chat באמצעות שירות אינטרנט בשרת מקומי.

בתרשים הקודם, משתמש יוצר אינטראקציה עם פרוטוקול HTTP אפליקציית Chat כוללת את הפרטים הבאים:

  1. משתמש שולח הודעה ב-Chat אל אפליקציית Chat, בצ'אט אישי או מרחב ב-Chat.
  2. בקשת HTTP נשלחת לשרת אינטרנט שהוא סוג של ענן או מערכת מקומית שמכילה את אפליקציית Chat בלוגיקה.
  3. לחלופין, אפשר לשלב את הלוגיקה של אפליקציית Chat עם שירותי Google Workspace (כמו יומן ו Sheets), שירותי Google אחרים (כמו מפות Google, YouTube ו-Vertex AI) או בשירותי אינטרנט אחרים (כמו פרויקט או כלי מכירת הכרטיסים).
  4. שרת האינטרנט שולח תגובת HTTP חזרה אל שירות של אפליקציית Chat ב-Chat.
  5. התשובה תימסר למשתמש.
  6. (אופציונלי) אפליקציית Chat יכולה לקרוא Chat API כדי לפרסם הודעות באופן אסינכרוני או לבצע operations.

הארכיטקטורה הזו מספקת לך את הגמישות להשתמש בספריות קיימות שכבר קיימים במערכת שלך, כי אתם יכולים להשתמש בשפות תכנות שונות כדי לעצב אפליקציות ל-Chat.

מטרות

  • מגדירים את הסביבה.
  • ליצור ולפרוס פונקציה ב-Cloud Functions.
  • לפרסם את האפליקציה ב-Chat.
  • בדיקת האפליקציה.

דרישות מוקדמות

הגדרת הסביבה

לפני שמשתמשים ב-Google APIs, צריך להפעיל אותם בפרויקט ב-Google Cloud. אפשר להפעיל ממשק API אחד או יותר בפרויקט אחד ב-Google Cloud.
  • במסוף Google Cloud, מפעילים את ה-API של Google Chat, Cloud Build API, Cloud Functions API, Cloud Pub/Sub API, Cloud Logging API, Artifact Registry API ו-Cloud Run API.

    הפעלת ממשקי ה-API

יצירה ופריסה של פונקציה ב-Cloud Functions

יצירה ופריסה של פונקציה ב-Cloud Functions שיוצרת כרטיס Chat באמצעות השם המוצג ותמונת הדמות של השולח. כאשר אפליקציית Chat מקבלת הודעה, היא מפעילה את הפונקציה משיב עם הכרטיס.

כדי ליצור ולפרוס את הפונקציה באפליקציית Chat: מבצעים את השלבים הבאים:

Node.js

  1. במסוף Google Cloud, נכנסים לדף Cloud Functions:

    כניסה ל-Cloud Functions

    צריך לוודא שהפרויקט באפליקציית Chat נבחר.

  2. לוחצים על Create Function.

  3. בדף Create function, מגדירים את הפונקציה:

    1. בסביבה, בוחרים באפשרות דור שני.
    2. בשדה Function name, מזינים QuickStartChatApp.
    3. בקטע Region, בוחרים אזור.
    4. בקטע 'אימות', בוחרים באפשרות דרישת אימות.
    5. לוחצים על הבא.
  4. בקטע Runtime, בוחרים את הגרסה העדכנית ביותר של Node.js.

  5. בקטע קוד מקור, בוחרים באפשרות עורך מוטבע.

  6. בקטע נקודת כניסה, מוחקים את טקסט ברירת המחדל ומזינים helloChat.

  7. מחליפים את התוכן של index.js בקוד הבא:

    node/avatar-app/index.js
    /**
     * Google Cloud Function that responds to messages sent from a
     * Google Chat room.
     *
     * @param {Object} req Request sent from Google Chat room
     * @param {Object} res Response to send back
     */
    exports.helloChat = function helloChat(req, res) {
      if (req.method === 'GET' || !req.body.message) {
        res.send('Hello! This function is meant to be used in a Google Chat ' +
          'Room.');
      }
    
      const sender = req.body.message.sender.displayName;
      const image = req.body.message.sender.avatarUrl;
    
      const data = createMessage(sender, image);
    
      res.send(data);
    };
    
    /**
     * Creates a card with two widgets.
     * @param {string} displayName the sender's display name
     * @param {string} imageUrl the URL for the sender's avatar
     * @return {Object} a card with the user's avatar.
     */
    function createMessage(displayName, imageUrl) {
      const cardHeader = {
        title: `Hello ${displayName}!`,
      };
    
      const avatarWidget = {
        textParagraph: {text: 'Your avatar picture: '},
      };
    
      const avatarImageWidget = {
        image: {imageUrl},
      };
    
      const avatarSection = {
        widgets: [
          avatarWidget,
          avatarImageWidget,
        ],
      };
    
      return {
        text: 'Here\'s your avatar',
        cardsV2: [{
          cardId: 'avatarCard',
          card: {
            name: 'Avatar Card',
            header: cardHeader,
            sections: [avatarSection],
          }
        }],
      };
    }

  8. לוחצים על Deploy (פריסה).

Python

  1. במסוף Google Cloud, נכנסים לדף Cloud Functions:

    כניסה ל-Cloud Functions

    צריך לוודא שהפרויקט באפליקציית Chat נבחר.

  2. לוחצים על Create Function.

  3. בדף Create function, מגדירים את הפונקציה:

    1. בסביבה, בוחרים באפשרות דור שני.
    2. בשדה Function name, מזינים QuickStartChatApp.
    3. בקטע Region, בוחרים אזור.
    4. בקטע 'אימות', בוחרים באפשרות דרישת אימות.
    5. לוחצים על הבא.
  4. בקטע סביבת זמן הריצה, בוחרים את הגרסה העדכנית ביותר של Python.

  5. בקטע קוד מקור, בוחרים באפשרות עורך מוטבע.

  6. בקטע נקודת כניסה, מוחקים את טקסט ברירת המחדל ומזינים hello_chat.

  7. מחליפים את התוכן של main.py בקוד הבא:

    python/avatar-app/main.py
    from typing import Any, Mapping
    
    import flask
    import functions_framework
    
    
    # Google Cloud Function that responds to messages sent in
    # Google Chat.
    #
    # @param {Object} req Request sent from Google Chat.
    # @param {Object} res Response to send back.
    @functions_framework.http
    def hello_chat(req: flask.Request) -> Mapping[str, Any]:
      if req.method == "GET":
        return "Hello! This function must be called from Google Chat."
    
      request_json = req.get_json(silent=True)
    
      display_name = request_json["message"]["sender"]["displayName"]
      avatar = request_json["message"]["sender"]["avatarUrl"]
    
      response = create_message(name=display_name, image_url=avatar)
    
      return response
    
    
    # Creates a card with two widgets.
    # @param {string} name the sender's display name.
    # @param {string} image_url the URL for the sender's avatar.
    # @return {Object} a card with the user's avatar.
    def create_message(name: str, image_url: str) -> Mapping[str, Any]:
      avatar_image_widget = {"image": {"imageUrl": image_url}}
      avatar_text_widget = {"textParagraph": {"text": "Your avatar picture:"}}
      avatar_section = {"widgets": [avatar_text_widget, avatar_image_widget]}
    
      header = {"title": f"Hello {name}!"}
    
      cards = {
          "text": "Here's your avatar",
          "cardsV2": [
              {
                  "cardId": "avatarCard",
                  "card": {
                      "name": "Avatar Card",
                      "header": header,
                      "sections": [avatar_section],
                  },
              }
          ]
      }
    
      return cards

  8. לוחצים על Deploy (פריסה).

Java

  1. במסוף Google Cloud, נכנסים לדף Cloud Functions:

    כניסה ל-Cloud Functions

    צריך לוודא שהפרויקט באפליקציית Chat נבחר.

  2. לוחצים על Create Function.

  3. בדף Create function, מגדירים את הפונקציה:

    1. בסביבה, בוחרים באפשרות דור שני.
    2. בשדה Function name, מזינים QuickStartChatApp.
    3. בקטע Region, בוחרים אזור.
    4. בקטע 'אימות', בוחרים באפשרות דרישת אימות.
    5. לוחצים על הבא.
  4. בקטע סביבת זמן הריצה, בוחרים בגרסה העדכנית ביותר של Java.

  5. בקטע קוד מקור, בוחרים באפשרות עורך מוטבע.

  6. בקטע נקודת כניסה, מוחקים את טקסט ברירת המחדל ומזינים HelloChat.

  7. שינוי השם של src/main/java/com/example/Example.java לשם src/main/java/HelloChat.java.

  8. מחליפים את התוכן של HelloChat.java בקוד הבא:

    java/avatar-app/src/main/java/HelloChat.java
    import com.google.api.services.chat.v1.model.CardWithId;
    import com.google.api.services.chat.v1.model.GoogleAppsCardV1Card;
    import com.google.api.services.chat.v1.model.GoogleAppsCardV1CardHeader;
    import com.google.api.services.chat.v1.model.GoogleAppsCardV1Image;
    import com.google.api.services.chat.v1.model.GoogleAppsCardV1Section;
    import com.google.api.services.chat.v1.model.GoogleAppsCardV1TextParagraph;
    import com.google.api.services.chat.v1.model.GoogleAppsCardV1Widget;
    import com.google.api.services.chat.v1.model.Message;
    import com.google.cloud.functions.HttpFunction;
    import com.google.cloud.functions.HttpRequest;
    import com.google.cloud.functions.HttpResponse;
    import com.google.gson.Gson;
    import com.google.gson.JsonObject;
    import java.util.List;
    
    public class HelloChat implements HttpFunction {
      private static final Gson gson = new Gson();
    
      @Override
      public void service(HttpRequest request, HttpResponse response) throws Exception {
        JsonObject body = gson.fromJson(request.getReader(), JsonObject.class);
    
        if (request.getMethod().equals("GET") || !body.has("message")) {
          response.getWriter().write("Hello! This function must be called from Google Chat.");
          return;
        }
    
        JsonObject sender = body.getAsJsonObject("message").getAsJsonObject("sender");
        String displayName = sender.has("displayName") ? sender.get("displayName").getAsString() : "";
        String avatarUrl = sender.has("avatarUrl") ? sender.get("avatarUrl").getAsString() : "";
        Message message = createMessage(displayName, avatarUrl);
    
        response.getWriter().write(gson.toJson(message));
      }
    
      Message createMessage(String displayName, String avatarUrl) {
        GoogleAppsCardV1CardHeader cardHeader = new GoogleAppsCardV1CardHeader();
        cardHeader.setTitle(String.format("Hello %s!", displayName));
    
        GoogleAppsCardV1TextParagraph textParagraph = new GoogleAppsCardV1TextParagraph();
        textParagraph.setText("Your avatar picture: ");
    
        GoogleAppsCardV1Widget avatarWidget = new GoogleAppsCardV1Widget();
        avatarWidget.setTextParagraph(textParagraph);
    
        GoogleAppsCardV1Image image = new GoogleAppsCardV1Image();
        image.setImageUrl(avatarUrl);
    
        GoogleAppsCardV1Widget avatarImageWidget = new GoogleAppsCardV1Widget();
        avatarImageWidget.setImage(image);
    
        GoogleAppsCardV1Section section = new GoogleAppsCardV1Section();
        section.setWidgets(List.of(avatarWidget, avatarImageWidget));
    
        GoogleAppsCardV1Card card = new GoogleAppsCardV1Card();
        card.setName("Avatar Card");
        card.setHeader(cardHeader);
        card.setSections(List.of(section));
    
        CardWithId cardWithId = new CardWithId();
        cardWithId.setCardId("previewLink");
        cardWithId.setCard(card);
    
        Message message = new Message();
        message.setText("Here's your avatar");
        message.setCardsV2(List.of(cardWithId));
    
        return message;
      }
    }

  9. מחליפים את התוכן של pom.xml בקוד הבא:

    java/avatar-app/pom.xml
    <project xmlns="http://maven.apache.org/POM/4.0.0"
             xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
             xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/xsd/maven-4.0.0.xsd">
      <modelVersion>4.0.0</modelVersion>
    
      <groupId>cloudfunctions</groupId>
      <artifactId>http-function</artifactId>
      <version>1.0-SNAPSHOT</version>
    
      <properties>
        <maven.compiler.target>11</maven.compiler.target>
        <maven.compiler.source>11</maven.compiler.source>
      </properties>
    
      <dependencies>
        <dependency>
          <groupId>com.google.cloud.functions</groupId>
          <artifactId>functions-framework-api</artifactId>
          <version>1.0.1</version>
        </dependency>
    
        <!-- https://mvnrepository.com/artifact/com.google.code.gson/gson -->
        <dependency>
            <groupId>com.google.code.gson</groupId>
            <artifactId>gson</artifactId>
            <version>2.9.1</version>
        </dependency>
    
        <!-- https://mvnrepository.com/artifact/com.google.apis/google-api-services-chat -->
        <dependency>
          <groupId>com.google.apis</groupId>
          <artifactId>google-api-services-chat</artifactId>
          <version>v1-rev20230115-2.0.0</version>
        </dependency>
      </dependencies>
    
      <!-- Required for Java 11 functions in the inline editor -->
      <build>
        <plugins>
          <plugin>
            <groupId>org.apache.maven.plugins</groupId>
            <artifactId>maven-compiler-plugin</artifactId>
            <version>3.8.1</version>
            <configuration>
              <excludes>
                <exclude>.google/</exclude>
              </excludes>
            </configuration>
          </plugin>
        </plugins>
      </build>
    </project>

  10. לוחצים על Deploy (פריסה).

דף הפרטים של Cloud Functions ייפתח, והפונקציה תופיע עם מדדי התקדמות: אחד ל-build ואחד לשירות. כששניהם מחווני ההתקדמות נעלמים ומוחלפים בסימן וי, הפונקציה נפרס ומוכן.

איך נותנים ל-Google Chat הרשאה להפעיל את הפונקציה

כדי לתת ל-Google Chat הרשאה להפעיל את הפונקציה, צריך להוסיף את Google Chat חשבון שירות עם התפקיד Cloud Run Invoker.

  1. במסוף Google Cloud, נכנסים לדף Cloud Run:

    כניסה ל-Cloud Run

  2. ברשימת השירותים של Cloud Run, מסמנים את התיבה שליד מותאמת אישית. (אין ללחוץ על הפונקציה עצמה).

  3. לוחצים על הרשאות. החלונית Permissions תיפתח.

  4. לוחצים על Add principal.

  5. בשדה New principals, מזינים chat@system.gserviceaccount.com.

  6. בקטע Select a role, בוחרים Cloud Run > Cloud Run Invoker

  7. לוחצים על שמירה.

פרסום האפליקציה ב-Google Chat

לאחר פריסת הפונקציה של Cloud Functions, עליכם לבצע את השלבים הבאים כדי להפוך אותה אפליקציית Google Chat:

  1. במסוף Google Cloud, לוחצים על 'תפריט'. &gt; Cloud Functions.

    כניסה ל-Cloud Functions

    צריך לוודא שהפרויקט שבו הפעלתם את Cloud Functions הוא נבחר.

  2. ברשימת הפונקציות, לוחצים על QuickStartChatApp.

  3. לוחצים על הכרטיסייה Triggers (טריגרים).

  4. מעתיקים את כתובת ה-URL בקטע HTTPS.

  5. חיפוש Google Chat API ולוחצים על Google Chat API ואז על ניהול.

    כניסה ל-Chat API

  6. לוחצים על הגדרות אישיות ומגדירים את אפליקציית Google Chat:

    1. בשדה App name, מזינים Quickstart App.
    2. בשדה כתובת ה-URL של הדמות, מזינים https://developers.google.com/chat/images/quickstart-app-avatar.png.
    3. בשדה Description, מזינים Quickstart app.
    4. בקטע פונקציונליות, בוחרים באפשרות קבלת הודעות 1:1 ואז איך מצטרפים למרחבים משותפים ולשיחות קבוצתיות
    5. בקטע הגדרות חיבור, בוחרים באפשרות כתובת URL של האפליקציה ומדביקים את כתובת ה-URL של את הטריגר של הפונקציה של Cloud Functions.
    6. בקטע Authentication Audience (קהל אימות), בוחרים באפשרות App URL (כתובת ה-URL של האפליקציה).
    7. בקטע חשיפה, בוחרים אפליקציית Google Chat הזו תהיה זמינה לאנשים ספציפיים קבוצות בדומיין שלך ולהזין את כתובת האימייל שלך.
    8. בקטע Logs (יומנים), בוחרים באפשרות Log errors to Logging (רישום שגיאות ביומן).
  7. לוחצים על שמירה.

אפליקציית Chat מוכנה לקבל ולהשיב הודעות ב-Chat.

בדיקת האפליקציה של Chat

כדי לבדוק את אפליקציית Chat, צריך לפתוח מרחב בצ'אט אישי עם אפליקציית Chat ושולחים הודעה:

  1. פותחים את Google Chat באמצעות חשבון Google Workspace שבו אתם משתמשים. שקיבלת כשהוספת את עצמך כבודק נאמן.

    כניסה ל-Google Chat

  2. לוחצים על צ'אט חדש.
  3. בשדה אפשר לצרף אנשים, מקלידים את השם של מי שרוצים לצרף אפליקציית Chat.
  4. בוחרים את אפליקציית Chat הרצויה מהתוצאות. A ההודעה תיפתח.

  5. בצ'אט האישי החדש עם האפליקציה, מקלידים Hello ומקישים על enter.

התשובה של אפליקציית Chat מכילה הודעה בכרטיס שמציגה את שם השולח ותמונת הדמות של השולח, כפי שניתן לראות בתמונה הבאה:

אפליקציית Chat מגיבה עם כרטיס עם השם המוצג והדמות של השולח
קובץ אימג&#39;

כדי להוסיף בודקים נאמנים ולקבל מידע נוסף על בדיקת תכונות אינטראקטיביות: בדיקת תכונות אינטראקטיביות עבור אפליקציות ב-Google Chat.

פתרון בעיות

כשאפליקציית Google Chat או אפליקציית Google Chat הפונקציה card מחזירה שגיאה, בממשק של Chat מוצגת ההודעה "משהו השתבש". או "לא ניתן לעבד את הבקשה שלך". לפעמים בממשק המשתמש של Chat לא מציגה הודעות שגיאה, אבל אפליקציית Chat או והכרטיס מפיק תוצאה לא צפויה: לדוגמה, הודעה בכרטיס יופיעו.

יכול להיות שלא תופיע הודעת שגיאה בממשק המשתמש של Chat, אבל יש הודעות שגיאה תיאוריות ונתוני יומן זמינים כדי לעזור לכם לתקן שגיאות כשמופעלת רישום שגיאות ביומן של אפליקציות ל-Chat. כדי לקבל עזרה בצפייה, לניפוי באגים ולתיקון שגיאות: פתרון בעיות ותיקון שגיאות ב-Google Chat

הסרת המשאבים

כדי להימנע מצבירת חיובים בחשבון Google Cloud עבור במשאבים שנעשה בהם שימוש במדריך הזה, מומלץ למחוק את פרויקט בענן.

  1. במסוף Google Cloud, עוברים לדף Manage resources. לוחצים על תפריט &gt; IAM & Admin (אדמין) &gt; לניהול משאבים

    מעבר למנהל המשאבים

  2. ברשימת הפרויקטים, בוחרים את הפרויקט שרוצים למחוק ולוחצים על הסמל. מחיקה של .
  3. כדי למחוק, כותבים את מזהה הפרויקט בתיבת הדו-שיח ולוחצים על Shut down. את הפרויקט.