Собирайте и обрабатывайте информацию от пользователей Google Chat.

В этом руководстве описывается, как приложения Google Chat могут собирать и обрабатывать информацию от пользователей, создавая поля ввода форм в интерфейсах на основе карточек.

Диалоговое окно с различными виджетами.
Рисунок 1 : Приложение для чата, открывающее диалоговое окно для сбора контактной информации.

Приложения для чата запрашивают у пользователей информацию для выполнения действий внутри или вне чата, в том числе следующими способами:

  • Настройте параметры. Например, позвольте пользователям настраивать параметры уведомлений или настройте и добавьте приложение «Чат» в одно или несколько пространств.
  • Создавайте или обновляйте информацию в других приложениях Google Workspace. Например, позвольте пользователям создавать события в Google Календаре.
  • Предоставьте пользователям доступ к ресурсам других приложений или веб-сервисов и возможность их обновления. Например, приложение для чата может помочь пользователям обновлять статус заявки в службу поддержки непосредственно из чата.

Предпосылки

HTTP

Надстройка для Google Workspace, расширяющая возможности Google Chat. Чтобы создать её, выполните краткое руководство по HTTP .

Скрипт приложений

Надстройка для Google Workspace, расширяющая возможности Google Chat. Чтобы создать её, выполните краткое руководство по Apps Script .

Создавайте формы с помощью карточек.

Для сбора информации чат-приложения разрабатывают формы и поля ввода, а затем встраивают их в карточки. Для отображения карточек пользователям чат-приложения могут использовать следующие интерфейсы чата:

  • Сообщения в чате, содержащие одну или несколько карточек.
  • Диалоговые окна — это карточки, которые открываются в новом окне из сообщений и с главных страниц сайтов.

В чат-приложениях для создания карточек можно использовать следующие виджеты:

  • Виджеты ввода форм, запрашивающие информацию у пользователей. При желании можно добавить проверку данных в виджеты ввода форм, чтобы убедиться, что пользователи вводят и форматируют информацию правильно. В чат-приложениях можно использовать следующие виджеты ввода форм:

    • Поля ввода текста ( textInput ) для ввода произвольного текста или предлагаемых вариантов.
    • Элементы ввода выбора ( selectionInput ) — это выбираемые элементы пользовательского интерфейса, такие как флажки, переключатели и выпадающие меню. Виджеты ввода выбора также могут заполнять и предлагать элементы из данных Google Workspace (например, из пространства чата) или динамического источника данных. Подробнее см. в следующем разделе «Добавление меню с множественным выбором» .

    • Элементы выбора даты и времени ( dateTimePicker ) для ввода даты и времени.

  • Кнопка- виджет, позволяющая пользователям вводить значения, указанные в карточке. После нажатия кнопки приложение чата может обработать полученную информацию .

В следующем примере карточка собирает контактную информацию с помощью текстового поля ввода, поля выбора даты и времени, а также поля для выбора:

Дополнительные примеры интерактивных виджетов, которые можно использовать для сбора информации, см. в разделе «Создание интерактивной карточки или диалогового окна» в документации Google Chat API.

Добавить меню с возможностью множественного выбора

Для настройки элементов выбора или предоставления пользователям возможности выбирать элементы из динамического источника данных, приложения чата могут использовать меню с множественным выбором, которые являются разновидностью виджета SelectionInput . Например, на следующей карточке отображается меню с множественным выбором, где пользователи могут динамически выбирать из списка контактов:

Для заполнения пунктов меню с множественным выбором можно использовать следующие источники данных:

  • Данные Google Workspace , включая пользователей или чаты, участником которых является пользователь. Меню отображает только элементы из той же организации Google Workspace.
  • Внешние источники данных , такие как реляционная база данных. Например, вы можете использовать меню с множественным выбором, чтобы помочь пользователю выбрать потенциальных клиентов из списка в системе управления взаимоотношениями с клиентами (CRM).

Заполнение элементов данными из источника Google Workspace.

Для использования источников данных Google Workspace укажите поле platformDataSource в виджете SelectionInput . В отличие от других типов ввода выбора, объекты SelectionItem здесь не указываются, поскольку эти элементы выбора динамически загружаются из Google Workspace.

