W tym przewodniku opisujemy typowe błędy związane z kartami, które możesz napotkać, oraz sposoby ich naprawy.
Projektuj karty i wyświetl ich podgląd w kreatorze kart.
Otwórz kreator kartJak wyświetlają się błędy karty
Błędy kart mogą pojawiać się na kilka sposobów:
- Część karty, np. widżet lub komponent, nie wyświetla się lub nie wyświetla w nieoczekiwany sposób.
- Nie pojawi się cała karta.
- Okno zamyka się, nie otwiera się lub nie wczytuje.
Jeśli wystąpi ten błąd, oznacza to, że wystąpił błąd karty aplikacji.
W celach informacyjnych: działający, wolny od błędów komunikat i okno karty.
Przed przyjrzeniem się przykładom błędnych kart zapoznaj się najpierw z tym komunikatem i oknem działającej karty. Aby zilustrować każdy przykładowy błąd i jego rozwiązanie, plik JSON tej karty został zmodyfikowany przez wprowadzenie błędów.
Brak błędów dotyczących karty
Oto działający, pozbawiony błędów komunikat z kartą ze szczegółowymi informacjami kontaktowymi, który zawiera nagłówek, sekcje i widżety, np. ozdobiony tekst i przyciski:
Okno wolne od błędów
Oto działające, wolne od błędów okno, które tworzy kontakt dzięki zbieraniu informacji od użytkowników. Zawiera stopkę i widżety do edycji, takie jak wprowadzanie tekstu, przełączniki i przyciski:
Błąd: część karty się nie pojawia
Czasami karty renderują się, ale część karty, której oczekujesz, nie jest widoczna. Prawdopodobne przyczyny to:
- Brak wymaganego pola JSON.
- Tekst w polu JSON zawiera literówkę lub niewłaściwą wielkość liter.
Przyczyna: brak wymaganego pola JSON
W tym przykładowym błędzie brakuje wymaganego pola JSON (title
). W efekcie karta jest renderowana, ale jej fragmenty, które powinny się pojawić, nie są. Gdy wymagane pola zostaną pominięte, może być trudno przewidzieć, jak będą renderowane karty.
Aby naprawić ten błąd, dodaj wymagane pole JSON; w tym przykładzie jest to title
.
Aby sprawdzić, czy pole JSON jest wymagane, zapoznaj się z dokumentacją dotyczącą kart w wersji 2. W tym przykładzie zapoznaj się z opisem pola title
w witrynie CardHeader
.
Poniżej przedstawiamy dwa przykłady:
Przykład 1: określenie subtitle
, ale pominięcie wymaganego title
powoduje, że cały nagłówek wygląda na pusty:
Wyświetl błędny fragment kodu JSON karty
Błąd: w polu header
brakuje wymaganego pola title
.
. . . "header": { "subtitle": "Software Engineer" } . . .
Wyświetl prawidłowy fragment kodu JSON karty
Poprawiono: wymagane pole, title
, jest częścią specyfikacji header
.
. . . "header": { "title": "Sasha", "subtitle": "Software Engineer" } . . .
Przykład 2. Jeśli określisz subtitle
, imageUrl
, imageType
i imageAltText
, a pominiesz wymagany parametr title
, obraz będzie renderowany zgodnie z oczekiwaniami, ale bez podtytułu:
Wyświetl błędny fragment kodu JSON 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: wymagane pole, 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 nieprawidłowe użycie wielkich liter w pliku JSON
W tym przykładowym błędzie plik JSON karty zawiera wszystkie wymagane pola, ale jedno z nich imageUrl
zostało nieprawidłowo napisane jako imageURL
(wielka litera R
wielka litera L
), co powoduje błąd: obraz, który wskazuje, nie jest renderowany.
Aby naprawić ten i inne błędy, użyj prawidłowego formatowania JSON. W tym przypadku prawidłowa wartość to imageUrl
. W razie wątpliwości sprawdź plik JSON karty z dokumentem referencyjnym card.
Wyświetl błędny fragment kodu JSON karty
Błąd: w polu imageURL
została napisana nieprawidłowa wielkość liter. Powinna to 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
Stała: 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 pojawia się cała karta
Czasami karta nie wyświetla się. Prawdopodobne przyczyny to:
- Widżet
ButtonList
jest określony nieprawidłowo. - Widżet
CardFixedFooter
ma nieprawidłowo określony przycisk.
Przyczyna: nieprawidłowo określone pole buttonList
lub cardFixedFooter
Jeśli komunikat na karcie lub okno zawiera nieprawidłowo określony widżet ButtonList
lub CardFixedFooter
z nieprawidłowo określonymi przyciskami, karta nie będzie się wyświetlać w całości i nic nie pojawi się w jej miejscu. Nieprawidłowe specyfikacje mogą obejmować brakujące pola, pola zawierające niewłaściwą pisownię lub wielkość liter albo nieprawidłową strukturę pliku JSON, na przykład brakującego przecinka, cudzysłowu czy nawiasu klamrowego.
Aby naprawić ten błąd, sprawdź plik JSON karty z dokumentem referencyjnym karty. 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łnej czynności onClick
w pierwszym przycisku uniemożliwia renderowanie całej karty.
Wyświetl błędny fragment kodu JSON karty
Błąd: obiekt onClick
nie ma określonych pól, więc karta nie jest wyświetlana w całości.
. . . { "buttonList": { "buttons": [ { "text": "Share", "onClick": { } } }, { "text": "Edit", "onClick": { "action": { "function": "goToView", "parameters": [ { "key": "viewType", "value": "EDIT", } ], } } }, ], }, } . . .
Wyświetl prawidłowy fragment kodu JSON karty
Poprawiono: obiekt onClick
zawiera 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 się zamyka, zacina się lub nie otwiera się
Jeśli okno dialogowe nieoczekiwanie się zamyka, nie wczytuje się lub nie otwiera, prawdopodobną przyczyną jest problem z interfejsem karty.
Oto najczęstsze przyczyny:
- Widżet
CardFixedFooter
nie ma parametruprimaryButton
. - Przycisk w widżecie
CardFixedFooter
nie ma działaniaonClick
lub jego działanieonClick
jest określone nieprawidłowo. - W widżecie
TextInput
brakuje polaname
.
Przyczyna: CardFixedFooter
nie zawiera elementu primaryButton
W oknach dialogowych z widżetem CardFixedFooter
wymagane jest określenie elementu primaryButton
zarówno tekstu, jak i koloru. Pominięcie elementu primaryButton
lub jego nieprawidłowe ustawienie uniemożliwia wyświetlanie całego okna.
Aby naprawić ten błąd, upewnij się, że widżet CardFixedFooter
zawiera prawidłowo określony atrybut primaryButton
.
Wyświetl błędny fragment kodu JSON karty
Błąd: w obiekcie fixedFooter
nie określono pola primaryButton
, przez co nie można wczytać lub otworzyć okna dialogowego.
. . . "fixedFooter": { "onClick": { . . . }, "secondaryButton": { . . . } } } . . .
Wyświetl prawidłowy fragment kodu JSON karty
Poprawiono: 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 dialogowych z widżetem CardFixedFooter
nieprawidłowo określ ustawienie onClick
dla dowolnego przycisku lub zostanie ono pominięte, co spowoduje zamknięcie, problemy z wczytaniem lub nieotwarcie okna.
Aby naprawić ten błąd, sprawdź, czy każdy przycisk ma prawidłowo określone ustawienie onClick
.
Wyświetl błędny fragment kodu JSON karty
Błąd: obiekt primaryButton
zawiera pole onClick
z błędną tablicą „parameters”, przez co nie można wczytać lub otworzyć okna dialogowego.
. . . "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 zapisaną 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 zawiera elementu name
Jeśli okno zawiera widżet TextInput
, który wyklucza pole name
, okno nie działa zgodnie z oczekiwaniami. Przeglądarka może się zamknąć, otworzyć, ale nie uda się wczytać lub się nie otworzyć.
Aby naprawić ten błąd, sprawdź, czy 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: w obiekcie textInput
nie określono pola name
, co powoduje zamknięcie okna, wczytanie go lub nieudane otwarcie.
. . . { "textInput": { "label": "Name", "type": "SINGLE_LINE", } } . . .
Wyświetl prawidłowy fragment kodu JSON karty
Poprawiono: 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 otwarcia, przesyłania lub anulowania okna kończą się niepowodzeniem w przypadku asynchronicznej architektury aplikacji
Jeśli podczas pracy z oknami dialogowymi aplikacja do obsługi czatu zwraca komunikat o błędzie Could not load dialog. Invalid response returned by bot.
, może to być spowodowane korzystaniem przez nią z asynchronicznej architektury, takiej jak Cloud Pub/Sub lub metoda interfejsu API Create Message.
Otwarcie, przesłanie lub anulowanie okna wymaga odpowiedzi synchronicznej z aplikacji Google Chat za pomocą DialogEventType
.
W związku z tym okna nie są obsługiwane w aplikacjach z asynchroniczną architekturą.
Aby obejść ten problem, użyj komunikatu na karcie zamiast okna.
Inne błędy dotyczące karty i okna
Jeśli poprawki opisane na tej stronie nie rozwiązują problemu związanego z kartą w aplikacji, wyślij zapytanie do dzienników błędów aplikacji. Wykonywanie zapytań dotyczących logów pomaga znaleźć błędy w kodzie aplikacji lub pliku JSON karty. Logi zawierają opisowe komunikaty o błędach, które pomogą Ci w ich naprawieniu.
Powiązane artykuły
Jeśli potrzebujesz pomocy w naprawianiu błędów aplikacji Google Chat, zapoznaj się z artykułami Rozwiązywanie problemów z aplikacją Google Chat i ich rozwiązywanie oraz Debugowanie aplikacji Google Chat.