Google ใช้เทคโนโลยี AI เพื่อแปลเนื้อหาเป็นภาษาที่คุณต้องการ การแปลโดย AI อาจมีข้อผิดพลาด

สร้างแอป HTTP สำหรับ Google Chat

หน้านี้อธิบายวิธีสร้างแอป Google Chat ผ่าน HTTP โดยใช้บริการของ Google Cloud หากต้องการสร้างแอป Chat คุณต้องเขียน และทําให้ฟังก์ชัน Cloud Run ใช้งานได้ ซึ่งแอป Chat จะใช้ฟังก์ชันนี้เพื่อตอบกลับข้อความของผู้ใช้

สถาปัตยกรรม HTTP ช่วยให้คุณกำหนดค่า Chat เพื่อผสานรวมกับ Google Cloud หรือเซิร์ฟเวอร์ในองค์กรได้โดยใช้ HTTP ดังที่แสดงในไดอะแกรมต่อไปนี้

สถาปัตยกรรมของแอป Chat ที่ใช้บริการเว็บในเซิร์ฟเวอร์ในองค์กร

ในแผนภาพก่อนหน้า ผู้ใช้ที่โต้ตอบกับแอป HTTP Chat จะมีโฟลว์ข้อมูลดังนี้

ผู้ใช้ส่งข้อความใน Chat ไปยัง แอป Chat ไม่ว่าจะในข้อความส่วนตัวหรือใน พื้นที่ทำงานใน Chat
ระบบจะส่งคำขอ HTTP ไปยังเว็บเซิร์ฟเวอร์ซึ่งเป็นระบบในระบบคลาวด์หรือระบบในองค์กรที่มีตรรกะของแอป Chat
คุณสามารถเลือกผสานรวมตรรกะของแอป Chat กับบริการของ Google Workspace (เช่น ปฏิทินและชีต), บริการอื่นๆ ของ Google (เช่น Maps, YouTube และ Vertex AI) หรือบริการเว็บอื่นๆ (เช่น ระบบการจัดการโครงการหรือเครื่องมือออกตั๋ว)
เว็บเซิร์ฟเวอร์จะส่งการตอบกลับ HTTP กลับไปยัง บริการแอป Chat ใน Chat
ระบบจะส่งคำตอบให้ผู้ใช้
แอป Chat สามารถเรียกใช้ Chat API เพื่อโพสต์ข้อความแบบไม่พร้อมกันหรือดำเนินการอื่นๆ ได้

สถาปัตยกรรมนี้ช่วยให้คุณใช้ไลบรารีและคอมโพเนนต์ที่มีอยู่ในระบบได้ เนื่องจากสามารถออกแบบแอปใน Chat เหล่านี้ได้โดยใช้ภาษาโปรแกรมที่แตกต่างกัน

วัตถุประสงค์

ตั้งค่าสภาพแวดล้อม
สร้างและติดตั้งใช้งานฟังก์ชัน Cloud Run
กำหนดค่าแอป Chat
ทดสอบแอป

ข้อกำหนดเบื้องต้น

บัญชี Google Workspace สำหรับธุรกิจหรือองค์กร ที่มีสิทธิ์เข้าถึง Google Chat
โปรเจ็กต์ Google Cloud ที่เปิดใช้การเรียกเก็บเงิน หากต้องการตรวจสอบว่าโปรเจ็กต์ที่มีอยู่เปิดใช้การเรียกเก็บเงินหรือไม่ โปรดดูยืนยัน สถานะการเรียกเก็บเงินของโปรเจ็กต์ หากต้องการสร้างโปรเจ็กต์และตั้งค่าการเรียกเก็บเงิน โปรดดูสร้างโปรเจ็กต์ Google Cloud

ตั้งค่าสภาพแวดล้อม

ก่อนใช้ Google API คุณต้องเปิดใช้ API ในโปรเจ็กต์ที่อยู่ในระบบคลาวด์ของ Google คุณเปิด API อย่างน้อย 1 รายการในโปรเจ็กต์ Google Cloud เดียวได้

ในคอนโซล Google API ให้เปิดใช้ Google Chat API, Cloud Build API, Cloud Functions API, Cloud Pub/Sub API, Cloud Logging API, Artifact Registry API และ Cloud Run API

เปิดใช้ API

สร้างและทําให้ฟังก์ชัน Cloud Run ใช้งานได้

สร้างและติดตั้งใช้งานฟังก์ชัน Cloud Run ที่สร้างการ์ด Chat พร้อมชื่อที่แสดงและรูปโปรไฟล์ของผู้ส่ง เมื่อแอป Chat ได้รับข้อความ แอปจะเรียกใช้ฟังก์ชันและ ตอบกลับด้วยการ์ด

หากต้องการสร้างและติดตั้งใช้งานฟังก์ชันสำหรับแอป Chat ให้ทำตามขั้นตอนต่อไปนี้

Node.js

ในคอนโซล Google API ให้ไปที่หน้า Cloud Run โดยทำดังนี้

ไปที่ Cloud Run

ตรวจสอบว่าได้เลือกโปรเจ็กต์สำหรับแอป Chat แล้ว
คลิกเขียนฟังก์ชัน
ในหน้าสร้างบริการ ให้ตั้งค่าฟังก์ชันดังนี้
1. ในช่องชื่อบริการ ให้ป้อน addonchatapp
2. เลือกภูมิภาคในรายการภูมิภาค
3. ในรายการรันไทม์ ให้เลือก Node.js เวอร์ชันล่าสุด
4. ในส่วนการตรวจสอบสิทธิ์ ให้เลือกต้องมีการตรวจสอบสิทธิ์
5. คลิกสร้าง แล้วรอให้ Cloud Run สร้างบริการ คอนโซลจะเปลี่ยนเส้นทางคุณไปยังแท็บแหล่งที่มา