Следующий код демонстрирует меню с множественным выбором пользователей Google Workspace. Для заполнения списка пользователей поле выбора устанавливает commonDataSource в USER :

JSON

{
  "selectionInput": {
    "name": "contacts",
    "type": "MULTI_SELECT",
    "label": "Selected contacts",
    "multiSelectMaxSelectedItems": 5,
    "multiSelectMinQueryLength": 1,
    "platformDataSource": {
      "commonDataSource": "USER"
    }
  }
}

Следующий код демонстрирует меню с множественным выбором для чат-пространств. Для заполнения пространств поле выбора задает значение поля hostAppDataSource . Меню с множественным выбором также устанавливает defaultToCurrentSpace в true , что делает текущее пространство выбором по умолчанию в меню:

JSON

{
  "selectionInput": {
    "name": "spaces",
    "type": "MULTI_SELECT",
    "label": "Selected contacts",
    "multiSelectMaxSelectedItems": 3,
    "multiSelectMinQueryLength": 1,
    "platformDataSource": {
      "hostAppDataSource": {
        "chatDataSource": {
          "spaceDataSource": {
            "defaultToCurrentSpace": true
          }
        }
      }
    }
  }
}

Заполнение элементов данными из внешнего источника.

В меню с множественным выбором также можно заполнять элементы из стороннего или внешнего источника данных. Для использования внешнего источника данных необходимо указать поле externalDataSource в виджете SelectionInput , содержащем функцию, которая запрашивает данные из этого источника и возвращает из него элементы.

Чтобы уменьшить количество запросов к внешнему источнику данных, можно включить предлагаемые элементы, которые появляются в меню множественного выбора до того, как пользователи начнут вводить текст. Например, можно заполнить список недавно найденных контактов пользователя. Для заполнения предлагаемых элементов из внешнего источника данных укажите статические объекты SelectionItem .

Приведенный ниже пример кода демонстрирует меню с множественным выбором, которое запрашивает и заполняет элементы из внешнего источника данных:

Node.js

node/chat/selection-input/index.js
selectionInput: {
  name: "contacts",
  type: "MULTI_SELECT",
  label: "Selected contacts",
  multiSelectMaxSelectedItems: 3,
  multiSelectMinQueryLength: 1,
  externalDataSource: { function: FUNCTION_URL },
  // Suggested items loaded by default.
  // The list is static here but it could be dynamic.
  items: [getSuggestedContact("3")]
}

Замените FUNCTION_URL на HTTP-адрес конечной точки, которая запрашивает данные из внешнего источника.

Python

python/chat/selection-input/main.py
'selectionInput': {
  'name': "contacts",
  'type': "MULTI_SELECT",
  'label': "Selected contacts",
  'multiSelectMaxSelectedItems': 3,
  'multiSelectMinQueryLength': 1,
  'externalDataSource': { 'function': FUNCTION_URL },
  # Suggested items loaded by default.
  # The list is static here but it could be dynamic.
  'items': [get_suggested_contact("3")]
}

Замените FUNCTION_URL на HTTP-адрес конечной точки, которая запрашивает данные из внешнего источника.

Java

java/chat/selection-input/src/main/java/com/google/chat/selectionInput/App.java
.setSelectionInput(new GoogleAppsCardV1SelectionInput()
  .setName("contacts")
  .setType("MULTI_SELECT")
  .setLabel("Selected contacts")
  .setMultiSelectMaxSelectedItems(3)
  .setMultiSelectMinQueryLength(1)
  .setExternalDataSource(new GoogleAppsCardV1Action().setFunction(FUNCTION_URL))
  // Suggested items loaded by default.
  // The list is static here but it could be dynamic.
  .setItems(List.of(getSuggestedContact("3")))))))))));

Замените FUNCTION_URL на HTTP-адрес конечной точки, которая запрашивает данные из внешнего источника.

Скрипт приложений

В этом примере отправляется сообщение в виде карточки, возвращая JSON-объект с именем карточки . Вы также можете использовать службу создания карточек Apps Script .

