Memproses informasi yang dimasukkan oleh pengguna

Panduan ini menjelaskan cara menerima dan membaca informasi yang dimasukkan pengguna pesan kartu dan dialog. Pengguna dapat memasukkan data yang diterima, dibaca, dan direspons oleh aplikasi Chat tempat mesin terhubung. Widget yang memungkinkan pengguna memasukkan informasi meliputi:

• TextInput untuk entri teks bentuk bebas yang juga mendukung saran.
• SelectionInput untuk item daftar dan menu, seperti kotak centang, tombol pilihan, dan menu {i>drop-down<i}.
• DateTimePicker untuk entri tanggal dan waktu.

---

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

Membuka Card Builder

---

Menerima input data dari pengguna memungkinkan aplikasi Chat melakukan hal-hal seperti hal berikut:

• Memperbarui kasus layanan pelanggan.
• Membuat perintah kerja.
• Melakukan autentikasi dengan layanan web.

Prasyarat

Catatan: Untuk Node.js dan Python, contoh kode dalam panduan ini ditulis untuk dijalankan sebagai Google Cloud Function.

Node.js

Aplikasi Google Chat yang diaktifkan untuk fitur interaktif. Untuk membuat aplikasi Chat interaktif menggunakan layanan HTTP, selesaikan panduan memulai ini.

Apps Script

Aplikasi Google Chat yang diaktifkan untuk fitur interaktif. Untuk membuat aplikasi Chat interaktif di Apps Script, selesaikan panduan memulai ini.

Python

Aplikasi Google Chat yang diaktifkan untuk fitur interaktif. Untuk membuat aplikasi Chat interaktif menggunakan layanan HTTP, selesaikan panduan memulai ini.

Cara kerja penerimaan data

Aplikasi Chat menyajikan informasi kepada pengguna sebagai dialog atau pesan kartu. Dalam contoh ini, dialog meminta pengguna untuk memasukkan informasi tentang kontak menggunakan TextInput dan SelectionInput widget:

Setelah selesai, aplikasi Chat menerima data yang yang dimasukkan pengguna ke dalam dialog dalam format JSON dan peristiwa interaksi saat:

• EventType adalah CARD_CLICKED.
• DialogEventType adalah SUBMIT_DIALOG (hanya untuk dialog).

Untuk mendapatkan data tentang apa yang dimasukkan pengguna, gunakan Event.common.formInputs di payload peristiwa. Kolom formInputs adalah peta tempat kunci berada ID string yang ditetapkan untuk setiap widget dan nilai yang mewakili input pengguna untuk setiap widget. Objek yang berbeda mewakili tipe data input yang berbeda. Sebagai contoh, Event.common.formInputs.stringInputs merepresentasikan input string.

Aplikasi Anda dapat mengakses nilai pertama yang dimasukkan pengguna di event.common.formInputs.NAME.stringInputs.value[0], dengan NAME adalah kolom name dari Widget TextInput.

Jika aplikasi Chat Anda dibuat dengan Apps Script, gunakan event.common.formInputs.NAME[""].stringInputs.value[0] sebagai gantinya.

Menerima data dari kartu

Saat pengguna memasukkan data dalam pesan kartu, Aplikasi Chat menerima aplikasi Chat peristiwa interaksi, seperti contoh berikut:

JSON

{
  "type": enum (EventType),
  "eventTime": string,
  "threadKey": string,
  "message": {
    object (Message)
  },
  "user": {
    object (User)
  },
  "space": {
    object (Space)
  },
  "action": {
    object (FormAction)
  },
  "configCompleteRedirectUrl": string,
  "common": {

    // Represents user data entered in a card.
    "formInputs": {

      // Represents user data entered for a specific field in a card.
      "NAME": {

        // Represents string data entered in a card, like text input fields
        // and check boxes.
        "stringInputs": {

          // An array of strings entered by the user in a card.
          "value": [
            string
          ]
        }
      }
    },
    "parameters": {
      string: string,
      ...
    },
    "invokedFunction": string
  }
}

Menerima data dari dialog

Saat pengguna mengirimkan data dalam dialog, aplikasi Chat Anda menerima peristiwa interaksi aplikasi Chat lainnya, seperti contoh berikut:

JSON

{
  "type": enum (EventType),
  "eventTime": string,
  "threadKey": string,
  "message": {
    object (Message)
  },
  "user": {
    object (User)
  },
  "space": {
    object (Space)
  },
  "action": {
    object (FormAction)
  },
  "configCompleteRedirectUrl": string,

  // Indicates that this event is dialog-related.
  "isDialogEvent": true,

  // Indicates that a user clicked a button, and all data
  // they entered in the dialog is included in Event.common.formInputs.
  "dialogEventType": "SUBMIT_DIALOG",
  "common": {
    "userLocale": string,
    "hostApp": enum (HostApp),
    "platform": enum (Platform),
    "timeZone": {
      object (TimeZone)
    },

    // Represents user data entered in a dialog.
    "formInputs": {

      // Represents user data entered for a specific field in a dialog.
      "NAME": {

        // Represents string data entered in a dialog, like text input fields
        // and check boxes.
        "stringInputs": {

          // An array of strings entered by the user in a dialog.
          "value": [
            string
          ]
        }
      }
    },
    "parameters": {
      string: string,
      ...
    },
    "invokedFunction": string
  }
}