ในแท็บแหล่งที่มา ให้ทำดังนี้

ในจุดแรกเข้า ให้ลบข้อความเริ่มต้นและป้อน avatarApp
แทนที่เนื้อหาของ index.js ด้วยโค้ดต่อไปนี้

node/chat/avatar-app/index.js

ดูใน GitHub

import { http } from '@google-cloud/functions-framework';

// The ID of the slash command "/about".
// You must use the same ID in the Google Chat API configuration.
const ABOUT_COMMAND_ID = 1;

/**
 * Handle requests from Google Workspace add on
 *
 * @param {Object} req Request sent by Google Chat
 * @param {Object} res Response to be sent back to Google Chat
 */
http('avatarApp', (req, res) => {
  const chatEvent = req.body.chat;
  let message;
  if (chatEvent.appCommandPayload) {
    message = handleAppCommand(chatEvent);
  } else {
    message = handleMessage(chatEvent);
  }
  res.send({ hostAppDataAction: { chatDataAction: { createMessageAction: {
    message: message
  }}}});
});

/**
 * Responds to an APP_COMMAND event in Google Chat.
 *
 * @param {Object} event the event object from Google Chat
 * @return the response message object.
 */
function handleAppCommand(event) {
  switch (event.appCommandPayload.appCommandMetadata.appCommandId) {
    case ABOUT_COMMAND_ID:
      return {
        text: 'The Avatar app replies to Google Chat messages.'
      };
  }
}

/**
 * Responds to a MESSAGE event in Google Chat.
 *
 * @param {Object} event the event object from Google Chat
 * @return the response message object.
 */
function handleMessage(event) {
  // Stores the Google Chat user as a variable.
  const chatUser = event.messagePayload.message.sender;
  const displayName = chatUser.displayName;
  const avatarUrl = chatUser.avatarUrl;
  return {
    text: 'Here\'s your avatar',
    cardsV2: [{
      cardId: 'avatarCard',
      card: {
        name: 'Avatar Card',
        header: {
          title: `Hello ${displayName}!`,
        },
        sections: [{ widgets: [{
          textParagraph: { text: 'Your avatar picture: ' }
        }, {
          image: { imageUrl: avatarUrl }
        }]}]
      }
    }]
  };
}

คลิกบันทึกและติดตั้งใช้งานอีกครั้ง

Python

ในคอนโซล Google API ให้ไปที่หน้า Cloud Run โดยทำดังนี้

ไปที่ Cloud Run

ตรวจสอบว่าได้เลือกโปรเจ็กต์สำหรับแอป Chat แล้ว
คลิกเขียนฟังก์ชัน
ในหน้าสร้างบริการ ให้ตั้งค่าฟังก์ชันดังนี้
1. ในช่องชื่อบริการ ให้ป้อน addonchatapp
2. เลือกภูมิภาคในรายการภูมิภาค
3. ในรายการรันไทม์ ให้เลือก Python เวอร์ชันล่าสุด
4. ในส่วนการตรวจสอบสิทธิ์ ให้เลือกต้องมีการตรวจสอบสิทธิ์
5. คลิกสร้าง แล้วรอให้ Cloud Run สร้างบริการ คอนโซลจะเปลี่ยนเส้นทางคุณไปยังแท็บแหล่งที่มา

ในแท็บแหล่งที่มา ให้ทำดังนี้

ในจุดแรกเข้า ให้ลบข้อความเริ่มต้นและป้อน avatar_app
แทนที่เนื้อหาของ main.py ด้วยโค้ดต่อไปนี้

python/chat/avatar-app/main.py

ดูใน GitHub

from typing import Any, Mapping

import flask
import functions_framework

# The ID of the slash command "/about".
# You must use the same ID in the Google Chat API configuration.
ABOUT_COMMAND_ID = 1

@functions_framework.http
def avatar_app(req: flask.Request) -> Mapping[str, Any]:
  """Handle requests from Google Workspace add on

  Args:
    flask.Request req: the request sent by Google Chat

  Returns:
    Mapping[str, Any]: the response to be sent back to Google Chat
  """
  chat_event = req.get_json(silent=True)["chat"]
  if chat_event and "appCommandPayload" in chat_event:
    message = handle_app_command(chat_event)
  else:
    message = handle_message(chat_event)
  return { "hostAppDataAction": { "chatDataAction": { "createMessageAction": {
      "message": message
  }}}}

def handle_app_command(event: Mapping[str, Any]) -> Mapping[str, Any]:
  """Responds to an APP_COMMAND event in Google Chat.

  Args:
    Mapping[str, Any] event: the event object from Google Chat

  Returns:
    Mapping[str, Any]: the response message object.
  """
  if event["appCommandPayload"]["appCommandMetadata"]["appCommandId"] == ABOUT_COMMAND_ID:
    return {
      "text": "The Avatar app replies to Google Chat messages.",
    }
  return {}

def handle_message(event: Mapping[str, Any]) -> Mapping[str, Any]:
  """Responds to a MESSAGE event in Google Chat.

  Args:
    Mapping[str, Any] event: the event object from Google Chat

  Returns:
    Mapping[str, Any]: the response message object.
  """
  # Stores the Google Chat user as a variable.
  chat_user = event["messagePayload"]["message"]["sender"]
  display_name = chat_user.get("displayName", "")
  avatar_url = chat_user.get("avatarUrl", "")
  return {
    "text": "Here's your avatar",
    "cardsV2": [{
      "cardId": "avatarCard",
      "card": {
        "name": "Avatar Card",
        "header": {
          "title": f"Hello {display_name}!"
        },
        "sections": [{ "widgets": [
          { "textParagraph": { "text": "Your avatar picture:" }},
          { "image": { "imageUrl": avatar_url }},
        ]}]
      }
    }]
  }

