Ce guide décrit les erreurs courantes liées aux fiches que vous pouvez rencontrer et comment les résoudre.
Créez et prévisualisez des fiches avec Card Builder.
Ouvrez l'outil de création de cartesAffichage des erreurs de carte
Les erreurs de carte se manifestent de plusieurs manières:
- Une partie d'une fiche, comme un widget ou un composant, ne s'affiche pas ou s'affiche de manière inattendue.
- La fiche ne s'affiche pas entièrement.
- Une boîte de dialogue se ferme, ne s'ouvre pas ou ne se charge pas.
Si vous rencontrez ce type de comportement, cela signifie que la carte de votre application présente une erreur.
À titre de référence: un message et une boîte de dialogue fonctionnels et sans erreur
Avant d'examiner des exemples de fiches erronées, examinez d'abord le message et la boîte de dialogue de la fiche de travail. Pour illustrer chaque exemple d'erreur et sa correction, le fichier JSON de cette fiche est modifié en introduisant des erreurs.
Un message de carte sans erreur
Voici le message de carte sans erreur fonctionnel qui détaille les coordonnées et qui comporte un en-tête, des sections et des widgets tels que du texte décoré et des boutons:
Une boîte de dialogue sans erreur
Voici la boîte de dialogue sans erreur fonctionnelle qui crée un contact en collectant des informations auprès des utilisateurs, avec un pied de page, des widgets modifiables comme des boutons de saisie, des commutateurs et de la saisie de texte:
Erreur: Une partie d'une carte ne s'affiche pas
Il arrive que des fiches s'affichent, mais qu'une partie de celles que vous pensiez voir n'apparaisse pas. Voici les causes les plus probables:
- Un champ JSON obligatoire est manquant.
- Un champ JSON est mal orthographié ou sa mise en majuscule est incorrecte.
Cause: champ JSON obligatoire manquant
Dans cet exemple d'erreur, un champ JSON obligatoire, title
, est manquant. Par conséquent, la carte s'affiche, mais certaines parties censées s'afficher ne le sont pas. Il peut être difficile de prévoir comment les cartes s'affichent lorsque des champs obligatoires sont omis.
Pour corriger cette erreur, ajoutez le champ JSON requis. Dans cet exemple, il s'agit de title
.
Pour savoir si un champ JSON est requis, consultez la documentation de référence sur Cards v2. Dans cet exemple, reportez-vous à la description du champ title
sur CardHeader
.
Voici deux exemples :
Exemple 1: Si vous spécifiez subtitle
, mais que vous omettez le title
obligatoire, l'en-tête complet reste vide:
![L'en-tête de cette fiche ne s'affiche pas, car il manque un champ obligatoire (titre).](https://developers-dot-devsite-v2-prod.appspot.com/static/workspace/chat/images/troubleshoot/troubleshoot-cards-missing-required-entity-header-title-1.png?authuser=6&hl=fr)
title
.Afficher l'extrait JSON de carte erronée
Erreur: Il manque un champ obligatoire (title
) dans header
.
. . . "header": { "subtitle": "Software Engineer" } . . .
Afficher l'extrait de code JSON de carte correct
Correction: le champ obligatoire, title
, fait partie de la spécification header
.
. . . "header": { "title": "Sasha", "subtitle": "Software Engineer" } . . .
Exemple 2 : Si vous spécifiez subtitle
, imageUrl
, imageType
et imageAltText
, mais que vous omettez le title
obligatoire, l'image s'affiche comme prévu, mais pas le sous-titre.
![L'en-tête de cette fiche ne s'affiche pas, car il manque un champ obligatoire (titre).](https://developers-dot-devsite-v2-prod.appspot.com/static/workspace/chat/images/troubleshoot/troubleshoot-cards-missing-required-entity-header-title-2.png?authuser=6&hl=fr)
title
, mais l'image s'affiche comme prévu.Afficher l'extrait JSON de carte erronée
Erreur: Il manque un champ obligatoire (title
) dans header
.
. . . "header": { "subtitle": "Software Engineer", "imageUrl": "https://developers.google.com/chat/images/quickstart-app-avatar.png", "imageType": "CIRCLE", "imageAltText": "Avatar for Sasha", } . . .
Afficher l'extrait de code JSON de carte correct
Correction: le champ obligatoire, title
, fait partie de la spécification header
.
. . . "header": { "title": "Sasha", "subtitle": "Software Engineer", "imageUrl": "https://developers.google.com/chat/images/quickstart-app-avatar.png", "imageType": "CIRCLE", "imageAltText": "Avatar for Sasha", } . . .
Cause: code JSON mal orthographié ou en majuscules
Dans cet exemple d'erreur, le fichier JSON de la carte inclut tous les champs obligatoires, mais l'un des champs imageUrl
n'est pas correctement mis en majuscules avec la valeur imageURL
(R
majuscule L
), ce qui provoque une erreur: l'image vers laquelle elle pointe ne s'affiche pas.
Pour corriger cette erreur et d'autres erreurs similaires, utilisez le bon format JSON. Dans ce cas, imageUrl
est correct. En cas de doute, comparez le code JSON de la carte au document de référence de la carte.
![L'en-tête de cette fiche ne s'affiche pas, car il manque un champ obligatoire (titre).](https://developers-dot-devsite-v2-prod.appspot.com/static/workspace/chat/images/troubleshoot/troubleshoot-cards-imageURL-instead-of-imageUrl.png?authuser=6&hl=fr)
title
, mais l'image s'affiche comme prévu.Afficher l'extrait JSON de carte erronée
Erreur: la mise en majuscules du champ "imageURL
" est incorrecte. La valeur doit être imageUrl
.
. . . "header": { "title": "Sasha", "subtitle": "Software Engineer", "imageURL": "https://developers.google.com/chat/images/quickstart-app-avatar.png", "imageType": "CIRCLE", "imageAltText": "Avatar for Sasha", } . . .
Afficher l'extrait de code JSON de carte correct
Correction: la mise en majuscule du champ imageUrl
est correcte.
. . . "header": { "title": "Sasha", "subtitle": "Software Engineer", "imageUrl": "https://developers.google.com/chat/images/quickstart-app-avatar.png", "imageType": "CIRCLE", "imageAltText": "Avatar for Sasha", } . . .
Erreur: Une carte entière ne s'affiche pas
Il arrive que la carte ne s'affiche pas. Voici les causes les plus probables:
- Un widget
ButtonList
est spécifié de manière incorrecte. - Le bouton spécifié dans un widget
CardFixedFooter
est incorrect.
Cause: valeur incorrecte pour buttonList
ou cardFixedFooter
Si un message ou une boîte de dialogue de fiche inclut un widget ButtonList
mal spécifié ou un widget CardFixedFooter
avec des boutons mal spécifiés, la fiche entière ne s'affiche pas et rien n'apparaît à sa place. Les spécifications incorrectes peuvent inclure des champs manquants, des champs mal orthographiés ou en majuscules, ou un fichier JSON mal structuré, comme une virgule, un guillemet ou une accolade.
Pour corriger cette erreur, comparez le code JSON de la carte à celui de la carte. En particulier, comparez les widgets ButtonList
au guide des widgets ButtonList
.
Exemple:Dans un guide du widget ButtonList
, la transmission d'une action onClick
incomplète dans le premier bouton empêche l'affichage de la fiche entière.
Afficher l'extrait JSON de carte erronée
Erreur: Aucun champ n'a été spécifié pour l'objet onClick
, la carte n'apparaît donc pas dans son intégralité.
. . . { "buttonList": { "buttons": [ { "text": "Share", "onClick": { } } }, { "text": "Edit", "onClick": { "action": { "function": "goToView", "parameters": [ { "key": "viewType", "value": "EDIT", } ], } } }, ], }, } . . .
Afficher l'extrait de code JSON de carte correct
Correction: l'objet onClick
comporte désormais un champ openLink
, de sorte que la carte s'affiche comme prévu.
. . . { "buttonList": { "buttons": [ { "text": "Share", "onClick": { "openLink": { "url": "https://example.com/share", } } }, { "text": "Edit", "onClick": { "action": { "function": "goToView", "parameters": [ { "key": "viewType", "value": "EDIT", } ], } } }, ], }, } . . .
Erreur: Une boîte de dialogue se ferme, se bloque ou ne s'ouvre pas
Si une boîte de dialogue se ferme de manière inattendue, ne se charge pas ou ne s'ouvre pas, le problème est probablement dû à l'interface de la fiche.
Voici les raisons les plus courantes qui peuvent expliquer ce problème:
- Le widget
CardFixedFooter
n'a pas deprimaryButton
. - Un bouton du widget
CardFixedFooter
n'a pas d'actiononClick
, ou son actiononClick
est spécifiée de manière incorrecte. - Il manque un champ
name
dans un widgetTextInput
.
Motif: CardFixedFooter
n'a pas de primaryButton
Dans les boîtes de dialogue comportant un widget CardFixedFooter
, vous devez spécifier un primaryButton
contenant à la fois le texte et la couleur. Si vous omettez primaryButton
ou si vous le définissez de manière incorrecte, la boîte de dialogue entière ne s'affichera pas.
Pour corriger cette erreur, assurez-vous que le widget CardFixedFooter
inclut un primaryButton
correctement spécifié.
Afficher l'extrait JSON de carte erronée
Erreur: Aucun champ primaryButton
n'est spécifié pour l'objet fixedFooter
, ce qui empêche le chargement ou l'ouverture de la boîte de dialogue.
. . . "fixedFooter": { "onClick": { . . . }, "secondaryButton": { . . . } } } . . .
Afficher l'extrait de code JSON de carte correct
Correction: fixedFooter
comporte désormais un champ primaryButton
spécifié, de sorte que la boîte de dialogue fonctionne comme prévu.
. . . "fixedFooter": { "primaryButton": { "text": "Submit", "color": { "red": 0, "blue": 1, "green": 0 }, "onClick": { . . . }, "secondaryButton": { . . . } } } . . .
Cause: paramètre onClick
incorrect dans FixedFooter
Dans les boîtes de dialogue contenant un widget CardFixedFooter
, spécifier de manière incorrecte le paramètre onClick
sur un bouton ou l'omettre, ce qui entraîne la fermeture, l'échec du chargement ou l'ouverture de la boîte de dialogue
Pour corriger cette erreur, assurez-vous que chaque bouton inclut un paramètre onClick
correctement spécifié.
Afficher l'extrait JSON de carte erronée
Erreur: L'objet primaryButton
comporte un champ onClick
avec un tableau "parameters" mal orthographié, ce qui empêche le chargement ou l'ouverture de la boîte de dialogue.
. . . "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" } } } } . . .
Afficher l'extrait de code JSON de carte correct
Correction: l'objet primaryButton
comporte un champ onClick
avec un tableau "parameters" correctement orthographié. La boîte de dialogue fonctionne donc comme prévu.
. . . "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" } } } } . . .
Motif: TextInput
n'a pas de name
Si une boîte de dialogue inclut un widget TextInput
qui exclut le champ name
, elle ne se comporte pas comme prévu. Elle peut se fermer, s'ouvrir, mais ne pas se charger, ou ne pas s'ouvrir.
Pour corriger cette erreur, assurez-vous que chaque widget TextInput
inclut un champ name
approprié. Assurez-vous que chaque champ name
de la fiche est unique.
Afficher l'extrait JSON de carte erronée
Erreur: Aucun champ name
n'est spécifié pour l'objet textInput
, ce qui entraîne la fermeture de la boîte de dialogue, ou l'échec du chargement ou de l'ouverture.
. . . { "textInput": { "label": "Name", "type": "SINGLE_LINE", } } . . .
Afficher l'extrait de code JSON de carte correct
Correction: textInput
comporte désormais un champ name
spécifié, de sorte que la boîte de dialogue fonctionne comme prévu.
. . . { "textInput": { "label": "Name", "type": "SINGLE_LINE", "name": "contactName" } } . . .
Les actions d'ouverture, d'envoi ou d'annulation échouent avec une architecture d'application asynchrone
Si votre application Chat renvoie le message d'erreur Could not load dialog. Invalid response returned by bot.
lorsque vous utilisez des boîtes de dialogue, il est possible qu'elle utilise une architecture asynchrone, telle que Cloud Pub/Sub ou la méthode d'API Create Message.
L'ouverture, l'envoi ou l'annulation d'une boîte de dialogue nécessite une réponse synchrone d'une application Chat avec un DialogEventType
.
Par conséquent, les boîtes de dialogue ne sont pas compatibles avec les applications créées avec une architecture asynchrone.
Pour contourner ce problème, envisagez d'utiliser un message sous forme de fiche au lieu d'une boîte de dialogue.
Autres erreurs liées aux cartes et aux boîtes de dialogue
Si les corrections décrites sur cette page ne permettent pas de résoudre l'erreur liée aux cartes rencontrée par votre application, interrogez les journaux d'erreurs de l'application. Interroger les journaux peut vous aider à détecter les erreurs dans le code JSON des cartes ou le code de l'application. Les journaux contiennent des messages d'erreur descriptifs pour vous aider à les corriger.
Articles associés
Pour obtenir de l'aide sur la résolution des erreurs dans l'application Google Chat, consultez Résoudre les problèmes liés à l'application Google Chat et Déboguer les applications Chat.