W tym przewodniku opisujemy typowe błędy związane z kartami, które mogą wystąpić, oraz sposoby ich rozwiązywania.
Za pomocą kreatora kart możesz zaprojektować i wyświetlić podgląd wiadomości kart JSON przeznaczonych do aplikacji Google Chat:
Otwórz kreator kartJak wyświetlają się błędy karty
Błędy karty są rejestrowane na kilka sposobów:
- Część karty, np. widżet lub komponent, nie wyświetla się lub nie renderuje w nieoczekiwany sposób.
- Cała karta się nie wyświetla.
- Okno zamyka się, nie otwiera lub nie wczytuje się.
Jeśli zauważysz takie zachowanie, oznacza to, że wystąpił błąd karty aplikacji.
Dla porównania: działający, wolny od błędów komunikat i okno
Zanim przyjrzysz się przykładom błędnych kart, zwróć uwagę na komunikat i okno karty roboczej. Aby zilustrować każdy przykładowy błąd i jego poprawkę, plik JSON tej karty jest modyfikowany przez wprowadzenie błędów.
komunikat karty bez błędów.
Oto działający, pozbawiony błędów komunikat z kartą z informacjami kontaktowymi, zawiera nagłówek, sekcje i widżety, np. ozdobiony tekst i przyciski.
Okno bez błędów
Oto działające, pozbawione błędów okno, które tworzy kontakt przez informacje od użytkowników (ze stopką) i edytowalne widżety, np. do wprowadzania tekstu i przełączniki, i przyciski:
Błąd: część karty się nie wyświetla
Czasami karty są renderowane, ale część, która powinna być widoczna, nie jest wyświetlana. prawdopodobne przyczyny to:
- Brak wymaganego pola JSON.
- W polu JSON zapisano literówkę lub wielkość liter.
Przyczyna: brak wymaganego pola JSON
W tym przykładowym błędzie brakuje wymaganego pola JSON title
. W efekcie karta jest renderowana, ale te części karty, które powinny się wyświetlić, nie. Jeśli pominiesz wymagane pola, trudno przewidzieć, jak będą renderowane karty.
Aby naprawić ten błąd, dodaj wymagane pole JSON. w tym przykładzie: title
.
Aby dowiedzieć się, czy pole JSON jest wymagane, zapoznaj się z dokumentacją kart w wersji 2. W tym przykładzie zapoznaj się z opisem pola title
na stronie CardHeader
.
Poniżej przedstawiamy dwa przykłady:
Przykład 1. Podanie atrybutu subtitle
, ale pominięcie wymaganego elementu title
spowoduje, że cały nagłówek będzie wyglądał pusty:
![Nagłówek tej karty się nie wyświetla, ponieważ brakuje wymaganego pola, tytułu.](https://developers-dot-devsite-v2-prod.appspot.com/static/workspace/chat/images/troubleshoot/troubleshoot-cards-missing-required-entity-header-title-1.png?authuser=4&hl=pl)
title
.Wyświetl fragment kodu JSON z błędnym traktowaniem karty
Błąd: w polu header
brakuje wymaganego pola title
.
. . . "header": { "subtitle": "Software Engineer" } . . .
Wyświetl prawidłowy fragment kodu JSON karty
Poprawiono: pole wymagane (title
) jest częścią specyfikacji header
.
. . . "header": { "title": "Sasha", "subtitle": "Software Engineer" } . . .
Przykład 2: określenie właściwości subtitle
, imageUrl
, imageType
i imageAltText
, ale pominięcie wymaganej wartości title
spowoduje, że obraz zostanie wyrenderowany zgodnie z oczekiwaniami, ale nie będzie wyświetlany podtytuł:
![Nagłówek tej karty się nie wyświetla, ponieważ brakuje wymaganego pola, tytułu.](https://developers-dot-devsite-v2-prod.appspot.com/static/workspace/chat/images/troubleshoot/troubleshoot-cards-missing-required-entity-header-title-2.png?authuser=4&hl=pl)
title
, ale obraz jest renderowany zgodnie z oczekiwaniami.Wyświetl fragment kodu JSON z błędnym traktowaniem karty
Błąd: w polu header
brakuje wymaganego pola title
.
. . . "header": { "subtitle": "Software Engineer", "imageUrl": "https://developers.google.com/chat/images/quickstart-app-avatar.png", "imageType": "CIRCLE", "imageAltText": "Avatar for Sasha", } . . .
Wyświetl prawidłowy fragment kodu JSON karty
Poprawiono: pole wymagane (title
) jest częścią specyfikacji header
.
. . . "header": { "title": "Sasha", "subtitle": "Software Engineer", "imageUrl": "https://developers.google.com/chat/images/quickstart-app-avatar.png", "imageType": "CIRCLE", "imageAltText": "Avatar for Sasha", } . . .
Przyczyna: nieprawidłowa pisownia lub użycie wielkich liter w pliku JSON
W tym przykładzie błąd JSON karty zawiera wszystkie wymagane pola, ale w jednym z pól imageUrl
nie jest poprawnie wyrenderowana litera imageURL
(wielkie litery R
wielkości L
), co powoduje błąd: obraz, do którego kieruje, nie jest renderowany.
Aby naprawić ten i inne podobne błędy, użyj prawidłowego formatowania JSON. W tym przypadku wartość imageUrl
jest poprawna. W razie wątpliwości porównaj kod JSON karty z dokumentem referencyjnym card.
![Nagłówek tej karty się nie wyświetla, ponieważ brakuje wymaganego pola, tytułu.](https://developers-dot-devsite-v2-prod.appspot.com/static/workspace/chat/images/troubleshoot/troubleshoot-cards-imageURL-instead-of-imageUrl.png?authuser=4&hl=pl)
title
, ale obraz jest renderowany zgodnie z oczekiwaniami.Wyświetl fragment kodu JSON z błędnym traktowaniem karty
Błąd: wielkość liter w polu imageURL
jest nieprawidłowa. Powinna być imageUrl
.
. . . "header": { "title": "Sasha", "subtitle": "Software Engineer", "imageURL": "https://developers.google.com/chat/images/quickstart-app-avatar.png", "imageType": "CIRCLE", "imageAltText": "Avatar for Sasha", } . . .
Wyświetl prawidłowy fragment kodu JSON karty
Poprawiono: wielkość liter w polu imageUrl
jest prawidłowa.
. . . "header": { "title": "Sasha", "subtitle": "Software Engineer", "imageUrl": "https://developers.google.com/chat/images/quickstart-app-avatar.png", "imageType": "CIRCLE", "imageAltText": "Avatar for Sasha", } . . .
Błąd: nie wyświetla się cała karta
Czasami karta się nie wyświetla. prawdopodobne przyczyny to:
- Widżet
ButtonList
został nieprawidłowo określony. - Widżet
CardFixedFooter
ma nieprawidłowo określony przycisk.
Przyczyna: nieprawidłowo określono atrybut buttonList
lub cardFixedFooter
Jeśli komunikat lub okno na karcie zawiera nieprawidłowo określony widżet ButtonList
lub widżet CardFixedFooter
z nieprawidłowo określonymi przyciskami, karta się nie wyświetli, a zamiast niej nic nie pojawi. Nieprawidłowe specyfikacje mogą obejmować brakujące pola, pola z niewłaściwą pisownią lub wielkimi literami albo niewłaściwą strukturę kodu JSON – np. brak przecinka, cudzysłowu lub nawiasów klamrowych.
Aby naprawić ten błąd, porównaj kod JSON karty z dokumentem referencyjnym card. W szczególności porównaj wszystkie widżety ButtonList
z przewodnikiem po widżetach ButtonList
.
Przykład: w przewodniku po widżetach ButtonList
przekazanie niepełnego działania onClick
w pierwszym przycisku uniemożliwia wyrenderowanie całej karty.
Wyświetl błędny fragment kodu JSON karty
Błąd: obiekt onClick
nie ma określonych pól, więc karta się nie pojawi.
. . . { "buttonList": { "buttons": [ { "text": "Share", "onClick": { } } }, { "text": "Edit", "onClick": { "action": { "function": "goToView", "parameters": [ { "key": "viewType", "value": "EDIT", } ], } } }, ], }, } . . .
Wyświetl prawidłowy fragment kodu JSON karty
Rozwiązany problem: obiekt onClick
ma teraz pole openLink
, więc karta jest wyświetlana zgodnie z oczekiwaniami.
. . . { "buttonList": { "buttons": [ { "text": "Share", "onClick": { "openLink": { "url": "https://example.com/share", } } }, { "text": "Edit", "onClick": { "action": { "function": "goToView", "parameters": [ { "key": "viewType", "value": "EDIT", } ], } } }, ], }, } . . .
Błąd: okno zamyka się, zacina lub nie otwiera się
Jeśli okno dialogowe nieoczekiwanie się zamyka, nie ładuje się lub nie otwiera, najprawdopodobniej jest to problem z interfejsem karty.
Oto najczęstsze przyczyny:
- Widżet
CardFixedFooter
nie zawiera elementuprimaryButton
. - Przycisk w widżecie
CardFixedFooter
nie ma działaniaonClick
lub jego działanieonClick
zostało określone nieprawidłowo. - W widżecie
TextInput
brakuje polaname
.
Przyczyna: CardFixedFooter
nie ma wartości primaryButton
W oknach z widżetem CardFixedFooter
wymagane jest określenie primaryButton
zarówno z tekstem, jak i kolorem. Pominięcie elementu primaryButton
lub jego nieprawidłowe ustawienie uniemożliwia wyświetlenie całego okna.
Aby naprawić ten błąd, upewnij się, że widżet CardFixedFooter
zawiera prawidłowo określony primaryButton
.
Wyświetl błędny fragment kodu JSON karty
Błąd: obiekt fixedFooter
nie ma określonego pola primaryButton
, przez co okno nie może się załadować lub otworzyć.
. . . "fixedFooter": { "onClick": { . . . }, "secondaryButton": { . . . } } } . . .
Wyświetl prawidłowy fragment kodu JSON karty
Naprawiono: okno fixedFooter
ma teraz określone pole primaryButton
, więc okno działa zgodnie z oczekiwaniami.
. . . "fixedFooter": { "primaryButton": { "text": "Submit", "color": { "red": 0, "blue": 1, "green": 0 }, "onClick": { . . . }, "secondaryButton": { . . . } } } . . .
Przyczyna: nieprawidłowe ustawienie onClick
w FixedFooter
w oknach z widżetem CardFixedFooter
z nieprawidłowym określeniem ustawienia onClick
dla dowolnego przycisku lub pominięciem go, przez co okno może się zamknąć, załadować lub nie otworzyć.
Aby naprawić ten błąd, sprawdź, czy każdy przycisk zawiera poprawnie określone ustawienie onClick
.
Wyświetl błędny fragment kodu JSON karty
Błąd: obiekt primaryButton
zawiera pole onClick
z błędną tablicą „parameters” (parametry), co powoduje, że nie można załadować lub otworzyć okna.
. . . "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" } } } } . . .
Wyświetl prawidłowy fragment kodu JSON karty
Poprawiono: obiekt primaryButton
ma pole onClick
z prawidłowo napisaną tablicą „parameters”, więc okno działa zgodnie z oczekiwaniami.
. . . "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" } } } } . . .
Przyczyna: TextInput
nie ma wartości name
Jeśli okno zawiera widżet TextInput
, który wyklucza pole name
, nie działa ono zgodnie z oczekiwaniami. Oprogramowanie może się zamknąć lub otworzyć, ale nie można go załadować lub się nie otwiera.
Aby naprawić ten błąd, upewnij się, że każdy widżet TextInput
zawiera odpowiednie pole name
. Upewnij się, że każde pole name
na karcie jest unikalne.
Wyświetl błędny fragment kodu JSON karty
Błąd: obiekt textInput
nie ma określonego pola name
, przez co okno się zamyka, nie wczytuje się lub nie otwiera.
. . . { "textInput": { "label": "Name", "type": "SINGLE_LINE", } } . . .
Wyświetl prawidłowy fragment kodu JSON karty
Naprawiono: okno textInput
ma teraz określone pole name
, więc okno działa zgodnie z oczekiwaniami.
. . . { "textInput": { "label": "Name", "type": "SINGLE_LINE", "name": "contactName" } } . . .
Działania związane z otwarciem, przesłaniem i anulowaniem okna kończą się niepowodzeniem w przypadku asynchronicznej architektury aplikacji
Jeśli aplikacja Google Chat zwraca komunikat o błędzie
Could not load dialog. Invalid response returned by bot.
podczas pracy z:
okna dialogowe, może to być spowodowane tym, że Twoja aplikacja
korzysta z architektury asynchronicznej, takiej jak
Cloud Pub/Sub lub
Utwórz metodę interfejsu API wiadomości.
Otwarcie, przesłanie lub anulowanie okna wymaga
odpowiedź synchroniczną z aplikacji Google Chat z parametrem
DialogEventType
.
Aplikacje nie obsługują okien dialogowych
oparte na architekturze asynchronicznej.
Aby obejść ten problem, użyj komunikat na karcie zamiast okna.
Inne błędy kart i błędów okien
Jeśli poprawki opisane na tej stronie nie rozwiązują problemu z kartami w aplikacji, wyślij zapytanie w dzienniki błędów aplikacji. Wysyłanie zapytań dotyczących logów może ułatwić znajdowanie błędów w formacie JSON karty lub kodzie aplikacji. Dzienniki zawierają opisowe komunikaty o błędach, które ułatwiają ich naprawienie.
Powiązane artykuły
Jeśli potrzebujesz pomocy w naprawianiu błędów w aplikacji Google Chat, zapoznaj się z artykułami Rozwiązywanie problemów z aplikacją Google Chat i rozwiązywanie problemów z nią oraz Debugowanie aplikacji Google Chat.