คลิกบันทึกและติดตั้งใช้งานอีกครั้ง

Java

ในคอนโซล Google API ให้ไปที่หน้า Cloud Run โดยทำดังนี้

ไปที่ Cloud Run

ตรวจสอบว่าได้เลือกโปรเจ็กต์สำหรับแอป Chat แล้ว
คลิกเขียนฟังก์ชัน
ในหน้าสร้างบริการ ให้ตั้งค่าฟังก์ชันดังนี้
1. ในช่องชื่อบริการ ให้ป้อน addonchatapp
2. เลือกภูมิภาคในรายการภูมิภาค
3. ในรายการรันไทม์ ให้เลือก Java เวอร์ชันล่าสุด
4. ในส่วนการตรวจสอบสิทธิ์ ให้เลือกต้องมีการตรวจสอบสิทธิ์
5. คลิกสร้าง แล้วรอให้ Cloud Run สร้างบริการ คอนโซลจะเปลี่ยนเส้นทางคุณไปยังแท็บแหล่งที่มา

ในแท็บแหล่งที่มา ให้ทำดังนี้

ในจุดแรกเข้า ให้ลบข้อความเริ่มต้นและป้อน App
เปลี่ยนชื่อไฟล์ Java เริ่มต้นเป็น src/main/java/com/google/chat/avatar/App.java
แทนที่เนื้อหาของ App.java ด้วยโค้ดต่อไปนี้

java/chat/avatar-app/src/main/java/com/google/chat/avatar/App.java

ดูใน GitHub

package com.google.chat.avatar;

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 App implements HttpFunction {
  // The ID of the slash command "/about".
  // You must use the same ID in the Google Chat API configuration.
  private static final int ABOUT_COMMAND_ID = 1;

  private static final Gson gson = new Gson();

  /**
   * Handle requests from Google Workspace add on
   * 
   * @param request the request sent by Google Chat
   * @param response the response to be sent back to Google Chat
   */
  @Override
  public void service(HttpRequest request, HttpResponse response) throws Exception {
    JsonObject event = gson.fromJson(request.getReader(), JsonObject.class);
    JsonObject chatEvent = event.getAsJsonObject("chat");
    Message message;
    if (chatEvent.has("appCommandPayload")) {
      message = handleAppCommand(chatEvent);
    } else {
      message = handleMessage(chatEvent);
    }
    JsonObject createMessageAction = new JsonObject();
    createMessageAction.add("message", gson.fromJson(gson.toJson(message), JsonObject.class));
    JsonObject chatDataAction = new JsonObject();
    chatDataAction.add("createMessageAction", createMessageAction);
    JsonObject hostAppDataAction = new JsonObject();
    hostAppDataAction.add("chatDataAction", chatDataAction);
    JsonObject dataActions = new JsonObject();
    dataActions.add("hostAppDataAction", hostAppDataAction);
    response.getWriter().write(gson.toJson(dataActions));
  }

  /**
   * Handles an APP_COMMAND event in Google Chat.
   *
   * @param event the event object from Google Chat
   * @return the response message object.
   */
  private Message handleAppCommand(JsonObject event) throws Exception {
    switch (event.getAsJsonObject("appCommandPayload")
      .getAsJsonObject("appCommandMetadata").get("appCommandId").getAsInt()) {
      case ABOUT_COMMAND_ID:
        return new Message()
          .setText("The Avatar app replies to Google Chat messages.");
      default:
        return null;
    }
  }

  /**
   * Handles a MESSAGE event in Google Chat.
   *
   * @param event the event object from Google Chat
   * @return the response message object.
   */
  private Message handleMessage(JsonObject event) throws Exception {
    // Stores the Google Chat user as a variable.
    JsonObject chatUser = event.getAsJsonObject("messagePayload").getAsJsonObject("message").getAsJsonObject("sender");
    String displayName = chatUser.has("displayName") ? chatUser.get("displayName").getAsString() : "";
    String avatarUrl = chatUser.has("avatarUrl") ? chatUser.get("avatarUrl").getAsString() : "";
    return new Message()
      .setText("Here's your avatar")
      .setCardsV2(List.of(new CardWithId()
        .setCardId("avatarCard")
        .setCard(new GoogleAppsCardV1Card()
          .setName("Avatar Card")
          .setHeader(new GoogleAppsCardV1CardHeader()
            .setTitle(String.format("Hello %s!", displayName)))
          .setSections(List.of(new GoogleAppsCardV1Section().setWidgets(List.of(
            new GoogleAppsCardV1Widget().setTextParagraph(new GoogleAppsCardV1TextParagraph()
              .setText("Your avatar picture:")),
            new GoogleAppsCardV1Widget()
              .setImage(new GoogleAppsCardV1Image().setImageUrl(avatarUrl)))))))));
  }
}

แทนที่เนื้อหาของ pom.xml ด้วยโค้ดต่อไปนี้

java/chat/avatar-app/pom.xml

ดูใน GitHub

