इस गाइड में बताया गया है कि Google Chat ऐप्लिकेशन, जानकारी को कैसे इकट्ठा और प्रोसेस कर सकते हैं इस्तेमाल करके कार्ड-आधारित इंटरफ़ेस में फ़ॉर्म इनपुट तैयार करते हैं.
चैट ऐप्लिकेशन, Chat में या उसके बाहर कार्रवाइयां करने के लिए, उपयोगकर्ताओं से जानकारी का अनुरोध करते हैं. इनमें ये तरीके भी शामिल हैं:
- सेटिंग कॉन्फ़िगर करें. उदाहरण के लिए, उपयोगकर्ताओं को सूचना सेटिंग को पसंद के मुताबिक बनाने की अनुमति देना इसके अलावा, Chat ऐप्लिकेशन को एक या एक से ज़्यादा टैब में कॉन्फ़िगर किया जा सकता है और स्पेसेज़.
- Google Workspace के अन्य ऐप्लिकेशन में जानकारी बनाएं या अपडेट करें. इसके लिए उदाहरण के लिए, उपयोगकर्ताओं को Google Calendar इवेंट बनाने दें.
- उपयोगकर्ताओं को अन्य ऐप्लिकेशन या वेब सेवाओं पर मौजूद संसाधनों को ऐक्सेस और अपडेट करने की अनुमति दें. उदाहरण के लिए, Chat ऐप्लिकेशन की मदद से उपयोगकर्ता, सीधे Chat स्पेस से सहायता टिकट की स्थिति अपडेट कर सकते हैं.
ज़रूरी शर्तें
Google Chat ऐप्लिकेशन, जिसमें इंटरैक्टिव सुविधाएं चालू हों. बनाने के लिए इंटरैक्टिव चैट ऐप्लिकेशन. इनमें से किसी एक क्विकस्टार्ट के आधार पर उसे पूरा करें का इस्तेमाल करें जिसका इस्तेमाल करना है:- Google Cloud Functions की मदद से एचटीटीपी सेवा
- Google Apps Script
- Google Cloud Dialogflow CX
- Google Cloud Pub/Sub
कार्ड का इस्तेमाल करके फ़ॉर्म बनाना
जानकारी इकट्ठा करने के लिए, Chat ऐप्लिकेशन फ़ॉर्म और उनके इनपुट डिज़ाइन करते हैं और उन्हें कार्ड में बनाते हैं. उपयोगकर्ताओं को कार्ड दिखाने के लिए, चैट ऐप्लिकेशन, इन चैट इंटरफ़ेस का इस्तेमाल कर सकते हैं:
- ऐसे मैसेज जिनमें एक या उससे ज़्यादा कार्ड शामिल हों.
- होम पेज, यह एक कार्ड होता है जो Chat ऐप्लिकेशन के डायरेक्ट मैसेज में, होम टैब में दिखता है.
- डायलॉग: इसमें खुलने वाले कार्ड होते हैं किसी नए विंडो में मैसेज और होम पेज से.
चैट ऐप्लिकेशन, इन विजेट का इस्तेमाल करके कार्ड बना सकते हैं:
उपयोगकर्ताओं से जानकारी मांगने वाले फ़ॉर्म इनपुट विजेट. इसके अलावा, आपके पास पुष्टि करने की सुविधा जोड़ें इनपुट विजेट बनाने के लिए, ताकि यह पक्का किया जा सके कि उपयोगकर्ता जानकारी इनपुट और फ़ॉर्मैट करें सही तरीके से. चैट ऐप्लिकेशन नीचे दिए गए फ़ॉर्म इनपुट विजेट का इस्तेमाल कर सकते हैं:
- टेक्स्ट इनपुट
फ़्री-फ़ॉर्म या सुझाए गए टेक्स्ट के लिए (
textInput
). - चुने गए इनपुट (
selectionInput
), चुने जा सकने वाले यूज़र इंटरफ़ेस (यूआई) एलिमेंट होते हैं. जैसे, चेकबॉक्स, रेडियो बटन, और ड्रॉप-डाउन मेन्यू. चुनने के लिए दिए गए इनपुट विजेट, स्टैटिक या डाइनैमिक डेटा सोर्स से भी आइटम पॉप्युलेट कर सकते हैं. उदाहरण के लिए, उपयोगकर्ता सूची में से उस चैट स्पेस को चुनें जिसके वे सदस्य हैं. - तारीख और समय चुनने वाले टूल
(
dateTimePicker
) तारीख और समय की एंट्री के लिए.
- टेक्स्ट इनपुट
फ़्री-फ़ॉर्म या सुझाए गए टेक्स्ट के लिए (
बटन विजेट ताकि लोग कार्ड में डाली गई वैल्यू सबमिट कर सकें. बटन पर क्लिक करने के बाद, Chat ऐप्लिकेशन अपने पास मौजूद जानकारी को प्रोसेस कर सकता है.
यहां एक कार्ड दिखाया गया है, जिसमें तारीख और समय के तीन अलग-अलग तरह के इनपुट हैं:
इंटरैक्टिव विजेट के और उदाहरण दिए हैं, जिन्हें आप इकट्ठा करने के लिए इस्तेमाल कर सकते हैं जानकारी, देखें एक इंटरैक्टिव कार्ड या डायलॉग डिज़ाइन करें.
इंटरैक्टिव विजेट से डेटा पाएं
जब भी उपयोगकर्ता किसी बटन पर क्लिक करते हैं, तो चैट ऐप्लिकेशन को
CARD_CLICKED
इंटरैक्शन इवेंट
इसमें इंटरैक्शन के बारे में जानकारी होती है. इसका पेलोड
CARD_CLICKED
इंटरैक्शन इवेंट में एक common.formInputs
शामिल है
ऑब्जेक्ट के लिए, उपयोगकर्ता की ओर से इनपुट की गई कोई भी वैल्यू डालें.
ऑब्जेक्ट से वैल्यू वापस पाई जा सकती है
common.formInputs.WIDGET_NAME
, जहां
WIDGET_NAME, name
फ़ील्ड है जिसे आपने विजेट के लिए तय किया है.
वैल्यू, विजेट के लिए किसी खास डेटा टाइप के तौर पर दिखती हैं. इन्हें Inputs
ऑब्जेक्ट के तौर पर दिखाया जाता है.
नीचे दिए गए उदाहरण में, कार्ड में टेक्स्ट इनपुट, तारीख और समय चुनने वाला टूल, और चुनने के लिए दिए गए इनपुट विजेट का इस्तेमाल करके संपर्क जानकारी इकट्ठा की जाती है:
{
"textInput": {
"name": "contactName",
"label": "First and last name",
"type": "SINGLE_LINE"
}
}, {
"dateTimePicker": {
"name": "contactBirthdate",
"label": "Birthdate",
"type": "DATE_ONLY"
}
}, {
"selectionInput": {
"name": "contactType",
"label": "Contact type",
"type": "RADIO_BUTTON",
"items": [
{
"text": "Work",
"value": "Work",
"selected": false
},
{
"text": "Personal",
"value": "Personal",
"selected": false
}
]
}
}
इंटरैक्शन इवेंट को मैनेज करना
जब कोई उपयोगकर्ता किसी कार्ड या डायलॉग में डेटा डालता है, तो आपके
Chat ऐप्लिकेशन पर अब Chat ऐप्लिकेशन काम करेगा
CARD_CLICKED
इंटरैक्शन इवेंट, जिसमें उपयोगकर्ता की डाली गई वैल्यू शामिल होती हैं.
यहां CARD_CLICKED
इंटरैक्शन इवेंट का एक हिस्सा दिखाया गया है, जिसमें उपयोगकर्ता ने हर विजेट के लिए वैल्यू डाली है:
HTTP
{
"type": "CARD_CLICKED",
"common": { "formInputs": {
"contactName": { "stringInputs": {
"value": ["Kai 0"]
}},
"contactBirthdate": { "dateInput": {
"msSinceEpoch": 1000425600000
}},
"contactType": { "stringInputs": {
"value": ["Personal"]
}}
}}
}
Apps Script
{
"type": "CARD_CLICKED",
"common": { "formInputs": {
"contactName": { "": { "stringInputs": {
"value": ["Kai 0"]
}}},
"contactBirthdate": { "": { "dateInput": {
"msSinceEpoch": 1000425600000
}}},
"contactType": { "": { "stringInputs": {
"value": ["Personal"]
}}}
}}
}
डेटा पाने के लिए, आपका Chat ऐप्लिकेशन इंटरैक्शन इवेंट का इस्तेमाल करके, वे वैल्यू देखी जा सकती हैं जो उपयोगकर्ता विजेट में डालते हैं. नीचे दी गई टेबल में, किसी फ़ॉर्म इनपुट विजेट की वैल्यू पाने का तरीका बताया गया है. हर विजेट के लिए, टेबल में वह डेटा टाइप दिखाया जाता है जिसे विजेट स्वीकार करता है, जहां वैल्यू सेव की जाती है और उदाहरण के तौर पर एक वैल्यू दी गई है.
फ़ॉर्म इनपुट विजेट | इनपुट डेटा का टाइप | इंटरैक्शन इवेंट से मिली वैल्यू डालें | उदाहरण के तौर पर दी गई वैल्यू |
---|---|---|---|
textInput |
stringInputs |
events.common.formInputs.contactName.stringInputs.value[0] |
Kai O |
selectionInput |
stringInputs |
पहली या सिर्फ़ एक वैल्यू पाने के लिए, events.common.formInputs.contactType.stringInputs.value[0] |
Personal |
dateTimePicker , जो सिर्फ़ तारीखें स्वीकार करता है. |
dateInput |
events.common.formInputs.contactBirthdate.dateInput.msSinceEpoch . |
1000425600000 |
किसी दूसरे कार्ड में डेटा ट्रांसफ़र करें
जब कोई उपयोगकर्ता, कार्ड से जानकारी सबमिट करता है, तब आपको उसे वापस करना पड़ सकता है अतिरिक्त कार्ड जोड़ें:
- अलग-अलग सेक्शन बनाकर, उपयोगकर्ताओं को लंबे फ़ॉर्म भरने में मदद करें.
- उपयोगकर्ताओं को शुरुआती कार्ड से जानकारी की झलक देखने और उसकी पुष्टि करने की सुविधा दें, ताकि वे सबमिट करने से पहले अपने जवाबों की समीक्षा कर सकते हैं.
- फ़ॉर्म के बाकी हिस्सों को डाइनैमिक तरीके से भरें. उदाहरण के लिए, उपयोगकर्ताओं को अपॉइंटमेंट बनाने के लिए कहने के लिए, Chat ऐप्लिकेशन एक शुरुआती कार्ड दिखा सकता है. इस कार्ड में, अपॉइंटमेंट की वजह पूछी जाती है. इसके बाद, एक और कार्ड दिखता है. इसमें अपॉइंटमेंट के टाइप के आधार पर, उपलब्ध समय की जानकारी दी जाती है.
शुरुआती कार्ड से डेटा इनपुट ट्रांसफ़र करने के लिए, actionParameters
के साथ button
विजेट बनाया जा सकता है. इसमें विजेट का name
और उपयोगकर्ता की डाली गई वैल्यू शामिल होती है, जैसा कि यहां दिए गए उदाहरण में दिखाया गया है:
{
"buttonList": {
"buttons": [{
"text": "Submit",
"onClick": {
"action": {
"function": "openNextCard",
"parameters": [{
"key": "WIDGET_NAME",
"value": "USER_INPUT_VALUE"
}]
}
}
}]
}
}
यहां WIDGET_NAME, विजेट का name
है और USER_INPUT_VALUE वह वैल्यू है जिसे उपयोगकर्ता डालता है. उदाहरण के लिए, किसी व्यक्ति का नाम इकट्ठा करने वाले टेक्स्ट इनपुट के लिए, विजेट का नाम contactName
और उदाहरण के तौर पर दी गई वैल्यू Kai O
है.
जब कोई उपयोगकर्ता बटन पर क्लिक करता है, तो आपके Chat ऐप्लिकेशन को एक CARD_CLICKED
इंटरैक्शन इवेंट मिलता है. वैल्यू वापस पाने के लिए, event.common.parameters
ऑब्जेक्ट का इस्तेमाल किया जा सकता है.
नीचे दिए गए उदाहरण में बताया गया है कि उपयोगकर्ता वाले पैरामीटर कैसे पास किए जा सकते हैं अगले कार्ड को खोलने वाले फ़ंक्शन में डेटा इनपुट करें:
Node.js
// Respond to button clicks on cards or dialogs
if (event.type === "CARD_CLICKED") {
// Open another card.
if (event.common.invokedFunction === "openNextCard") {
const parameters = event.common.parameters;
openNextCard(event);
}
}
Python
# Respond to button clicks on cards or dialogs
if request.get('type') == 'CARD_CLICKED':
if invoked_function := request.get('common', dict()).get('invokedFunction'):
if invoked_function == 'open_next_card':
parameters = request.get('common', dict()).get('parameters'),
return open_next_card(parameters)
Apps Script
// Respond to button clicks on cards or dialogs
function onCardClick(event) {
if (event.common.invokedFunction === "openNextCard") {
const parameters = event.common.parameters;
return openNextCard(parameters);
}
}
फ़ॉर्म सबमिशन का जवाब देना
कार्ड मैसेज या डायलॉग बॉक्स से डेटा मिलने के बाद, चैट ऐप्लिकेशन, रसीद स्वीकार करने के बाद जवाब देता है या कोई गड़बड़ी दिखा रहा है.
यहां दिए गए उदाहरण में, कोई Chat ऐप्लिकेशन मैसेज भेजता है से सबमिट किया गया फ़ॉर्म मिल गया है, इसकी पुष्टि करने के लिए कार्ड मैसेज.
Apps Script
function submitCardForm(contactName, contactBirthdate, contactType) {
return {
"text": "You entered the following contact information:\n\n" +
"*Name:* " + contactName + "\n" +
"*Birthdate:* " + contactBirthdate + "\n" +
"*Type:* " + contactType
}
}
किसी डायलॉग को प्रोसेस और बंद करने के लिए, आपको
ActionResponse
ऑब्जेक्ट है, जो बताता है कि आपको पुष्टि करने वाला मैसेज भेजना है या नहीं. इसके लिए,
या सिर्फ़ डायलॉग बॉक्स को बंद करें. इसके लिए, डायलॉग बॉक्स बंद करना लेख पढ़ें.
समस्या हल करें
जब Google Chat ऐप्लिकेशन या card कोई गड़बड़ी दिखाता है, Chat के इंटरफ़ेस पर, "कोई गड़बड़ी हुई" मैसेज दिखता है. या "आपका अनुरोध प्रोसेस नहीं किया जा सका." कभी-कभी Chat यूज़र इंटरफ़ेस (यूआई) गड़बड़ी का कोई मैसेज नहीं दिखाता है. हालांकि, Chat ऐप्लिकेशन या कार्ड से कोई अनचाहा नतीजा मिलता है; उदाहरण के लिए, कार्ड मैसेज शायद दिखाना चाहते हैं.
ऐसा हो सकता है कि Chat के यूज़र इंटरफ़ेस (यूआई) में गड़बड़ी का मैसेज न दिखे. हालांकि, Chat ऐप्लिकेशन के लिए गड़बड़ी को लॉग करने की सुविधा चालू होने पर, गड़बड़ी के बारे में जानकारी देने वाले मैसेज और लॉग डेटा उपलब्ध होते हैं. इनकी मदद से, गड़बड़ियों को ठीक किया जा सकता है. गड़बड़ियों को देखने, डिबग करने, और ठीक करने में मदद पाने के लिए, Google Chat में गड़बड़ियों को हल करना और उन्हें ठीक करना लेख पढ़ें.
मिलते-जुलते विषय
- संपर्क मैनेजर का सैंपल देखें. यह एक चैट ऐप्लिकेशन है, जो उपयोगकर्ताओं को कार्ड मैसेज और डायलॉग से संपर्क फ़ॉर्म भरने के लिए कहता है.
- इंटरैक्टिव डायलॉग खोलें