Trang này được dịch bởi Cloud Translation API.

Xây dựng ứng dụng Google Chat HTTP bằng Cloud Functions

Trang này giải thích cách tạo một ứng dụng nhắn tin HTTP. Có nhiều cách để triển khai cấu trúc này. Trên Google Cloud, bạn có thể sử dụng Cloud Functions, Cloud Run và App Engine. Trong phần hướng dẫn bắt đầu nhanh này, bạn sẽ viết và triển khai Hàm đám mây mà ứng dụng Chat dùng để phản hồi tin nhắn của người dùng.

Với cấu trúc này, bạn có thể định cấu hình Chat để tích hợp với Google Cloud hoặc một máy chủ tại cơ sở bằng cách sử dụng HTTP, như minh hoạ trong sơ đồ sau:

Cấu trúc của một ứng dụng trong Chat dùng dịch vụ web trong máy chủ tại cơ sở.

Trong sơ đồ trước, một người dùng tương tác với một ứng dụng nhắn tin qua HTTP có luồng thông tin sau đây:

Người dùng gửi tin nhắn trong Chat đến một ứng dụng trong Chat, qua tin nhắn trực tiếp hoặc trong phòng Chat.
Yêu cầu HTTP được gửi đến một máy chủ web là hệ thống trên đám mây hoặc tại cơ sở hạ tầng riêng chứa logic ứng dụng Chat.
Logic của ứng dụng Chat có thể tích hợp với các dịch vụ của Google Workspace (như Lịch và Trang tính), các dịch vụ khác của Google (như Maps, YouTube và Vertex AI) hoặc các dịch vụ web khác (như hệ thống quản lý dự án hoặc công cụ bán vé) nếu muốn.
Máy chủ web sẽ gửi phản hồi HTTP trở lại dịch vụ ứng dụng Chat trong Chat.
Phản hồi được gửi đến người dùng.
Ứng dụng Chat có thể gọi API Chat để đăng tin nhắn không đồng bộ hoặc thực hiện các thao tác khác (không bắt buộc).

Cấu trúc này giúp bạn linh hoạt sử dụng các thư viện và thành phần hiện có đã có trong hệ thống của mình vì các ứng dụng trong Chat này có thể được thiết kế bằng nhiều ngôn ngữ lập trình.

Mục tiêu

Thiết lập môi trường.
Tạo và triển khai Hàm đám mây.
Xuất bản ứng dụng lên Chat.
Kiểm thử ứng dụng.

Điều kiện tiên quyết

Tài khoản Google Workspace có quyền truy cập vào Google Chat trong một tổ chức Google Workspace cho phép các lệnh gọi Hàm Google Cloud chưa được xác thực.

Một dự án trên Google Cloud.
Hãy nhớ bật tính năng thanh toán cho dự án trên Google Cloud của bạn. Tìm hiểu cách xác minh trạng thái thanh toán cho dự án của bạn.

Thiết lập môi trường

Trước khi sử dụng các API của Google, bạn cần bật những API đó trong một dự án trên Google Cloud. Bạn có thể bật một hoặc nhiều API trong một dự án trên Google Cloud.

Trong bảng điều khiển của Google Cloud, hãy bật các API Google Chat, Cloud Build API, Cloud Functions API, Cloud Pub/Sub API, Cloud Logging API, Artifact Registry API và Cloud Run API.

Bật API

Tạo và triển khai hàm đám mây

Tạo và triển khai chức năng đám mây để tạo thẻ Chat có tên hiển thị và hình đại diện của người gửi. Khi nhận được tin nhắn, ứng dụng Chat sẽ chạy hàm này và phản hồi bằng thẻ.

Để tạo và triển khai chức năng này cho ứng dụng Chat, hãy hoàn tất các bước sau:

Node.js

Trong bảng điều khiển Google Cloud, hãy chuyển đến trang Cloud Functions:

Chuyển đến Cloud Functions

Đảm bảo bạn đã chọn dự án cho ứng dụng Chat.
Nhấp vào Create Function (Tạo hàm).
Trên trang Tạo hàm, hãy thiết lập hàm của bạn:
1. Trong mục Môi trường, hãy chọn Thế hệ thứ 2.
2. Trong mục Tên hàm, hãy nhập QuickStartChatApp.
3. Trong mục Khu vực, hãy chọn một khu vực.
4. Trong phần Xác thực, hãy chọn Cho phép lệnh gọi chưa được xác thực.
5. Nhấp vào Next (Tiếp theo).
Trong Runtime (Thời gian chạy), hãy chọn Node.js 20.
Trong Mã nguồn, hãy chọn Trình chỉnh sửa cùng dòng.
Trong mục Entry point, hãy xoá văn bản mặc định rồi nhập helloChat.