Tanggapi data yang dikumpulkan dari dialog atau pesan kartu

Setelah menerima data dari pesan atau dialog kartu, Aplikasi Chat merespons dengan mengonfirmasi tanda terima atau dengan mengembalikan {i>error<i}, yang keduanya dilakukan dengan cara mengembalikan ActionResponse:

• Untuk mengonfirmasi bahwa tanda terima berhasil diterima, balas dengan menyertakan ActionResponse yang memiliki "actionStatus": "OK".
• Untuk menampilkan error, respons dengan ActionResponse yang memiliki "actionStatus": "ERROR MESSAGE".

Contoh

Contoh berikut memeriksa keberadaan nilai name. Jika tidak ada, aplikasi menampilkan error. Jika ada, aplikasi akan mengonfirmasi penerimaan data formulir dan menutup dialog.

Node.js

/**
 * Checks for a form input error, the absence of
 * a "name" value, and returns an error if absent.
 * Otherwise, confirms successful receipt of a dialog.
 *
 * Confirms successful receipt of a dialog.
 *
 * @param {Object} event the event object from Chat API.
 *
 * @return {object} open a Dialog in Google Chat.
 */
function receiveDialog(event) {

  // Checks to make sure the user entered a name
  // in a dialog. If no name value detected, returns
  // an error message.
  if (event.common.formInputs.WIDGET_NAME.stringInputs.value[0] == "") {
    res.json({
      "actionResponse": {
        "type": "DIALOG",
        "dialogAction": {
          "actionStatus": "Don't forget to name your new contact!"
        }
      }
    });

  // Otherwise the app indicates that it received
  // form data from the dialog. Any value other than "OK"
  // gets returned as an error. "OK" is interpreted as
  // code 200, and the dialog closes.
  } else {
    res.json({
      "actionResponse": {
        "type": "DIALOG",
        "dialogAction": {
          "actionStatus": "OK"
        }
      }
    });
  }
}

Apps Script

Contoh ini mengirimkan pesan kartu dengan mengembalikan JSON kartu. Anda juga dapat menggunakan Layanan kartu Apps Script.

/**
 * Checks for a form input error, the absence of
 * a "name" value, and returns an error if absent.
 * Otherwise, confirms successful receipt of a dialog.
 *
 * Confirms successful receipt of a dialog.
 *
 * @param {Object} event the event object from Chat API.
 *
 * @return {object} open a Dialog in Google Chat.
 */
function receiveDialog(event) {

  // Checks to make sure the user entered a name
  // in a dialog. If no name value detected, returns
  // an error message.
  if (event.common.formInputs.WIDGET_NAME[""].stringInputs.value[0] == "") {
    return {
      "actionResponse": {
        "type": "DIALOG",
        "dialogAction": {
          "actionStatus": "Don't forget to name your new contact!"
        }
      }
    };

  // Otherwise the app indicates that it received
  // form data from the dialog. Any value other than "OK"
  // gets returned as an error. "OK" is interpreted as
  // code 200, and the dialog closes.
  } else {
    return {
      "actionResponse": {
        "type": "DIALOG",
        "dialogAction": {
          "actionStatus": "OK"
        }
      }
    };
  }
}

Python

def receive_dialog(event: Mapping[str, Any]) -> Mapping[str, Any]:
  """Checks for a form input error, the absence of a "name" value, and returns
     an error if absent. Otherwise, confirms successful receipt of a dialog.

  Args:
      event (Mapping[str, Any]): the event object from Chat API.

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

  if common := event.get('common'):
    if form_inputs := common.get('formInputs'):
      if contact_name := form_inputs.get('WIDGET_NAME'):
        if string_inputs := contact_name.get('stringInputs'):
          if name := string_inputs.get('value')[0]:
            return {
              'actionResponse': {
                'type': 'DIALOG',
                'dialogAction': {
                  'actionStatus': 'OK'
                }
              }
            }
          else:
            return {
              'actionResponse': {
                'type': 'DIALOG',
                'dialogAction': {
                  'actionStatus': 'Don\'t forget to name your new contact!'
                }
              }
            }

Memecahkan masalah

Saat aplikasi Google Chat atau kartu menampilkan error, Antarmuka Chat menampilkan pesan yang bertuliskan "Terjadi masalah". atau "Tidak dapat memproses permintaan Anda". Terkadang UI Chat tidak menampilkan pesan error apa pun, tetapi aplikasi Chat atau memberikan hasil yang tidak diharapkan; misalnya, pesan kartu mungkin tidak akan muncul.

Meskipun pesan error mungkin tidak ditampilkan di UI Chat, pesan error deskriptif dan data log tersedia untuk membantu Anda memperbaiki error saat logging error untuk aplikasi Chat diaktifkan. Untuk bantuan melihat, men-debug, dan memperbaiki error, melihat Memecahkan masalah dan memperbaiki error Google Chat.