कार्ड और डायलॉग से जुड़ी समस्याएं हल करना और उन्हें ठीक करना

इस गाइड में कार्ड से जुड़ी आम गड़बड़ियों की जानकारी दी गई है. साथ ही, उन्हें ठीक करने का तरीका भी बताया गया है.

---

कार्ड बिल्डर से कार्ड डिज़ाइन करें और उनकी झलक देखें.

कार्ड बिल्डर खोलें

---

कार्ड की गड़बड़ियां किस तरह दिखती हैं

कार्ड की गड़बड़ियों को कई तरीकों से दिखाया जा सकता है:

• कार्ड का कोई हिस्सा, जैसे कि विजेट या कॉम्पोनेंट, नहीं दिखता या गलत तरीके से रेंडर नहीं होता है.
• पूरा कार्ड नहीं दिखता है.
• डायलॉग बंद हो जाता है, नहीं खुलता है या लोड नहीं होता है.

अगर आपको इस तरह का व्यवहार दिखता है, तो इसका मतलब है कि आपके ऐप्लिकेशन के कार्ड में कोई गड़बड़ी है.

संदर्भ के लिए: एक चालू, गड़बड़ी-रहित कार्ड संदेश और डायलॉग

कार्ड के गलत उदाहरणों की जांच करने से पहले, इस वर्किंग कार्ड मैसेज और डायलॉग पर ध्यान दें. गड़बड़ी के हर उदाहरण और उसे ठीक करने के बारे में बताने के लिए, इस कार्ड के JSON में गड़बड़ियां पेश करके, उसके JSON में बदलाव किया गया है.

गड़बड़ी-रहित कार्ड संदेश

यहां संपर्क जानकारी के साथ काम करने वाला और गड़बड़ी-रहित कार्ड मैसेज दिया गया है. इसमें हेडर, सेक्शन, और सजाए गए टेक्स्ट और बटन जैसे विजेट शामिल हैं:

बिना गड़बड़ी वाला डायलॉग

यहां एक गड़बड़ी-रहित डायलॉग दिया गया है, जो उपयोगकर्ताओं से जानकारी इकट्ठा करके संपर्क बनाता है. इसमें फ़ुटर और बदलाव करने लायक विजेट, जैसे कि टेक्स्ट इनपुट, स्विच और बटन शामिल हैं:

गड़बड़ी: कार्ड का कुछ हिस्सा नहीं दिख रहा है

कभी-कभी कार्ड रेंडर हो जाते हैं, लेकिन कार्ड का वह हिस्सा नहीं दिखता है जिसके दिखने की उम्मीद आपको थी. इसकी ये वजहें हो सकती हैं:

• ज़रूरी JSON फ़ील्ड मौजूद नहीं है.
• JSON फ़ील्ड की स्पेलिंग गलत है या उसमें कैपिटल लेटर का इस्तेमाल गलत तरीके से किया गया है.

वजह: ज़रूरी JSON फ़ील्ड मौजूद नहीं है

गड़बड़ी के इस उदाहरण में ज़रूरी JSON फ़ील्ड, title मौजूद नहीं है. इस वजह से, कार्ड रेंडर हो जाता है, लेकिन कार्ड के जिन हिस्सों के दिखने की उम्मीद होती है वे नहीं दिखते. यह अनुमान लगाना मुश्किल हो सकता है कि ज़रूरी फ़ील्ड को छोड़ने पर, कार्ड कैसे रेंडर होते हैं.

इस गड़बड़ी को ठीक करने के लिए, ज़रूरी JSON फ़ील्ड जोड़ें. इस उदाहरण में, title.

यह जानने के लिए कि JSON फ़ील्ड ज़रूरी है या नहीं, कार्ड v2 का रेफ़रंस दस्तावेज़ देखें. इस उदाहरण में, CardHeader पर title फ़ील्ड का ब्यौरा देखें.

