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

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

Chat ऐप्लिकेशन के लिए, JSON कार्ड मैसेज डिज़ाइन करने और उनकी झलक देखने के लिए, Card Builder का इस्तेमाल करें:

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

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

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

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

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

रेफ़रंस के लिए: काम करने वाला, बिना गड़बड़ी वाला कार्ड मैसेज और डायलॉग बॉक्स

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

कार्ड से बिना गड़बड़ी वाला मैसेज

यह रहा उस कार्ड से जुड़ा मैसेज जिसमें गड़बड़ी नहीं हुई है और आपकी संपर्क जानकारी में हेडर, सेक्शन, और विजेट की सुविधा होती है, जैसे कि सजाए गए टेक्स्ट और बटन:

गड़बड़ी-रहित डायलॉग

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

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

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

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

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

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

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

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

यहां दो उदाहरण दिए गए हैं:

उदाहरण 1: 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 विजेट है, जिसमें गलत बटन हैं, तो पूरा कार्ड नहीं दिखता है और इसकी जगह कुछ भी नहीं दिखता है. गलत जानकारी में, फ़ील्ड मौजूद न होना, गलत स्पेलिंग वाले या कैपिटल लेटर वाले फ़ील्ड या गलत तरीके से स्ट्रक्चर किए गए 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 विजेट वाले डायलॉग में, टेक्स्ट और रंग, दोनों के साथ 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 नहीं है

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

इस गड़बड़ी को ठीक करने के लिए, पक्का करें कि हर 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 या मैसेज बनाएं एपीआई का तरीका.

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

वैकल्पिक हल के रूप में, कार्ड मैसेज का इस्तेमाल करें.

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

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

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