<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>com.google.chat</groupId>
  <artifactId>avatar-app</artifactId>
  <version>1.0-SNAPSHOT</version>

  <properties>
    <maven.compiler.target>17</maven.compiler.target>
    <maven.compiler.source>17</maven.compiler.source>
  </properties>

  <dependencies>
    <dependency>
      <groupId>com.google.cloud.functions</groupId>
      <artifactId>functions-framework-api</artifactId>
      <version>1.1.4</version>
    </dependency>
    <dependency>
      <groupId>com.google.code.gson</groupId>
      <artifactId>gson</artifactId>
      <version>2.9.1</version>
    </dependency>
    <dependency>
      <groupId>com.google.apis</groupId>
      <artifactId>google-api-services-chat</artifactId>
      <version>v1-rev20230115-2.0.0</version>
    </dependency>
  </dependencies>

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

คลิกบันทึกและติดตั้งใช้งานอีกครั้ง

หน้ารายละเอียดบริการ Cloud Run จะเปิดขึ้น รอให้ฟังก์ชันทำงาน

กำหนดค่าแอป Chat

หลังจากที่ใช้งานฟังก์ชัน Cloud Run แล้ว ให้ทำตามขั้นตอนต่อไปนี้เพื่อกำหนดค่าและ ใช้งานแอป Google Chat

ในคอนโซล Google API ให้ไปที่หน้า Cloud Run โดยทำดังนี้

ไปที่ Cloud Run

ตรวจสอบว่าได้เลือกโปรเจ็กต์ที่เปิดใช้ Cloud Run แล้ว
คลิก addonchatapp ในรายการฟังก์ชัน
ในหน้ารายละเอียดบริการ ให้คัดลอก URL ของฟังก์ชัน URL ลงท้ายด้วย run.app
ในช่องค้นหาของ Google Cloud ให้ค้นหา "Google Chat API" จากนั้น คลิก Google Chat API แล้วคลิกจัดการ

ไปที่ Chat API
คลิกการกำหนดค่า แล้วตั้งค่าแอป Google Chat ดังนี้
1. ในส่วนชื่อแอป ให้ป้อน Quickstart App
2. ใน URL อวตาร ให้ป้อน https://developers.google.com/workspace/chat/images/quickstart-app-avatar.png
3. ในคำอธิบาย ให้ป้อน Quickstart app
4. ในส่วนฟังก์ชันการทำงาน ให้เลือกเข้าร่วมพื้นที่ทำงานและการสนทนากลุ่ม
5. ในส่วนการตั้งค่าการเชื่อมต่อ ให้เลือก URL ปลายทาง HTTP
6. ในส่วนทริกเกอร์ ให้เลือกใช้ URL ปลายทาง HTTP ทั่วไปสำหรับทริกเกอร์ทั้งหมด แล้ววาง URL สำหรับทริกเกอร์ฟังก์ชัน Cloud Run ลงใน ช่อง
7. ในส่วนระดับการมองเห็น ให้เลือก ทำให้แอป Google Chat นี้พร้อมใช้งานสำหรับบุคคลและ กลุ่มที่เฉพาะเจาะจงในโดเมนของคุณ แล้วป้อนอีเมล
8. ในส่วนบันทึก ให้เลือกบันทึกข้อผิดพลาดไปยังการบันทึก
คลิกบันทึก
ในส่วนการตั้งค่าการเชื่อมต่อ ให้คัดลอกอีเมลบัญชีบริการ คุณต้องใช้อีเมลนี้เมื่อให้สิทธิ์แอป Chat เพื่อเรียกใช้ฟังก์ชัน

จากนั้นให้สิทธิ์แอป Chat ในการเรียกใช้ฟังก์ชัน Cloud Run

ให้สิทธิ์ Google Chat ในการเรียกใช้ฟังก์ชัน

หากต้องการให้สิทธิ์ Google Chat เรียกใช้ฟังก์ชัน ให้เพิ่ม บัญชีบริการของแอป Chat ที่มีบทบาทผู้เรียกใช้ Cloud Run

ในคอนโซล Google API ให้ไปที่หน้า Cloud Run โดยทำดังนี้

ไปที่ Cloud Run
ในรายการบริการ Cloud Run ให้เลือกช่องทําเครื่องหมายข้างฟังก์ชันการรับ (อย่าคลิกฟังก์ชันนั้นโดยตรง)
คลิกสิทธิ์ แผงสิทธิ์จะเปิดขึ้น
คลิกเพิ่มหลักการ
ในผู้ใช้หลักรายใหม่ ให้ป้อนอีเมลของบัญชีบริการ ที่เชื่อมโยงกับแอป Chat

อีเมลบัญชีบริการจะอยู่ในหน้าการกำหนดค่า Chat API ในส่วนการตั้งค่าการเชื่อมต่อ > URL ปลายทาง HTTP > อีเมลบัญชีบริการ

ไปที่การกำหนดค่า Chat API
ในเลือกบทบาท ให้เลือก Cloud Run > Cloud Run Invoker
คลิกบันทึก

แอป Chat พร้อมรับและตอบกลับ ข้อความใน Chat แล้ว

ทดสอบแอปใน Chat

หากต้องการทดสอบแอป Chat ให้เปิดพื้นที่ข้อความส่วนตัวด้วย แอป Chat แล้วส่งข้อความโดยทำดังนี้

เปิด Google Chat โดยใช้บัญชี Google Workspace ที่คุณ ระบุไว้เมื่อเพิ่มตัวเองเป็นผู้ทดสอบที่เชื่อถือได้

ไปที่ Google Chat
คลิก แชทใหม่
ในช่องเพิ่มบุคคลอย่างน้อย 1 คน ให้พิมพ์ชื่อแอป Chat
เลือกแอป Chat จากผลการค้นหา ข้อความส่วนตัวจะเปิดขึ้น