ऐसा करने के दो उदाहरण यहां दिए गए हैं:

पहला उदाहरण: subtitle तय करने से, ज़रूरी title को हटाने पर, पूरा हेडर खाली दिखेगा:

पहली इमेज: इस कार्ड का हेडर नहीं दिख रहा है, क्योंकि ज़रूरी फ़ील्ड title मौजूद नहीं है.

गड़बड़ी वाला JSON स्निपेट देखें

गड़बड़ी: header में एक आवश्यक फ़ील्ड title मौजूद नहीं है.

    . . .
    "header": {

            "subtitle": "Software Engineer"
          }
    . . .
    

कार्ड JSON का सही स्निपेट देखें

सुधारे गए: ज़रूरी फ़ील्ड title, header की शर्तों का हिस्सा है.

    . . .
    "header": {
            "title": "Sasha",
            "subtitle": "Software Engineer"
          }
    . . .
    

उदाहरण 2: subtitle, imageUrl, imageType, और imageAltText की जानकारी देने से, ज़रूरी title को हटाने पर, इमेज उम्मीद के मुताबिक रेंडर होती है, लेकिन सबटाइटल नहीं:

दूसरी इमेज: इस कार्ड के हेडर में सबटाइटल नहीं दिखता है, क्योंकि एक ज़रूरी फ़ील्ड title मौजूद नहीं है. हालांकि, इमेज उम्मीद के मुताबिक रेंडर हो रही है.

गड़बड़ी वाला JSON स्निपेट देखें

गड़बड़ी: header में एक आवश्यक फ़ील्ड title मौजूद नहीं है.

    . . .
    "header": {

            "subtitle": "Software Engineer",
            "imageUrl":
            "https://developers.google.com/chat/images/quickstart-app-avatar.png",
            "imageType": "CIRCLE",
            "imageAltText": "Avatar for Sasha",
          }
    . . .
    

कार्ड JSON का सही स्निपेट देखें

सुधारे गए: ज़रूरी फ़ील्ड title, header की शर्तों का हिस्सा है.

    . . .
    "header": {
            "title": "Sasha",
            "subtitle": "Software Engineer",
            "imageUrl":
            "https://developers.google.com/chat/images/quickstart-app-avatar.png",
            "imageType": "CIRCLE",
            "imageAltText": "Avatar for Sasha",
          }
    . . .
    

वजह: JSON की स्पेलिंग गलत है या कैपिटल लेटर का इस्तेमाल किया गया है

गड़बड़ी के इस उदाहरण में, कार्ड JSON में सभी ज़रूरी फ़ील्ड शामिल हैं, लेकिन एक फ़ील्ड imageUrl को गलत तरीके से imageURL (कैपिटल R कैपिटल L) के तौर पर कैपिटल लेटर में शामिल किया गया है. इससे गड़बड़ी होने की वजह है: जिस इमेज को यह पॉइंट करता है वह रेंडर नहीं होता.

इस गड़बड़ी और इस तरह की दूसरी गड़बड़ियों को ठीक करने के लिए, सही JSON फ़ॉर्मैट का इस्तेमाल करें. इस मामले में, imageUrl सही है. किसी तरह का संदेह होने पर, कार्ड के रेफ़रंस दस्तावेज़ से कार्ड JSON की जांच करें.

तीसरी इमेज: इस कार्ड के हेडर में सबटाइटल नहीं दिखता है, क्योंकि एक ज़रूरी फ़ील्ड title मौजूद नहीं है. हालांकि, इमेज उम्मीद के मुताबिक रेंडर हो रही है.

गड़बड़ी वाला JSON स्निपेट देखें

गड़बड़ी: imageURL फ़ील्ड में गलत तरीके से कैपिटल लेटर का इस्तेमाल किया गया है. यह imageUrl होना चाहिए.

    . . .
    "header": {
      "title": "Sasha",
      "subtitle": "Software Engineer",
      "imageURL":
      "https://developers.google.com/chat/images/quickstart-app-avatar.png",
      "imageType": "CIRCLE",
      "imageAltText": "Avatar for Sasha",
    }
    . . .
    