Thay thế nội dung của index.js bằng đoạn mã sau:

nút/avatar-app/index.js

Xem trên GitHub

/**
 * 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],
      }
    }],
  };
}

Nhấp vào Deploy (Triển khai).

Python

Trong bảng điều khiển Google Cloud, hãy chuyển đến trang Cloud Functions:

Chuyển đến Cloud Functions

Đảm bảo bạn đã chọn dự án cho ứng dụng Chat.
Nhấp vào Create Function (Tạo hàm).
Trên trang Tạo hàm, hãy thiết lập hàm của bạn:
1. Trong mục Tên hàm, hãy nhập QuickStartChatApp.
2. Trong mục Loại trình kích hoạt, hãy chọn HTTP.
3. Trong phần Xác thực, hãy chọn Cho phép lệnh gọi chưa được xác thực.
4. Nhấp vào Lưu.
5. Nhấp vào Next (Tiếp theo).
Trong Thời gian chạy, hãy chọn Python 3.10.
Trong Mã nguồn, hãy chọn Trình chỉnh sửa cùng dòng.
Trong mục Entry point, hãy xoá văn bản mặc định rồi nhập hello_chat.

Thay thế nội dung của main.py bằng đoạn mã sau:

python/avatar-app/main.py

Xem trên GitHub

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

Nhấp vào Deploy (Triển khai).

Java

Trong bảng điều khiển Google Cloud, hãy chuyển đến trang Cloud Functions:

Chuyển đến Cloud Functions

Đảm bảo bạn đã chọn dự án cho ứng dụng Chat.
Nhấp vào Create Function (Tạo hàm).
Trên trang Tạo hàm, hãy thiết lập hàm của bạn:
1. Trong mục Tên hàm, hãy nhập QuickStartChatApp.
2. Trong mục Loại trình kích hoạt, hãy chọn HTTP.
3. Trong phần Xác thực, hãy chọn Cho phép lệnh gọi chưa được xác thực.
4. Nhấp vào Lưu.
5. Nhấp vào Next (Tiếp theo).
Trong Thời gian chạy, hãy chọn Java 11.
Trong Mã nguồn, hãy chọn Trình chỉnh sửa cùng dòng.
Trong mục Entry point, hãy xoá văn bản mặc định rồi nhập HelloChat.
Đổi tên src/main/java/com/example/Example.java thành src/main/java/HelloChat.java.

Thay thế nội dung của HelloChat.java bằng đoạn mã sau:

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

Xem trên 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.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;
  }
}

Thay thế nội dung của pom.xml bằng đoạn mã sau:

java/avatar-app/pom.xml

Xem trên 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>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>

Nhấp vào Deploy (Triển khai).

Trang chi tiết về Chức năng đám mây sẽ mở ra, và chức năng của bạn sẽ xuất hiện cùng với 2 chỉ báo tiến trình: một chỉ báo cho bản dựng và một cho dịch vụ. Khi cả hai chỉ báo tiến trình biến mất và được thay thế bằng dấu kiểm, thì hàm của bạn đã được triển khai và sẵn sàng.

Phát hành ứng dụng lên Google Chat

Sau khi triển khai Hàm đám mây, hãy làm theo các bước sau để chuyển hàm này thành một ứng dụng Google Chat:

Trong bảng điều khiển Google Cloud, hãy nhấp vào biểu tượng Trình đơn > Cloud Functions.

Chuyển đến Cloud Functions

Đảm bảo rằng dự án mà bạn đã bật Chức năng đám mây đã được chọn.
Trong danh sách các hàm, hãy nhấp vào QuickStartChatApp.
Nhấp vào thẻ Điều kiện kích hoạt.
Trong HTTPS, hãy sao chép URL.
Tìm kiếm "API Google Chat" rồi nhấp vào API Google Chat, sau đó nhấp vào Quản lý.

Chuyển đến API Chat
Nhấp vào Cấu hình rồi thiết lập ứng dụng Google Chat:
1. Trong Tên ứng dụng, hãy nhập Quickstart App.
2. Trong URL hình đại diện, hãy nhập https://developers.google.com/chat/images/quickstart-app-avatar.png.
3. Trong phần Mô tả, hãy nhập Quickstart app.
4. Trong phần Chức năng, hãy chọn Nhận tin nhắn 1:1 rồi chọn Tham gia không gian và cuộc trò chuyện nhóm.
5. Trong phần Connection settings (Cài đặt kết nối), hãy chọn App URL (URL ứng dụng) rồi dán URL cho điều kiện kích hoạt Cloud Function vào hộp.
6. Trong phần Chế độ hiển thị, hãy chọn Cung cấp ứng dụng Google Chat này cho những người và nhóm cụ thể trong miền của bạn rồi nhập địa chỉ email.
7. Trong phần Logs (Nhật ký), hãy chọn Log error to Logging (Ghi nhật ký lỗi vào nhật ký).
Nhấp vào Lưu.

Ứng dụng Chat đã sẵn sàng nhận và trả lời tin nhắn trên Chat.

Kiểm thử ứng dụng Chat

Để kiểm thử ứng dụng Chat, hãy mở một không gian tin nhắn trực tiếp bằng ứng dụng Chat rồi gửi một tin nhắn:

Mở Google Chat bằng tài khoản Google Workspace mà bạn đã cung cấp khi tự thêm mình làm người kiểm tra đáng tin cậy.

Truy cập Google Chat
Nhấp vào Cuộc trò chuyện mới.
Trong trường Thêm 1 hoặc nhiều người, hãy nhập tên ứng dụng trong Chat.
Chọn ứng dụng Chat của bạn trong kết quả. Một tin nhắn trực tiếp sẽ mở ra.

Lưu ý: Nếu bạn không thấy ứng dụng Chat trong danh sách kết quả, hãy đảm bảo rằng bạn đã đưa tài khoản Google Workspace của mình vào phần cài đặt Chế độ hiển thị trên trang Cấu hình API Chat trong bảng điều khiển Google Cloud.
Trong tin nhắn trực tiếp mới với ứng dụng, hãy nhập Hello rồi nhấn phím enter.

Phản hồi của ứng dụng Chat chứa một tin nhắn thẻ hiển thị tên và hình đại diện của người gửi, như được minh hoạ trong hình sau:

Ứng dụng nhắn tin phản hồi bằng một thẻ có tên hiển thị và hình đại diện của người gửi

Để thêm người kiểm thử đáng tin cậy và tìm hiểu thêm về kiểm thử các tính năng tương tác, hãy xem phần Kiểm thử tính năng tương tác cho ứng dụng Google Chat.

Khắc phục sự cố

Khi ứng dụng Google Chat hoặc thẻ trả về lỗi, giao diện Chat sẽ hiển thị thông báo "Đã xảy ra lỗi." hoặc "Không thể xử lý yêu cầu của bạn". Đôi khi, giao diện người dùng của Chat không hiển thị thông báo lỗi nào, nhưng ứng dụng hoặc thẻ Chat cho ra kết quả không mong muốn; ví dụ: thông báo thẻ có thể không xuất hiện.

Mặc dù thông báo lỗi có thể không hiển thị trong giao diện người dùng Chat, nhưng chúng tôi cung cấp dữ liệu nhật ký và thông báo lỗi mô tả để giúp bạn khắc phục lỗi khi bật tính năng ghi nhật ký lỗi cho các ứng dụng trong Chat. Để được trợ giúp về việc xem, gỡ lỗi và sửa lỗi, hãy xem phần Khắc phục sự cố và sửa lỗi trên Google Chat.

Dọn dẹp

Để tài khoản Google Cloud của bạn không bị tính phí cho các tài nguyên dùng trong hướng dẫn này, bạn nên xoá dự án trên Google Cloud đó.

Thận trọng: Việc xoá dự án có các ảnh hưởng sau:

Mọi thứ trong dự án sẽ bị xoá. Nếu đã sử dụng một dự án hiện có cho phần hướng dẫn này, thì khi xoá dự án đó, bạn cũng xoá mọi công việc khác mà bạn đã thực hiện trong dự án đó.
Mã dự án tuỳ chỉnh bị mất. Khi tạo dự án này, có thể bạn đã tạo một mã dự án tuỳ chỉnh mà bạn sẽ muốn sử dụng trong tương lai. Để giữ lại các URL sử dụng mã dự án, chẳng hạn như URL trên appspot.com, hãy xoá các tài nguyên đã chọn trong dự án thay vì xoá toàn bộ dự án.

Nếu bạn định khám phá nhiều hướng dẫn và cách bắt đầu nhanh, thì việc sử dụng lại các dự án có thể giúp bạn tránh vượt quá hạn mức dự án.

Trong bảng điều khiển Google Cloud, hãy chuyển đến trang Quản lý tài nguyên. Nhấp vào biểu tượng Trình đơn > IAM & Admin (IAM và quản trị viên) > Quản lý tài nguyên.
Chuyển đến Trình quản lý tài nguyên
Trong danh sách dự án, hãy chọn dự án bạn muốn xoá rồi nhấp vào biểu tượng Xoá .
Trong hộp thoại, hãy nhập mã dự án rồi nhấp vào Shut Down (Tắt) để xoá dự án.

Chủ đề có liên quan

Để thêm các tính năng khác vào ứng dụng Chat, hãy xem các mục sau:
Chọn cấu trúc của ứng dụng Chat