หมายเหตุ: หากไม่เห็นแอป Chat ในรายการผลการค้นหา ให้ตรวจสอบว่าคุณได้รวมบัญชี Google Workspace ไว้ในการตั้งค่าระดับการมองเห็นของหน้าการกำหนดค่า Chat API ในคอนโซล Google API แล้ว
ในข้อความส่วนตัวใหม่กับแอป ให้พิมพ์ Hello แล้วกด enter

ข้อความ ของแอป Chat มีคาร์ดที่แสดงชื่อและรูปโปรไฟล์ของผู้ส่ง ดังที่แสดงในรูปภาพต่อไปนี้

แอปแชทตอบกลับด้วยการ์ดที่มีชื่อที่แสดงและรูปโปรไฟล์ของผู้ส่ง
รูปภาพ

หากต้องการเพิ่มผู้ทดสอบที่เชื่อถือได้และดูข้อมูลเพิ่มเติมเกี่ยวกับการทดสอบฟีเจอร์แบบอินเทอร์แอกทีฟ โปรดดูทดสอบฟีเจอร์แบบอินเทอร์แอกทีฟสำหรับแอป Google Chat

แก้ปัญหา

เมื่อแอป Google Chat หรือการ์ดแสดงข้อผิดพลาด อินเทอร์เฟซ Chat จะแสดงข้อความว่า "เกิดข้อผิดพลาด" หรือ "ดำเนินการตามคำขอของคุณไม่ได้" บางครั้ง UI ของ Chat อาจไม่แสดงข้อความแสดงข้อผิดพลาด แต่แอป Chat หรือ การ์ดอาจให้ผลลัพธ์ที่ไม่คาดคิด เช่น ข้อความในการ์ดอาจไม่ ปรากฏ

แม้ว่าข้อความแสดงข้อผิดพลาดอาจไม่ปรากฏใน UI ของ Chat แต่ข้อความแสดงข้อผิดพลาดและข้อมูลบันทึกที่อธิบายไว้จะช่วยคุณแก้ไขข้อผิดพลาดได้เมื่อเปิดการบันทึกข้อผิดพลาดสำหรับแอป Chat หากต้องการความช่วยเหลือในการดู การแก้ไขข้อบกพร่อง และการแก้ไขข้อผิดพลาด โปรดดู แก้ปัญหาและแก้ไขข้อผิดพลาดของ Google Chat

ล้างข้อมูล

เราขอแนะนำให้คุณลบโปรเจ็กต์ที่อยู่ในระบบคลาวด์เพื่อหลีกเลี่ยงการเรียกเก็บเงินจากบัญชี Google Cloud สำหรับทรัพยากรที่ใช้ในบทแนะนำนี้

ข้อควรระวัง: การลบโปรเจ็กต์จะมีผลดังต่อไปนี้

ระบบจะลบทุกอย่างในโปรเจ็กต์ หากคุณใช้โปรเจ็กต์ที่มีอยู่แล้วสำหรับบทแนะนำนี้ เมื่อลบโปรเจ็กต์ ระบบจะลบงานอื่นๆ ที่คุณทำในโปรเจ็กต์นั้นด้วย
รหัสโปรเจ็กต์ที่กำหนดเองจะหายไป เมื่อสร้างโปรเจ็กต์นี้ คุณอาจสร้างรหัสโปรเจ็กต์ที่กำหนดเองซึ่งต้องการใช้ในอนาคต หากต้องการเก็บ URL ที่ใช้รหัสโปรเจ็กต์ เช่น URL ใน appspot.com ให้ลบทรัพยากรที่เลือกภายในโปรเจ็กต์แทนการลบทั้งโปรเจ็กต์

หากวางแผนที่จะดูบทแนะนำและคู่มือเริ่มต้นหลายรายการ การนำโปรเจ็กต์กลับมาใช้ใหม่จะช่วยให้คุณไม่เกินขีดจำกัดโควต้าโปรเจ็กต์

ในคอนโซล Google API ให้ไปที่หน้าจัดการทรัพยากร คลิก เมนู > IAM และผู้ดูแลระบบ > จัดการทรัพยากร
ไปที่เครื่องมือจัดการทรัพยากร
ในรายการโปรเจ็กต์ ให้เลือกโปรเจ็กต์ที่ต้องการลบ แล้วคลิก ลบ
ในกล่องโต้ตอบ ให้พิมพ์รหัสโปรเจ็กต์ แล้วคลิกปิดเพื่อลบ โปรเจ็กต์

หัวข้อที่เกี่ยวข้อง

หากต้องการเพิ่มฟีเจอร์อื่นๆ ลงในแอป Chat ให้ดูข้อมูลต่อไปนี้
เลือกสถาปัตยกรรมของแอปใน Chat
ยืนยันคำขอจาก Google Chat

แอป Chat ที่ไม่ใช่ส่วนเสริม: สร้างแอป Google Chat แบบ HTTP

หากต้องการสร้างแอป Chat ที่ไม่ใช่ส่วนเสริมของ Google Workspace ให้ ทำตามขั้นตอนต่อไปนี้เพื่อทำให้ฟังก์ชัน Cloud Run ใช้งานได้ ให้สิทธิ์ในการเรียกใช้ และกำหนดค่าแอป Chat ที่ไม่ใช่ ส่วนเสริม

สร้างและติดตั้งใช้งานฟังก์ชัน Cloud Run สำหรับแอปใน Chat ที่ไม่ใช่ส่วนเสริม

Node.js

ในคอนโซล Google API ให้ไปที่หน้า Cloud Run โดยทำดังนี้

ไปที่ Cloud Run

