사용자가 입력한 정보 처리

이 가이드에서는 사용자가 입력하는 정보를 받고 읽는 방법을 설명합니다. 카드 메시지 및 대화상자가 있습니다. 사용자는 채팅 앱이 수신하고 읽고 응답하는 데이터를 입력할 수 있습니다. 있습니다. 사용자가 정보를 입력할 수 있는 위젯은 다음과 같습니다.

• TextInput 드림 를 사용하는 것이 좋습니다.
• SelectionInput 드림 체크박스, 라디오 버튼, 드롭다운 메뉴 등 목록 항목 및 메뉴에 적용됩니다.
• DateTimePicker 드림 날짜 및 시간 입력에 사용됩니다.

---

카드 빌더를 사용하여 채팅 앱용 JSON 카드 메시지를 디자인하고 미리 봅니다.

카드 빌더 열기 <ph type="x-smartling-placeholder">

---

</ph>

사용자로부터 데이터 입력을 받으면 채팅 앱에서 다음과 같은 작업을 할 수 있습니다. 다음과 같습니다.

• 고객 서비스 케이스를 업데이트합니다.
• 작업 주문 생성
• 웹 서비스로 인증합니다.

기본 요건

참고: Node.js 및 Python의 경우 이 가이드의 코드 샘플은 Google Cloud 함수로 정의합니다.

Node.js

양방향 기능이 사용 설정된 Google Chat 앱 대화형 채팅 앱을 사용하려면 이 빠른 시작을 완료하세요.

Apps Script

양방향 기능이 사용 설정된 Google Chat 앱 Apps Script에서 대화형 채팅 앱을 사용하려면 이 빠른 시작을 완료하세요.

Python

양방향 기능이 사용 설정된 Google Chat 앱 대화형 채팅 앱을 사용하려면 이 빠른 시작을 완료하세요.

데이터 수신 방식

채팅 앱은 대화상자나 카드 메시지를 표시합니다. 이 예에서는 대화상자에서 연락처에 대한 정보를 TextInput 드림 및 SelectionInput 위젯:

완료되면 채팅 앱은 JSON 형식으로 대화상자에 입력된 사용자와 상호작용 이벤트일 수 있습니다. 각 항목의 의미는 다음과 같습니다.

• EventType이(가) CARD_CLICKED입니다.
• DialogEventType 드림 은 SUBMIT_DIALOG입니다 (대화상자에만 해당).

사용자가 입력한 내용에 대한 데이터를 가져오려면 다음을 사용하세요. Event.common.formInputs 드림 필드입니다. formInputs 필드는 키가 있는 맵입니다. 각 위젯에 할당된 문자열 ID이며 값은 있습니다. 다른 객체는 서로 다른 입력 데이터 유형을 나타냅니다. 대상 예를 들어 Event.common.formInputs.stringInputs 드림 는 문자열 입력을 나타냅니다.

앱은 event.common.formInputs.NAME.stringInputs.value[0], 여기서 NAME은 name TextInput 위젯

채팅 앱이 애플리케이션 스크립트에 event.common.formInputs.NAME[""].stringInputs.value[0] 하세요.

카드에서 데이터 수신

<ph type="x-smartling-placeholder">

</ph> 더 많은 예는 Google Chat 앱 샘플을 참고하세요.

사용자가 카드 메시지에 데이터를 입력하면 채팅 앱이 채팅 앱을 수신함 상호작용 이벤트를 보여줍니다.

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

대화상자에서 데이터 수신

사용자가 대화상자에서 데이터를 제출하면 채팅 앱 다음과 같은 다른 채팅 앱 상호작용 이벤트를 수신합니다. 다음 예를 참고하세요.

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

카드 메시지 또는 대화상자에서 수집된 데이터에 응답

카드 메시지 또는 대화상자에서 데이터를 수신하면 채팅 앱이 수신 확인 또는 두 가지 모두 ActionResponse:

• 수신이 완료되었음을 확인하려면 ActionResponse 드림 매개변수("actionStatus": "OK")가 포함됩니다.
• 오류를 반환하려면 ActionResponse 드림 "actionStatus": "ERROR MESSAGE"가 포함된 매개변수입니다.

예

다음 예에서는 name 값이 있는지 확인합니다. 이 항목이 없는 경우 앱에서 오류를 반환합니다. 있는 경우 앱에서 양식 데이터 수신을 확인합니다. 대화상자를 닫습니다.

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

이 예시에서는 카드 JSON과 함께 사용합니다. 또한 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!'
                }
              }
            }

문제 해결

Google Chat 앱 또는 card가 오류를 반환하는 경우 Chat 인터페이스에 '문제가 발생했습니다'라는 메시지가 표시됨 또는 '요청을 처리할 수 없습니다'와 같은 메시지가 표시됩니다. 채팅 UI가 오류 메시지가 표시되지 않지만 채팅 앱 또는 카드에서 예기치 않은 결과가 발생합니다. 예를 들어 카드 메시지가 나타납니다.

채팅 UI에 오류 메시지가 표시되지 않을 수도 있지만 오류 해결에 도움이 되는 오류 메시지 및 로그 데이터를 사용할 수 있음 채팅 앱의 오류 로깅이 사용 설정된 경우 보는 데 도움이 필요한 경우 오류를 수정하는 방법에 대한 자세한 내용은 Google Chat 오류 문제 해결하기

관련 주제

• 사용자의 정보를 처리하는 채팅 앱 샘플을 확인하세요.
• 대화형 대화상자 열기