Mengirim pesan kartu layar utama aplikasi untuk aplikasi Google Chat

Halaman ini menjelaskan cara membuat dan mengirim pesan kartu layar utama aplikasi untuk aplikasi Chat Anda. Beranda aplikasi adalah pesan kartu yang dapat disesuaikan dan dikirim oleh aplikasi Chat kepada pengguna saat mereka membuka pesan langsung dengan aplikasi Chat.

Kartu beranda aplikasi dengan dua pesan.

Misalnya, Anda dapat mengonfigurasi pesan kartu layar utama aplikasi guna menyertakan tips untuk berinteraksi dengan aplikasi Chat menggunakan perintah garis miring. Untuk pengguna akhir, beranda aplikasi hanya tersedia di pesan langsung aplikasi Chat jika developer aplikasi mengaktifkan fitur tersebut.


Gunakan Card Builder untuk mendesain dan melihat pratinjau pesan kartu JSON untuk aplikasi Chat:

Buka Pembuat Kartu

Prasyarat

Python

Apps Script

Konfigurasikan di Konsol Google Cloud

Python

  1. Di konsol Google Cloud, buka Menu > More products > Google Workspace > Product Library > Google Chat API.

    Buka Google Chat API

  2. Klik Manage, lalu klik tab Configuration.

  3. Aktifkan Beranda Aplikasi Dukungan.

  4. Pilih kotak centang Beranda Aplikasi Dukungan.

  5. Di kolom URL Beranda Aplikasi, tambahkan URL. Nilai ini biasanya adalah URL yang sama dengan App URL. URL ini dipanggil untuk peristiwa APP_HOME.

  6. Klik Save.

Apps Script

  1. Di konsol Google Cloud, buka Menu > More products > Google Workspace > Product Library > Google Chat API.

    Buka Google Chat API

  2. Klik Manage, lalu klik tab Configuration.

  3. Pilih kotak centang Beranda Aplikasi Dukungan.

  4. Klik Save.

Mengonfigurasi aplikasi Chat Anda

Konfigurasi aplikasi Chat Anda untuk mengirim pesan kartu baru untuk beranda aplikasi.

Python

Saat pengguna membuka pesan langsung dari aplikasi Chat, peristiwa APP_HOME akan dikirim ke aplikasi Chat Anda. Saat aplikasi Chat menerima peristiwa ini, instance JSON RenderActions ditampilkan dengan navigasi pushCard.

@app.route('/', methods=['POST'])
def on_event():
  event = request.get_json()
  chat = event.get('chat')
  if chat is not None:
    return handle_chat_event(event)

def handle_chat_event(event):
  if event['chat'].get('type') == 'APP_HOME':
    return get_app_home_card()

def get_app_home_card():
  return {
    "action": {
      "navigations": [
        {
          "pushCard": {
            "sections": [
              {
                "widgets": [
                  {
                    "buttonList": {
                      "buttons": [
                        {
                          "text": "Open documentation",
                          "onClick": {
                            "openLink": {
                              "url": "https://developers.google.com/chat"
                            }
                          }
                        }
                      ]
                    }
                  }
                ]
              }
            ]
          }
        }
      ]
    }
  }

Apps Script

Contoh ini mengirim pesan kartu dengan menampilkan JSON kartu. Anda juga dapat menggunakan layanan kartu Apps Script.

Implementasikan fungsi onAppHome untuk menampilkan instance JSON RenderActions dengan navigasi pushCard:

// "onAppHome" is the pre-defined name of the callback that the Chat servers
// execute.
function onAppHome() {
  return {
    action: {
      navigations: [
        {
          pushCard: getCard()
        }
      ]
    }
  };
}

function getCard() {
  return {
    sections: [
      {
        widgets: [
          {
            buttonList: {
              buttons: [
                {
                  text: "Open documentation",
                  onClick: {
                    openLink: {
                      url: "https://developers.google.com/chat"
                    }
                  }
                }
              ]
            }
          }
        ]
      }
    ]
  };
}

Memperbarui pesan kartu layar utama aplikasi

Pesan kartu layar utama aplikasi dapat diperbarui saat pengguna mengirimkan informasi dalam pesan kartu atau menutup dialog. Misalnya, pesan kartu layar utama aplikasi awal adalah pesan selamat datang yang meminta pengguna untuk mengisi formulir dengan informasi. Setelah pengguna melengkapi formulir, pesan kartu layar utama aplikasi yang telah diperbarui akan dikirim. Update harus ditampilkan dengan instance RenderActions yang berisi navigasi updateCard.

Python

Untuk aplikasi HTTP, memperbarui pesan kartu layar utama aplikasi mirip dengan Memproses informasi yang dimasukkan oleh pengguna, tetapi Anda harus menampilkan RenderActions. invokedFunction merepresentasikan nama fungsi yang dipanggil yang terkait dengan widget Card. Untuk mengetahui informasi selengkapnya, lihat CommonEventObject. Dalam contoh berikut, submitForm menunjukkan bahwa pengguna telah mengirimkan data formulir:

@app.route('/', methods=['POST'])
def on_event():
  event = request.get_json()
  chat = event.get('chat')
  if chat is not None:
    return handle_chat_event(event)

def handle_chat_event(event):
  if event['chat'].get('type') == 'SUBMIT_FORM':
    event_object = event.get('commonEventObject')
    if event_object is not None:
      // Forms
      if 'submitForm' == event_object.get('invokedFunction'):
        return {
          'render_actions': {
            'action': {
              'navigations': [{
                'updateCard': get_update_card()
              }]
            }
          }
        }

def get_update_card():
  return {
      "action": {
          "navigations": [{
              "pushCard": {
                  "sections": [{
                      "widgets": [{
                          "buttonList": {
                              "buttons": [{
                                  "text": "Open documentation",
                                  "onClick": {
                                      "openLink": {
                                          "url": "https://developers.google.com/chat"
                                      }
                                  },
                              }]
                          }
                      }]
                  }]
              }
          }]
      }
  }

Apps Script

Contoh ini mengirim pesan kartu dengan menampilkan JSON kartu. Anda juga dapat menggunakan layanan kartu Apps Script.

// Called from elsewhere (i.e. on button press).
function updateAppHomeCard(event) {
  return {
    render_actions: {
      action: {
        navigations: [
          {
            updateCard: getCard()
          }
        ]
      }
    }
  }
}

function getCard() {
  return {
    sections: [
      {
        widgets: [
          {
            buttonList: {
              buttons: [
                {
                  text: "Open documentation",
                  onClick: {
                    openLink: {
                      url: "https://developers.google.com/chat"
                    }
                  }
                }
              ]
            }
          }
        ]
      }
    ]
  };
}

Batasan

Secara umum, navigation tidak tersedia untuk aplikasi Chat. Anda tidak dapat menampilkan tumpukan kartu. Hanya pushCard (untuk respons awal) dan updateCard (untuk update) yang tersedia untuk aplikasi Chat.