ตรวจสอบว่าได้เลือกโปรเจ็กต์สำหรับแอป Chat แล้ว
คลิกเขียนฟังก์ชัน
ในหน้าสร้างบริการ ให้ตั้งค่าฟังก์ชันดังนี้
1. ในช่องชื่อบริการ ให้ป้อน quickstartchatapp
2. เลือกภูมิภาคในรายการภูมิภาค
3. ในรายการรันไทม์ ให้เลือก Node.js เวอร์ชันล่าสุด
4. ในส่วนการตรวจสอบสิทธิ์ ให้เลือกต้องมีการตรวจสอบสิทธิ์
5. คลิกสร้าง แล้วรอให้ Cloud Run สร้างบริการ คอนโซลจะเปลี่ยนเส้นทางคุณไปยังแท็บแหล่งที่มา

ในแท็บแหล่งที่มา ให้ทำดังนี้

ในจุดแรกเข้า ให้ลบข้อความเริ่มต้นและป้อน avatarApp

แทนที่เนื้อหาของ index.js ด้วยโค้ดต่อไปนี้

node/avatar-app/index.js

ดูใน GitHub

const functions = require('@google-cloud/functions-framework');

// Command IDs (configure these in Google Chat API)
const ABOUT_COMMAND_ID = 1; // ID for the "/about" slash command
const HELP_COMMAND_ID = 2; // ID for the "Help" quick command

/**
 * Google Cloud Function that handles HTTP requests from Google Chat.
 *
 * @param {Object} req - The HTTP request object sent from Google Chat.
 * @param {Object} res - The HTTP response object.
 */
functions.http('avatarApp', (req, res) => {
  const event = req.body;

  if (event.appCommandMetadata) {
    handleAppCommands(event, res);
  } else {
    handleRegularMessage(event, res);
  }
});

/**
 * Handles slash and quick commands.
 *
 * @param {Object} event - The Google Chat event.
 * @param {Object} res - The HTTP response object.
 */
function handleAppCommands(event, res) {
  const {appCommandId, appCommandType} = event.appCommandMetadata;

  switch (appCommandId) {
    case ABOUT_COMMAND_ID:
      return res.send({
        privateMessageViewer: event.user,
        text: 'The Avatar app replies to Google Chat messages.'
      });
    case HELP_COMMAND_ID:
      return res.send({
        privateMessageViewer: event.user,
        text: 'The Avatar app replies to Google Chat messages.'
      });
  }
}

/**
 * Handles regular messages (not commands).
 *
 * @param {Object} event - The Google Chat event.
 * @param {Object} res - The HTTP response object.
 */
function handleRegularMessage(event, res) {
  const messageData = createMessage(event.user);
  res.send(messageData);
}

/**
 * Creates a card message with the user's avatar.
 *
 * @param {Object} user - The user who sent the message.
 * @param {string} user.displayName - The user's display name.
 * @param {string} user.avatarUrl - The URL of the user's avatar.
 * @return {Object} - The card message object.
 */
function createMessage({displayName, avatarUrl}) {
  return {
    text: 'Here\'s your avatar',
    cardsV2: [{
      cardId: 'avatarCard',
      card: {
        name: 'Avatar Card',
        header: {
          title: `Hello ${displayName}!`,
        },
        sections: [{
          widgets: [
            {textParagraph: {text: 'Your avatar picture:'}},
            {image: {imageUrl: avatarUrl}},
          ],
        }],
      },
    }],
  };
}

คลิกบันทึกและติดตั้งใช้งานอีกครั้ง

Python

ในคอนโซล Google API ให้ไปที่หน้า Cloud Run โดยทำดังนี้

ไปที่ Cloud Run

ตรวจสอบว่าได้เลือกโปรเจ็กต์สำหรับแอป Chat แล้ว
คลิกเขียนฟังก์ชัน
ในหน้าสร้างบริการ ให้ตั้งค่าฟังก์ชันดังนี้
1. ในช่องชื่อบริการ ให้ป้อน quickstartchatapp
2. เลือกภูมิภาคในรายการภูมิภาค
3. ในรายการรันไทม์ ให้เลือก Python เวอร์ชันล่าสุด
4. ในส่วนการตรวจสอบสิทธิ์ ให้เลือกต้องมีการตรวจสอบสิทธิ์
5. คลิกสร้าง แล้วรอให้ Cloud Run สร้างบริการ คอนโซลจะเปลี่ยนเส้นทางคุณไปยังแท็บแหล่งที่มา

ในแท็บแหล่งที่มา ให้ทำดังนี้

ในจุดแรกเข้า ให้ลบข้อความเริ่มต้นและป้อน avatar_app

แทนที่เนื้อหาของ main.py ด้วยโค้ดต่อไปนี้

python/avatar-app/main.py

ดูใน GitHub

from typing import Any, Mapping

import flask
import functions_framework

# Command IDs (configure these in Google Chat API)
ABOUT_COMMAND_ID = 1  # ID for the "/about" slash command
HELP_COMMAND_ID = 2  # ID for the "Help" quick command


@functions_framework.http
def avatar_app(req: flask.Request) -> Mapping[str, Any]:
    """Google Cloud Function that handles HTTP requests from Google Chat.

    Args:
        flask.Request: the request

    Returns:
        Mapping[str, Any]: the response
    """
    event = req.get_json(silent=True)

    if event and "appCommandMetadata" in event:
        return handle_app_commands(event)
    else:
        return handle_regular_message(event)