apps-script/chat/selection-input/selection-input.gs
selectionInput: {
  name: "contacts",
  type: "MULTI_SELECT",
  label: "Selected contacts",
  multiSelectMaxSelectedItems: 3,
  multiSelectMinQueryLength: 1,
  externalDataSource: { function: "queryContacts" },
  // Suggested items loaded by default.
  // The list is static here but it could be dynamic.
  items: [getSuggestedContact("3")]
}

Полный пример, демонстрирующий, как отображать предлагаемые элементы, см. в разделе «Предложить элементы для множественного выбора ».

Получайте данные из интерактивных виджетов.

При каждом нажатии пользователем кнопки запускается соответствующее действие чат-приложения, содержащее информацию о взаимодействии. В объекте commonEventObject полезной нагрузки события formInputs содержит все значения, введенные пользователем.

Значения можно получить из объекта commonEventObject.formInputs. WIDGET_NAME , где WIDGET_NAME — это name поля, указанное вами для виджета. Значения возвращаются в виде данных определенного типа для виджета.

Ниже показан фрагмент объекта события, в котором пользователь ввел значения для каждого виджета:

{
  "commonEventObject": { "formInputs": {
    "contactName": { "stringInputs": {
      "value": ["Kai 0"]
    }},
    "contactBirthdate": { "dateInput": {
      "msSinceEpoch": 1000425600000
    }},
    "contactType": { "stringInputs": {
      "value": ["Personal"]
    }}
  }}
}

Для получения данных ваше приложение чата обрабатывает объект события, чтобы получить значения, которые пользователи вводят в виджеты. В следующей таблице показано, как получить значение для конкретного виджета ввода формы. Для каждого виджета в таблице указан тип данных, которые принимает виджет, где значение хранится в объекте события, и пример значения.

Виджет ввода формы Тип входных данных Входное значение из объекта события Пример значения
textInput stringInputs event.commonEventObject.formInputs.contactName.stringInputs.value[0] Kai O
selectionInput stringInputs Чтобы получить первое или единственное значение, event.commonEventObject.formInputs.contactType.stringInputs.value[0] Personal
dateTimePicker , принимающий только даты. dateInput event.commonEventObject.formInputs.contactBirthdate.dateInput.msSinceEpoch . 1000425600000

После получения данных приложение «Чат» может выполнить любое из следующих действий:

Предложить варианты для множественного выбора

Если карточка содержит меню с множественным выбором, заполняемое данными из внешнего источника , приложение «Чат» может предлагать варианты на основе того, что пользователь вводит в меню. Например, если пользователь начинает вводить Atl в меню, отображающем города США, ваше приложение «Чат» может автоматически предложить Atlanta еще до того, как пользователь закончит ввод. Приложение «Чат» может предложить до 100 вариантов.

Для того чтобы предлагать и динамически заполнять элементы в меню с множественным выбором, виджет SelectionInput на карточке должен указывать функцию, которая запрашивает данные из внешнего источника . Для возврата предлагаемых элементов функция должна выполнять следующие действия:

  1. Обработайте объект события , который получает приложение «Чат», когда пользователи вводят текст в меню.
  2. Из объекта события получите значение, которое вводит пользователь, представленное в поле event.commonEventObject.parameters["autocomplete_widget_query"] .
  3. Выполните запрос к источнику данных, используя введенное пользователем значение, чтобы получить один или несколько SelectionItems для предложения пользователю.
  4. Для возврата предлагаемых элементов используйте действие RenderActions , содержащее объект modifyCard .

Приведенный ниже пример кода демонстрирует, как приложение чата динамически предлагает элементы в меню с множественным выбором на карточке. Когда пользователь вводит текст в меню, функция или конечная точка, указанная в поле externalDataSource виджета, запрашивает данные из внешнего источника и предлагает элементы, которые пользователь может выбрать.

Node.js

node/chat/selection-input/index.js
/**
 * Web app that responds to events sent from a Google Chat space.
 *
 * @param {Object} req Request sent from Google Chat space
 * @param {Object} res Response to send back
 */