कार्ड JSON का सही स्निपेट देखें

सुधारे गए: imageUrl फ़ील्ड को सही तरीके से कैपिटल लेटर में रखा गया है.

    . . .
    "header": {
            "title": "Sasha",
            "subtitle": "Software Engineer",
            "imageUrl":
            "https://developers.google.com/chat/images/quickstart-app-avatar.png",
            "imageType": "CIRCLE",
            "imageAltText": "Avatar for Sasha",
          }
    . . .
    

गड़बड़ी: पूरा कार्ड नहीं दिखता है

कभी-कभी कार्ड अपने-आप नहीं दिखता है, तो इसकी ये वजहें हो सकती हैं:

• ButtonList विजेट की जानकारी गलत तरीके से दी गई है.
• CardFixedFooter विजेट में गलत बटन दिया गया है.

वजह: buttonList या cardFixedFooter को गलत तरीके से बताया गया है

अगर किसी कार्ड मैसेज या डायलॉग में गलत तरीके से तय किया गया ButtonList विजेट या CardFixedFooter विजेट मौजूद है, तो पूरा कार्ड नहीं दिखता है. साथ ही, उसकी जगह पर कुछ भी नहीं दिखता है. गलत जानकारी में ऐसे फ़ील्ड शामिल हो सकते हैं जो मौजूद नहीं हैं, गलत स्पेलिंग वाले या कैपिटल लेटर वाले फ़ील्ड हैं. इसके अलावा, गलत तरीके से स्ट्रक्चर्ड किए गए JSON में भी ऐसा हो सकता है, जैसे कि कॉमा, कोटेशन या कर्ली ब्रैकेट.

इस गड़बड़ी को ठीक करने के लिए, कार्ड रेफ़रंस दस्तावेज़ से कार्ड JSON की जांच करें. खास तौर पर, किसी भी ButtonList विजेट की तुलना ButtonList विजेट गाइड से करें.

उदाहरण: ButtonList विजेट गाइड में, पहले बटन में onClick की अधूरी कार्रवाई पास करने पर, पूरा कार्ड रेंडर नहीं होता है.

गलत कार्ड JSON स्निपेट देखें

गड़बड़ी: onClick ऑब्जेक्ट में कोई फ़ील्ड तय नहीं किया गया है, इसलिए पूरा कार्ड नहीं दिखता.

    . . .
    {
      "buttonList": {
        "buttons": [
          {
            "text": "Share",
            "onClick": {


              }
            }
          },
          {
            "text": "Edit",
            "onClick": {
              "action": {
                "function": "goToView",
                "parameters": [
                  {
                    "key": "viewType",
                    "value": "EDIT",
                  }
                ],
              }
            }
          },
        ],
      },
    }
    . . .
    

कार्ड के JSON स्निपेट को देखना

ठीक की गई गड़बड़ी: अब onClick ऑब्जेक्ट में एक openLink फ़ील्ड है, ताकि कार्ड उम्मीद के मुताबिक दिखे.

    . . .
    {
      "buttonList": {
        "buttons": [
          {
            "text": "Share",
            "onClick": {
              "openLink": {
                "url": "https://example.com/share",
              }
            }
          },
          {
            "text": "Edit",
            "onClick": {
              "action": {
                "function": "goToView",
                "parameters": [
                  {
                    "key": "viewType",
                    "value": "EDIT",
                  }
                ],
              }
            }
          },
        ],
      },
    }
    . . .
    

गड़बड़ी: डायलॉग बॉक्स बंद हो जाता है, रुक जाता है या नहीं खुलता

अगर कोई डायलॉग अचानक बंद हो जाता है, लोड नहीं हो पाता या खुलता नहीं है, तो इसकी वजह कार्ड के इंटरफ़ेस में कोई समस्या है.