def handle_app_commands(event: Mapping[str, Any]) -> Mapping[str, Any]:
    """Handles slash and quick commands.

    Args:
        Mapping[str, Any] event: The Google Chat event.

    Returns:
        Mapping[str, Any]: the response
    """
    app_command_id = event["appCommandMetadata"]["appCommandId"]

    if app_command_id == ABOUT_COMMAND_ID:
        return {
            "privateMessageViewer": event["user"],
            "text": "The Avatar app replies to Google Chat messages.",
        }
    elif app_command_id == HELP_COMMAND_ID:
        return {
            "privateMessageViewer": event["user"],
            "text": "The Avatar app replies to Google Chat messages.",
        }
    return {}




def handle_regular_message(event: Mapping[str, Any]) -> Mapping[str, Any]:
    """Handles regular messages (not commands).

    Args:
        Mapping[str, Any] event: The Google Chat event.

    Returns:
        Mapping[str, Any]: the response
    """

    if not event or "user" not in event:
        return "Invalid request."

    message_data = create_message(event["user"])
    return message_data


def create_message(user: Mapping[str, Any]) -> Mapping[str, Any]:
    """Creates a card message with the user's avatar.

    Args:
        Mapping[str, Any] user: The user who sent the message.

    Returns:
        Mapping[str, Any]: a card with the user's avatar.
    """
    display_name = user.get("displayName", "")
    avatar_url = user.get("avatarUrl", "")

    return {
        "text": "Here's your avatar",
        "cardsV2": [
            {
                "cardId": "avatarCard",
                "card": {
                    "name": "Avatar Card",
                    "header": {"title": f"Hello {display_name}!"},
                    "sections": [
                        {
                            "widgets": [
                                {"textParagraph": {"text": "Your avatar picture:"}},
                                {"image": {"imageUrl": avatar_url}},
                            ]
                        }
                    ],
                },
            }
        ],
    }

คลิกบันทึกและติดตั้งใช้งานอีกครั้ง

Java

ในคอนโซล Google API ให้ไปที่หน้า Cloud Run โดยทำดังนี้

ไปที่ Cloud Run

ตรวจสอบว่าได้เลือกโปรเจ็กต์สำหรับแอป Chat แล้ว
คลิกเขียนฟังก์ชัน
ในหน้าสร้างบริการ ให้ตั้งค่าฟังก์ชันดังนี้
1. ในช่องชื่อบริการ ให้ป้อน quickstartchatapp
2. เลือกภูมิภาคในรายการภูมิภาค
3. ในรายการรันไทม์ ให้เลือก Java เวอร์ชันล่าสุด
4. ในส่วนการตรวจสอบสิทธิ์ ให้เลือกต้องมีการตรวจสอบสิทธิ์
5. คลิกสร้าง แล้วรอให้ Cloud Run สร้างบริการ คอนโซลจะเปลี่ยนเส้นทางคุณไปยังแท็บแหล่งที่มา

ในแท็บแหล่งที่มา ให้ทำดังนี้

ในจุดแรกเข้า ให้ลบข้อความเริ่มต้นและป้อน App
เปลี่ยนชื่อ src/main/java/com/example/Example.java เป็น src/main/java/AvatarApp.java

แทนที่เนื้อหาของ AvatarApp.java ด้วยโค้ดต่อไปนี้

java/avatar-app/src/main/java/AvatarApp.java

ดูใน GitHub

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.api.services.chat.v1.model.User;
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 AvatarApp implements HttpFunction {
  private static final Gson gson = new Gson();

  // Command IDs (configure these in Google Chat API)
  private static final int ABOUT_COMMAND_ID = 1; // ID for the "/about" slash command
  private static final int HELP_COMMAND_ID = 2; // ID for the "Help" quick command

  @Override
  public void service(HttpRequest request, HttpResponse response) throws Exception {
    JsonObject event = gson.fromJson(request.getReader(), JsonObject.class);

    if (event.has("appCommandMetadata")) {
      handleAppCommands(event, response);
    } else {
      handleRegularMessage(event, response);
    }
  }

  /**
   * Handles slash and quick commands.
   *
   * @param event    The Google Chat event.
   * @param response The HTTP response object.
   */
  private void handleAppCommands(JsonObject event, HttpResponse response) throws Exception {
    int appCommandId = event.getAsJsonObject("appCommandMetadata").get("appCommandId").getAsInt();

    switch (appCommandId) {
      case ABOUT_COMMAND_ID:
        Message aboutMessage = new Message();
        aboutMessage.setText("The Avatar app replies to Google Chat messages.");
        aboutMessage.setPrivateMessageViewer(new User()
            .setName(event.getAsJsonObject("user").get("name").getAsString()));
        response.getWriter().write(gson.toJson(aboutMessage));
        return;
      case HELP_COMMAND_ID:
        Message helpMessage = new Message();
        helpMessage.setText("The Avatar app replies to Google Chat messages.");
        helpMessage.setPrivateMessageViewer(new User()
            .setName(event.getAsJsonObject("user").get("name").getAsString()));
        response.getWriter().write(gson.toJson(helpMessage));
        return;
    }
  }

  /**
   * Handles regular messages (not commands).
   *
   * @param event    The Google Chat event.
   * @param response The HTTP response object.
   */
  private void handleRegularMessage(JsonObject event, HttpResponse response) throws Exception {

    if (!event.has("user")) {
      response.getWriter().write("Invalid request.");
      return;
    }

    JsonObject user = event.getAsJsonObject("user");
    String displayName = user.has("displayName") ? user.get("displayName").getAsString() : "";
    String avatarUrl = user.has("avatarUrl") ? user.get("avatarUrl").getAsString() : "";
    Message message = createMessage(displayName, avatarUrl);
    response.getWriter().write(gson.toJson(message));
  }

  /**
   * Creates a card message with the user's avatar.
   *
   * @param displayName The user's display name.
   * @param avatarUrl   The URL of the user's avatar.
   * @return The card message object.
   */
  private Message createMessage(String displayName, String avatarUrl) {
    return new Message()
        .setText("Here's your avatar")
        .setCardsV2(List.of(new CardWithId()
            .setCardId("avatarCard")
            .setCard(new GoogleAppsCardV1Card()
                .setName("Avatar Card")
                .setHeader(new GoogleAppsCardV1CardHeader()
                    .setTitle(String.format("Hello %s!", displayName)))
                .setSections(List.of(new GoogleAppsCardV1Section().setWidgets(List.of(
                    new GoogleAppsCardV1Widget()
                        .setTextParagraph(new GoogleAppsCardV1TextParagraph()
                            .setText("Your avatar picture:")),
                    new GoogleAppsCardV1Widget()
                        .setImage(new GoogleAppsCardV1Image().setImageUrl(avatarUrl)))))))));
  }
}