app.post('/', async (req, res) => {
  // Stores the Google Chat event
  const chatEvent = req.body.chat;

  // Handle user interaction with multiselect.
  if(chatEvent.widgetUpdatedPayload) {
    return res.json(queryContacts(req.body));
  }

  // Replies with a card that contains the multiselect menu.
  return res.json({ hostAppDataAction: { chatDataAction: { createMessageAction: { message: {
    cardsV2: [{
      cardId: "contactSelector",
      card: { sections:[{ widgets: [{
        selectionInput: {
          name: "contacts",
          type: "MULTI_SELECT",
          label: "Selected contacts",
          multiSelectMaxSelectedItems: 3,
          multiSelectMinQueryLength: 1,
          externalDataSource: { function: FUNCTION_URL },
          // Suggested items loaded by default.
          // The list is static here but it could be dynamic.
          items: [getSuggestedContact("3")]
        }
      }]}]}
    }]
  }}}}});
});

/**
 * Get contact suggestions based on text typed by users.
 *
 * @param {Object} event the event object that contains the user's query
 * @return {Object} suggestions
 */
function queryContacts(event) {
  const query = event.commonEventObject.parameters["autocomplete_widget_query"];
  return { action: { modifyOperations: [{ updateWidget: { selectionInputWidgetSuggestions: { suggestions: [
    // The list is static here but it could be dynamic.
    getSuggestedContact("1"), getSuggestedContact("2"), getSuggestedContact("3"), getSuggestedContact("4"), getSuggestedContact("5")
  // Only return items based on the query from the user.
  ].filter(e => !query || e.text.includes(query)) }}}]}};
}

/**
 * Generate a suggested contact given an ID.
 *
 * @param {String} id The ID of the contact to return.
 * @return {Object} The contact formatted as a selection item in the menu.
 */
function getSuggestedContact(id) {
  return {
    value: id,
    startIconUri: "https://www.gstatic.com/images/branding/product/2x/contacts_48dp.png",
    text: "Contact " + id
  };
}

Замените FUNCTION_URL на HTTP-адрес конечной точки, которая запрашивает данные из внешнего источника.

Python

python/chat/selection-input/main.py
@app.route('/', methods=['POST'])
def post() -> Mapping[str, Any]:
  """Handle requests from Google Chat

  Returns:
      Mapping[str, Any]: The response
  """
  # Stores the Google Chat event
  chatEvent = request.get_json().get('chat')

  # Handle user interaction with multiselect.
  if chatEvent.get('widgetUpdatedPayload') is not None:
    return json.jsonify(query_contacts(request.get_json()))

  # Replies with a card that contains the multiselect menu.
  return json.jsonify({ 'hostAppDataAction': { 'chatDataAction': { 'createMessageAction': {
    'message': { 'cardsV2': [{
      'cardId': "contactSelector",
      'card': { 'sections':[{ 'widgets': [{
        'selectionInput': {
          'name': "contacts",
          'type': "MULTI_SELECT",
          'label': "Selected contacts",
          'multiSelectMaxSelectedItems': 3,
          'multiSelectMinQueryLength': 1,
          'externalDataSource': { 'function': FUNCTION_URL },
          # Suggested items loaded by default.
          # The list is static here but it could be dynamic.
          'items': [get_suggested_contact("3")]
        }
      }]}]}
    }]}
  }}}})


def query_contacts(event: dict) -> dict:
  """Get contact suggestions based on text typed by users.

  Args:
      event (Mapping[str, Any]): The event object that contains the user's query

  Returns:
      Mapping[str, Any]: The response with contact suggestions.
  """
  query = event.get("commonEventObject").get("parameters").get("autocomplete_widget_query")
  return { 'action': { 'modifyOperations': [{ 'updateWidget': { 'selectionInputWidgetSuggestions': { 'suggestions': list(
    filter(lambda e: query is None or query in e["text"], [
      # The list is static here but it could be dynamic.
      get_suggested_contact("1"), get_suggested_contact("2"), get_suggested_contact("3"), get_suggested_contact("4"), get_suggested_contact("5")
    # Only return items based on the query from the user
    ])
  )}}}]}}


def get_suggested_contact(id: str) -> dict:
  """Generate a suggested contact given an ID.

  Args:
      id (str): The ID of the contact to return.

  Returns:
      Mapping[str, Any]: The contact formatted as a selection item in the menu.
  """
  return {
    'value': id,
    'startIconUri': "https://www.gstatic.com/images/branding/product/2x/contacts_48dp.png",
    'text': "Contact " + id
  }