सबसे सामान्य वजहें हैं:

• CardFixedFooter विजेट में कोई primaryButton नहीं है.
• CardFixedFooter विजेट के किसी बटन में कोई onClick कार्रवाई नहीं है या उसकी onClick कार्रवाई के बारे में गलत जानकारी दी गई है.
• TextInput विजेट में name फ़ील्ड मौजूद नहीं है.

वजह: CardFixedFooter का कोई primaryButton नहीं है

CardFixedFooter विजेट वाले डायलॉग में टेक्स्ट और रंग, दोनों के साथ primaryButton की जानकारी देना ज़रूरी है. primaryButton को हटाने या इसे गलत तरीके से सेट करने पर, पूरा डायलॉग नहीं दिखता.

इस गड़बड़ी को ठीक करने के लिए, पक्का करें कि CardFixedFooter विजेट में सही primaryButton शामिल हो.

गलत कार्ड JSON स्निपेट देखें

गड़बड़ी: fixedFooter ऑब्जेक्ट में कोई primaryButton फ़ील्ड तय नहीं किया गया है. इस वजह से, डायलॉग बॉक्स लोड नहीं हो पा रहा है या खुल रहा है.

    . . .
    "fixedFooter": {

        "onClick": {
          . . .
      },
      "secondaryButton": {
        . . .
        }
      }
    }
    . . .
    

कार्ड के JSON स्निपेट को देखना

ठीक की गई: अब fixedFooter में एक primaryButton फ़ील्ड के बारे में बताया गया है, ताकि डायलॉग सही तरीके से काम करे.

    . . .
    "fixedFooter": {
      "primaryButton": {
        "text": "Submit",
        "color": {
          "red": 0,
          "blue": 1,
          "green": 0
        },
        "onClick": {
          . . .
      },
      "secondaryButton": {
        . . .
        }
      }
    }
    . . .
    

वजह: FixedFooter में onClick की सेटिंग गलत है

CardFixedFooter विजेट वाले डायलॉग में, किसी बटन पर onClick की गलत सेटिंग के बारे में बताना या उसे छोड़ देना, जिससे डायलॉग बंद हो जाए, लोड न हो या न खुले.

इस गड़बड़ी को ठीक करने के लिए, पक्का करें कि हर बटन में onClick की सही सेटिंग मौजूद हो.

गलत कार्ड JSON स्निपेट देखें

गड़बड़ी: primaryButton ऑब्जेक्ट में एक onClick फ़ील्ड है, जिसमें गलत स्पेलिंग वाले `पैरामीटर` कलेक्शन हैं. इस वजह से, डायलॉग बॉक्स लोड नहीं हो सका या खुल नहीं रहा है.

    . . .
    "fixedFooter": {
      "primaryButton": {
        "text": "Submit",
        "color": {
          "red": 0,
          "blue": 1,
          "green": 0
        },
        "onClick": {
          "action": {
            "function": "setLanguageType",
            "parrammetters": [
              {
                "key": "languageType",
                "value": "C++"
              }
            ]
          }
        }
      },
      "secondaryButton": {
        "text": "Cancel",
        "onClick": {
          "action": {
            "function": "reset"
          }
        }
      }
    }
    . . .
    

कार्ड के JSON स्निपेट को देखना

सुधारा गया: primaryButton ऑब्जेक्ट में onClick फ़ील्ड है, जिसमें सही स्पेलिंग वाले `पैरामीटर` हैं, इसलिए डायलॉग सही तरीके से काम कर रहे हैं.

    . . .
    "fixedFooter": {
      "primaryButton": {
        "text": "Submit",
        "color": {
          "red": 0,
          "blue": 1,
          "green": 0
        },
        "onClick": {
          "action": {
            "function": "setLanguageType",
            "parameters": [
              {
                "key": "languageType",
                "value": "C++"
              }
            ]
          }
        }
      },
      "secondaryButton": {
        "text": "Cancel",
        "onClick": {
          "action": {
            "function": "reset"
          }
        }
      }
    }
    . . .
    