แทนที่เนื้อหาของ pom.xml ด้วยโค้ดต่อไปนี้

java/avatar-app/pom.xml

ดูใน GitHub

<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/maven-v4_0_0.xsd">
  <modelVersion>4.0.0</modelVersion>

  <groupId>gcfv2</groupId>
  <artifactId>avatar-app</artifactId>
  <version>0.0.1</version>
  <name>Avatar App</name>

  <properties>
    <maven.compiler.release>21</maven.compiler.release>
  </properties>

  <dependencies>
    <dependency>
      <groupId>com.google.cloud.functions</groupId>
      <artifactId>functions-framework-api</artifactId>
      <version>1.1.4</version>
    </dependency>

    <!-- https://mvnrepository.com/artifact/com.google.code.gson/gson -->
    <dependency>
      <groupId>com.google.code.gson</groupId>
      <artifactId>gson</artifactId>
      <version>2.12.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-rev20250116-2.0.0</version>
    </dependency>

  </dependencies>

</project>

คลิกบันทึกและติดตั้งใช้งานอีกครั้ง

ให้สิทธิ์ Google Chat ในการเรียกใช้ฟังก์ชัน

หากต้องการให้สิทธิ์ Google Chat เรียกใช้ฟังก์ชัน ให้เพิ่มบัญชีบริการ Google Chat ที่มีบทบาทผู้เรียกใช้ Cloud Run โดยทำดังนี้

ในคอนโซล Google API ให้ไปที่หน้า Cloud Run โดยทำดังนี้

ไปที่ Cloud Run
ในรายการบริการ Cloud Run ให้เลือกช่องทําเครื่องหมายข้างฟังก์ชันการรับ (อย่าคลิกฟังก์ชันนั้นโดยตรง)
คลิกสิทธิ์ แผงสิทธิ์จะเปิดขึ้น
คลิกเพิ่มหลักการ
ในผู้ใช้หลักรายใหม่ ให้ป้อน chat@system.gserviceaccount.com
ในเลือกบทบาท ให้เลือก Cloud Run > Cloud Run Invoker
คลิกบันทึก

กำหนดค่าแอป Chat ที่ไม่ใช่ส่วนเสริม

หลังจากที่ฟังก์ชัน Cloud Run ได้รับการติดตั้งใช้งานแล้ว ให้ทำตามขั้นตอนต่อไปนี้เพื่อเปลี่ยนให้เป็น แอป Chat ที่ไม่ใช่ส่วนเสริม

ในคอนโซล Google API ให้ไปที่หน้า Cloud Run โดยทำดังนี้

ไปที่ Cloud Run

ตรวจสอบว่าได้เลือกโปรเจ็กต์ที่เปิดใช้ Cloud Run แล้ว
ในรายการบริการ ให้คลิก quickstartchatapp
ในหน้ารายละเอียดบริการ ให้คัดลอก URL ของฟังก์ชัน
ค้นหา "Google Chat API" แล้วคลิก Google Chat API จากนั้นคลิกจัดการ

ไปที่ Chat API
คลิกการกำหนดค่า แล้วตั้งค่าแอป Chat ที่ไม่ใช่ส่วนเสริม
1. เลือกสร้างแอป Chat นี้เป็นส่วนเสริมของ Google Workspace กล่องโต้ตอบจะเปิดขึ้นเพื่อขอให้คุณยืนยัน คลิกปิดใช้ในกล่องโต้ตอบ
2. ในส่วนชื่อแอป ให้ป้อน Quickstart App
3. ใน URL อวตาร ให้ป้อน https://developers.google.com/workspace/chat/images/quickstart-app-avatar.png
4. ในคำอธิบาย ให้ป้อน Quickstart app
5. ในส่วนฟังก์ชันการทำงาน ให้เลือกเข้าร่วมพื้นที่ทำงานและการสนทนากลุ่ม
6. ในส่วนการตั้งค่าการเชื่อมต่อ ให้เลือก URL ปลายทาง HTTP
7. ในส่วนทริกเกอร์ ให้เลือกใช้ URL ปลายทาง HTTP ทั่วไปสำหรับทริกเกอร์ทั้งหมด แล้ววาง URL สำหรับทริกเกอร์ฟังก์ชัน Cloud Run ลงใน ช่อง
8. ในส่วนระดับการมองเห็น ให้เลือก ทำให้แอป Chat นี้พร้อมใช้งานสำหรับบุคคลและ กลุ่มที่เฉพาะเจาะจงในโดเมนของคุณ แล้วป้อนอีเมล
9. ในส่วนบันทึก ให้เลือกบันทึกข้อผิดพลาดไปยังการบันทึก
คลิกบันทึก