Замените FUNCTION_URL на HTTP-адрес конечной точки, которая запрашивает данные из внешнего источника.

Java

java/chat/selection-input/src/main/java/com/google/chat/selectionInput/App.java
@SpringBootApplication
@RestController
// Web app that responds to events sent from a Google Chat space.
public class App {
  private static final String FUNCTION_URL = "your-function-url";

  public static void main(String[] args) {
    SpringApplication.run(App.class, args);
  }

  /**
   * Handle requests from Google Chat
   * 
   * @param event the event object sent by Google Chat
   * @return The response to be sent back to Google Chat
   */
  @PostMapping("/")
  @ResponseBody
  public GenericJson onEvent(@RequestBody JsonNode event) throws Exception {
    // Stores the Google Chat event
    JsonNode chatEvent = event.at("/chat");

    // Handle user interaction with multiselect.
    if (!chatEvent.at("/widgetUpdatedPayload").isEmpty()) {
      return queryContacts(event);
    }

    // Replies with a card that contains the multiselect menu.
    Message message = new Message().setCardsV2(List.of(new CardWithId()
      .setCardId("contactSelector")
      .setCard(new GoogleAppsCardV1Card()
        .setSections(List.of(new GoogleAppsCardV1Section().setWidgets(List.of(new GoogleAppsCardV1Widget()
          .setSelectionInput(new GoogleAppsCardV1SelectionInput()
            .setName("contacts")
            .setType("MULTI_SELECT")
            .setLabel("Selected contacts")
            .setMultiSelectMaxSelectedItems(3)
            .setMultiSelectMinQueryLength(1)
            .setExternalDataSource(new GoogleAppsCardV1Action().setFunction(FUNCTION_URL))
            // Suggested items loaded by default.
            // The list is static here but it could be dynamic.
            .setItems(List.of(getSuggestedContact("3")))))))))));

    return new GenericJson() {{
      put("hostAppDataAction", new GenericJson() {{
        put("chatDataAction", new GenericJson() {{
          put("createMessageAction", new GenericJson() {{
            put("message", message);
          }});
        }});
      }});
    }};
  }

  /**
   * Get contact suggestions based on text typed by users.
   *
   * @param event the event object that contains the user's query.
   * @return The response with contact suggestions.
   */
  GenericJson queryContacts(JsonNode event) throws Exception {
    String query = event.at("/commonEventObject/parameters/autocomplete_widget_query").asText();
    List<GoogleAppsCardV1SelectionItem> suggestions = List.of(
      // The list is static here but it could be dynamic.
      getSuggestedContact("1"), getSuggestedContact("2"), getSuggestedContact("3"), getSuggestedContact("4"), getSuggestedContact("5")
    // Only return items based on the query from the user
    ).stream().filter(e -> query == null || e.getText().indexOf(query) > -1).toList();

    return new GenericJson() {{
      put("action", new GenericJson() {{
        put("modifyOperations", List.of(new GenericJson() {{
          put("updateWidget", new GenericJson() {{
            put("selectionInputWidgetSuggestions", new GenericJson() {{
              put("suggestions", suggestions);
            }});
          }});
        }}));
      }});
    }};
  }

  /**
   * Generate a suggested contact given an ID.
   * 
   * @param id The ID of the contact to return.
   * @return The contact formatted as a selection item in the menu.
   */
  GoogleAppsCardV1SelectionItem getSuggestedContact(String id) {
    return new GoogleAppsCardV1SelectionItem()
      .setValue(id)
      .setStartIconUri("https://www.gstatic.com/images/branding/product/2x/contacts_48dp.png")
      .setText("Contact " + id);
  }
}

Замените FUNCTION_URL на HTTP-адрес конечной точки, которая запрашивает данные из внешнего источника.

Скрипт приложений

В этом примере отправляется сообщение в виде карточки, возвращая JSON-объект с именем карточки . Вы также можете использовать службу создания карточек Apps Script .