वजह: TextInput का कोई name नहीं है

अगर किसी डायलॉग में ऐसा TextInput विजेट मौजूद है जिसमें name फ़ील्ड शामिल नहीं है, तो डायलॉग उम्मीद के मुताबिक काम नहीं करता है. यह बंद हो सकता है, खुल सकता है, लेकिन लोड नहीं हो पाएगा या नहीं खुलेगा.

इस गड़बड़ी को ठीक करने के लिए, पक्का करें कि हर TextInput विजेट में एक सही name फ़ील्ड शामिल हो. पक्का करें कि कार्ड का हर name फ़ील्ड अलग हो.

गलत कार्ड JSON स्निपेट देखें

गड़बड़ी: textInput ऑब्जेक्ट में कोई name फ़ील्ड तय नहीं किया गया है. इस वजह से, डायलॉग बॉक्स बंद हो रहा है, लोड नहीं हो पा रहा है या खुल नहीं रहा है.

    . . .
    {
      "textInput": {
        "label": "Name",
        "type": "SINGLE_LINE",

      }
    }
    . . .
    

कार्ड के JSON स्निपेट को देखना

ठीक की गई: अब textInput में एक name फ़ील्ड के बारे में बताया गया है, ताकि डायलॉग सही तरीके से काम करे.

    . . .
    {
      "textInput": {
        "label": "Name",
        "type": "SINGLE_LINE",
        "name": "contactName"
      }
    }
    . . .
    

एसिंक्रोनस ऐप्लिकेशन आर्किटेक्चर से फ़ेल होने वाले डायलॉग बॉक्स खुलते हैं, सबमिट होते हैं या रद्द हो जाते हैं

अगर आपका Chat ऐप्लिकेशन डायलॉग इस्तेमाल करते समय गड़बड़ी का मैसेज Could not load dialog. Invalid response returned by bot. दिखाता है, तो हो सकता है कि आपका ऐप्लिकेशन एसिंक्रोनस आर्किटेक्चर का इस्तेमाल करता हो. जैसे, Cloud Pub/Sub या Create Message एपीआई का तरीका.

किसी डायलॉग को खोलने, सबमिट करने या रद्द करने के लिए, चैट ऐप्लिकेशन से DialogEventType वाला सिंक्रोनस जवाब देना ज़रूरी होता है. इसलिए, एसिंक्रोनस आर्किटेक्चर से बनाए गए ऐप्लिकेशन पर डायलॉग नहीं काम करते.

वैकल्पिक हल के रूप में, डायलॉग के बजाय कार्ड मैसेज का इस्तेमाल करने पर विचार करें.

कार्ड और डायलॉग से जुड़ी अन्य गड़बड़ियां

अगर इस पेज पर बताए गए तरीकों से, आपके ऐप्लिकेशन में कार्ड से जुड़ी गड़बड़ी ठीक नहीं होती है, तो ऐप्लिकेशन के गड़बड़ी लॉग में क्वेरी करें. लॉग को क्वेरी करने पर, आपको JSON कार्ड या ऐप्लिकेशन कोड में मौजूद गड़बड़ियों को ढूंढने में मदद मिल सकती है. इन लॉग में, गड़बड़ी के बारे में पूरी जानकारी देने वाले मैसेज शामिल होते हैं, ताकि आप इन्हें ठीक कर सकें.

मिलते-जुलते विषय

Google Chat ऐप्लिकेशन की गड़बड़ियों को ठीक करने में मदद पाने के लिए, Google Chat ऐप्लिकेशन से जुड़ी समस्या हल करना और उसे ठीक करना और Chat ऐप्लिकेशन को डीबग करना लेख पढ़ें.