apps-script/chat/selection-input/selection-input.gs
/**
* Responds to a Message trigger in Google Chat.
*
* @param {Object} event the event object from Google Chat
* @return {Object} Response from the Chat app.
*/
function onMessage(event) {
  // Replies with a card that contains the multiselect menu.
  return { hostAppDataAction: { chatDataAction: { createMessageAction: { message: {
    cardsV2: [{
      cardId: "contactSelector",
      card: { sections:[{ widgets: [{
        selectionInput: {
          name: "contacts",
          type: "MULTI_SELECT",
          label: "Selected contacts",
          multiSelectMaxSelectedItems: 3,
          multiSelectMinQueryLength: 1,
          externalDataSource: { function: "queryContacts" },
          // Suggested items loaded by default.
          // The list is static here but it could be dynamic.
          items: [getSuggestedContact("3")]
        }
      }]}]}
    }]
  }}}}};
}

/**
* Get contact suggestions based on text typed by users.
*
* @param {Object} event the event object that contains the user's query
* @return {Object} suggestions
*/
function queryContacts(event) {
  const query = event.commonEventObject.parameters["autocomplete_widget_query"];
  return { action: { modifyOperations: [{ updateWidget: { selectionInputWidgetSuggestions: { suggestions: [
    // The list is static here but it could be dynamic.
    getSuggestedContact("1"), getSuggestedContact("2"), getSuggestedContact("3"), getSuggestedContact("4"), getSuggestedContact("5")
  // Only return items based on the query from the user.
  ].filter(e => !query || e.text.includes(query)) }}}]}};
}

/**
* Generate a suggested contact given an ID.
*
* @param {String} id The ID of the contact to return.
* @return {Object} The contact formatted as a selection item in the menu.
*/
function getSuggestedContact(id) {
  return {
    value: id,
    startIconUri: "https://www.gstatic.com/images/branding/product/2x/contacts_48dp.png",
    text: "Contact " + id
  };
}

Перенесите данные на другую карту

После того, как пользователь введёт информацию с карты, вам может потребоваться вернуть дополнительные карты для выполнения любого из следующих действий:

  • Помогите пользователям заполнять более длинные формы, создав для них отдельные разделы.
  • Предоставьте пользователям возможность предварительного просмотра и подтверждения информации из первоначальной карточки, чтобы они могли проверить свои ответы перед отправкой.
  • Динамически заполняйте оставшиеся части формы. Например, чтобы предложить пользователям записаться на прием, приложение для чата может отобразить начальную карточку с вопросом о причине записи, а затем отобразить другую карточку с доступным временем в зависимости от типа записи.

Для переноса данных, введенных из исходной карточки, можно создать виджет button с actionParameters , содержащими name виджета и значение, введенное пользователем, как показано в следующем примере:

Node.js

node/chat/contact-form-app/index.js
{ buttonList: { buttons: [{
  text: "SUBMIT",
  onClick: { action: {
    function: FUNCTION_URL,
    parameters: [
      { key: "actionName", value: "submitDialog" },
      // Pass input values as parameters for last dialog step (submission)
      { key: "contactName", value: name },
      { key: "contactBirthdate", value: birthdate },
      { key: "contactType", value: type }
    ]
  }}
}]}}

Замените FUNCTION_URL на HTTP-адрес конечной точки, обрабатывающей нажатия кнопок.

Python

python/chat/contact-form-app/main.py
{ 'buttonList': { 'buttons': [{
  'text': "SUBMIT",
  'onClick': { 'action': {
    'function': FUNCTION_URL,
    'parameters': [
      { 'key': "actionName", 'value': "submitDialog" },
      # Pass input values as parameters for last dialog step (submission)
      { 'key': "contactName", 'value': name },
      { 'key': "contactBirthdate", 'value': birthdate },
      { 'key': "contactType", 'value': type }
    ]
  }}
}]}}

Замените FUNCTION_URL на HTTP-адрес конечной точки, обрабатывающей нажатия кнопок.

Java

java/chat/contact-form-app/src/main/java/com/google/chat/contact/App.java
new GoogleAppsCardV1Widget().setButtonList(new GoogleAppsCardV1ButtonList().setButtons(List.of(
  new GoogleAppsCardV1Button()
    .setText("SUBMIT")
    .setOnClick(new GoogleAppsCardV1OnClick().setAction(new GoogleAppsCardV1Action()
      .setFunction(FUNCTION_URL)
      .setParameters(List.of(
        new GoogleAppsCardV1ActionParameter().setKey("actionName").setValue("submitDialog"),
        // Pass input values as parameters for last dialog step (submission)
        new GoogleAppsCardV1ActionParameter().setKey("contactName").setValue(name),
        new GoogleAppsCardV1ActionParameter().setKey("contactBirthdate").setValue(birthdate),
        new GoogleAppsCardV1ActionParameter().setKey("contactType").setValue(type))))))))))));

Замените FUNCTION_URL на HTTP-адрес конечной точки, обрабатывающей нажатия кнопок.

Скрипт приложений

В этом примере отправляется сообщение в виде карточки, возвращая JSON-объект с именем карточки . Вы также можете использовать службу создания карточек Apps Script .

apps-script/chat/contact-form-app/Code.gs
{ buttonList: { buttons: [{
  text: "SUBMIT",
  onClick: { action: {
    function: "submitDialog",
    // Pass input values as parameters for last dialog step (submission)
    parameters: [
      { key: "contactName", value: name },
      { key: "contactBirthdate", value: birthdate },
      { key: "contactType", value: type }
    ]
  }}
}]}}

Когда пользователь нажимает кнопку, ваше приложение чата получает объект события, из которого вы можете получать данные .

Ответить на отправленную форму

После получения данных из сообщения в виде карточки или диалога, приложение «Чат» отвечает либо подтверждением получения, либо сообщением об ошибке.

В следующем примере приложение для чата отправляет текстовое сообщение, подтверждающее успешное получение формы, отправленной через карточку.

Node.js

node/chat/contact-form-app/index.js
return { hostAppDataAction: { chatDataAction: { createMessageAction: { message: {
  text: "✅ " + event.commonEventObject.parameters["contactName"] + " has been added to your contacts."
}}}}};

Python

python/chat/contact-form-app/main.py
return { 'hostAppDataAction': { 'chatDataAction': { 'createMessageAction': { 'message': {
  'text': "✅ " + event.get('commonEventObject').get('parameters')["contactName"] + " has been added to your contacts."
}}}}}

Java

java/chat/contact-form-app/src/main/java/com/google/chat/contact/App.java
return new GenericJson() {{
  put("hostAppDataAction", new GenericJson() {{
    put("chatDataAction", new GenericJson() {{
      put("createMessageAction", new GenericJson() {{
        put("message", new Message()
          .setText( "✅ " + event.at("/commonEventObject/parameters/contactName").asText() +
                    " has been added to your contacts."));
      }});
    }});
  }});
}};

Скрипт приложений

В этом примере отправляется сообщение в виде карточки, возвращая JSON-объект с именем карточки . Вы также можете использовать службу создания карточек Apps Script .

apps-script/chat/contact-form-app/Code.gs
return { hostAppDataAction: { chatDataAction: { createMessageAction: { message: {
  text: "✅ " + event.commonEventObject.parameters["contactName"] + " has been added to your contacts."
}}}}};

Для обработки и закрытия диалогового окна необходимо вернуть объект RenderActions , указывающий, хотите ли вы отправить подтверждающее сообщение, обновить исходное сообщение или карточку, или просто закрыть диалоговое окно. Инструкции см. в разделе « Закрытие диалогового окна» .

Устранение неполадок

Когда приложение или карточка Google Chat выдает ошибку, интерфейс чата отображает сообщение «Что-то пошло не так» или «Не удалось обработать ваш запрос». Иногда интерфейс чата не отображает никаких сообщений об ошибке, но приложение или карточка чата выдает неожиданный результат; например, сообщение на карточке может не появиться.

Хотя сообщение об ошибке может не отображаться в пользовательском интерфейсе чата, подробные сообщения об ошибках и данные журнала доступны для исправления ошибок, если включено ведение журнала ошибок для приложений чата. Для получения помощи по просмотру, отладке и исправлению ошибок см. раздел «Устранение неполадок и исправление ошибок Google Chat» .