Ta strona została przetłumaczona przez Cloud Translation API.

Debugowanie aplikacji Google Chat

Jako deweloper aplikacji w Google Chat być może musisz debugować kod, aby testować zmiany i rozwiązywać złożone problemy. Debugowanie aplikacji do obsługi czatu można przeprowadzić na wiele różnych sposobów w zależności od architektury aplikacji, jak działa aplikacja, jak jest wdrożona i jakie są ustawienia.

Na tej stronie objaśniamy, jak debugować aplikację HTTP do obsługi czatu za pomocą ngrok, czyli ujednoliconą platformę ruchu przychodzącego, której można używać do testowania rozwiązań lokalnych środowiska programistycznego. W tym przewodniku testujesz zmiany w kodzie i rozwiązywać problemy w środowisku zdalnym.

Debuguj z lokalnego środowiska programistycznego

W tej sekcji korzystasz z aplikacji Google Chat, która będzie wykonywane w środowisku lokalnym.

Debuguj z programu lokalnego
środowisko

Rysunek 1. Debuguj w lokalnym środowisku programistycznym.

Warsztat

Node.js

Python

Java

Wymagania wstępne

Node.js

Najnowsze wersje aplikacji node i npm zainstalowana w Twoim lokalnym środowisku.
Najnowsza wersja aplikacji nodemon zainstalowana w Twoim regionie jest używany do automatycznego ponownego wczytywania:
```
npm install -g nodemon
```
Aplikacja do obsługi czatu HTTP skonfigurowana pod kątem i wysyłanie wiadomości. Możesz obserwować Wymagania wstępne Skonfiguruj i opublikuj aplikację w Google Czat Krótki przewodnik Jedyna różnica jest taka, że w polu Nazwa aplikacji musisz ustawić wartość Debug App oraz URL aplikacji na przykład na http://example.com.
IDE skonfigurowane w środowisku lokalnym z możliwością debugowania. Wykorzystujemy Visual Studio Code IDE i jego środowisko domyślne debugowania funkcji w w tym przewodniku.
Git zainstalowano w Twoim lokalnym środowisku.
konto ngrok,

Python

Najnowsza wersja aplikacji python3 zainstalowano w Twoim lokalnym środowisku.
Najnowsza wersja pip oraz Aplikacja virtualenv została zainstalowana w lokalnym środowisku, służą do zarządzania pakietami Pythona oraz środowisk Google Cloud.
Aplikacja do obsługi czatu HTTP skonfigurowana pod kątem i wysyłanie wiadomości. Możesz obserwować Wymagania wstępne Skonfiguruj i opublikuj aplikację w Google Czat Krótki przewodnik Jedyna różnica jest taka, że w polu Nazwa aplikacji musisz ustawić wartość Debug App oraz URL aplikacji na przykład na http://example.com.
IDE skonfigurowane w środowisku lokalnym z możliwością debugowania. Wykorzystujemy Visual Studio Code IDE i jego środowisko domyślne debugowania funkcji w w tym przewodniku.
Git zainstalowano w Twoim lokalnym środowisku.
konto ngrok,
Najnowsza wersja aplikacji gcloud zainstalowano i zainicjowane w w środowisku lokalnym.

Java

Najnowsza stabilna wersja aplikacji Java SE 11's JDK zainstalowana lokalnie dla środowiska.
Najnowsza wersja aplikacji Apache Maven jest zainstalowana w Twoim środowisku lokalnym, służy do zarządzania projektami Java.
Aplikacja do obsługi czatu HTTP skonfigurowana pod kątem i wysyłanie wiadomości. Możesz obserwować Wymagania wstępne Skonfiguruj i opublikuj aplikację w Google Czat Krótki przewodnik Jedyna różnica jest taka, że w polu Nazwa aplikacji musisz ustawić wartość Debug App oraz URL aplikacji na przykład na http://example.com.
IDE skonfigurowane w środowisku lokalnym z możliwością debugowania. Wykorzystujemy Visual Studio Code IDE i jego środowisko domyślne debugowania funkcji w w tym przewodniku.
Git zainstalowano w Twoim lokalnym środowisku.
konto ngrok,
Najnowsza wersja aplikacji gcloud zainstalowano i zainicjowane w w środowisku lokalnym.

Udostępnij usługę lokalnego hosta publicznie

Musisz połączyć lokalne środowisko z internetem, aby Aplikacja do obsługi czatu może uzyskać do niego dostęp. Używana jest aplikacja ngrok do przekierowywania żądań HTTP wysyłanych na publiczny adres URL do Twojego środowiska lokalnego.

W przeglądarce w środowisku lokalnym zaloguj się na konto ngrok.
Zainstaluj aplikację i skonfiguruj urządzenie authtoken w Twoim regionie. i środowisko.
Utwórz domenę statyczną w ngrok, nosi ono nazwę NGROK_STATIC_DOMAIN omówione w instrukcjach w tym przewodniku.

Konfigurowanie aplikacji Google Chat

Skonfiguruj aplikację Google Chat tak, aby wysyłała wszystkie żądania HTTP do: domenę statyczną.

W konsoli Google Cloud otwórz stronę interfejsu Google Chat API:

Otwórz stronę interfejsu Google Chat API
Kliknij kartę Configuration (Konfiguracja).
Otwórz Funkcje interaktywne > Ustawienia połączenia i ustaw wartość. pola tekstowego App Url na:
```
https://NGROK_STATIC_DOMAIN
```
Zastąp NGROK_STATIC_DOMAIN domeną statyczną w swoje konto ngrok.
Kliknij Zapisz.

Aplikacja Google Chat wysyła wszystkie swoje żądania HTTP do
domena statyczna

Rysunek 2. Aplikacja Google Chat wysyła wszystkie żądania HTTP do domeny statycznej. Służba publiczna ngrok jest pomostem między Aplikacja do obsługi czatu i uruchamiany kod aplikacji lokalnie.

Testowanie aplikacji Google Chat

Możesz lokalnie wdrażać, konfigurować, testować, debugować i automatycznie ładować ponownie aplikacja Google Chat.

Node.js

Klonowanie repozytorium googleworkspace/google-chat-samples z GitHuba do środowiska lokalnego, zawiera on kod aplikacji wykonaj:
```
git clone https://github.com/googleworkspace/google-chat-samples.git
```
Z IDE Visual Studio Code zainstalowanego w Twoim środowisku lokalnym wykonaj te czynności:
1. Otwórz folder w nowym oknie google-chat-samples/node/basic-app
2. Skonfiguruj aplikację pod kątem automatycznego ponownego ładowania debugowania przez dodanie 2 elementów skrypty w pliku package.json:
```
{
    ...
    "scripts": {
        ...
        "debug": "node --inspect index.js",
        "debug-watch": "nodemon --watch ./ --exec npm run debug"
    }
    ...
}
```
3. Zainstaluj aplikację z katalogu głównego:
```
npm install
```
4. Utwórz i skonfiguruj uruchomienie o nazwie Debug Watch, które aktywuje skrypt debug-watch przez utworzenie pliku .vscode/launch.json w katalogu głównym:
```
{
    "version": "0.2.0",
    "configurations": [{
        "type": "node",
        "request": "launch",
        "name": "Debug Watch",
        "cwd": "${workspaceRoot}",
        "runtimeExecutable": "npm",
        "runtimeArgs": ["run-script", "debug-watch"]
    }]
}
```
5. Dodaj punkt przerwania, który wstrzymuje przetwarzanie żądania HTTP w pliku index.js i uruchom debugowanie za pomocą Konfiguracja Debug Watch została dodana wcześniej. Aplikacja jest teraz uruchomione i nasłuchiwane żądania HTTP na porcie 9000.
  
  Rysunek 3. Aplikacja działa i nasłuchuje HTTP do portu 9000.
Uruchom aplikację ngrok w środowisku lokalnym:
```
ngrok http --domain=NGROK_STATIC_DOMAIN 9000
```
Zastąp NGROK_STATIC_DOMAIN domeną statyczną w swoje konto ngrok. Wszystkie prośby są teraz przekierowywane do i port używany przez aplikację.

Rysunek 4. Terminal z serwerem ngrok uruchomionym i przekierowującym.
Interfejs internetowy jest również uruchamiany na lokalnym hoście przez interfejs ngrok możesz monitorować wszystkie działania, otwierając ją w przeglądarce.

Rysunek 5. Interfejs internetowy hostowany przez aplikację ngrok nie wyświetla żadnych żądań HTTP.
Przetestuj aplikację Google Chat, wysyłając ją bezpośrednio wiadomość:
- Otwórz Google Chat.
  
  Otwórz Google Chat
- Kliknij Nowy czat .
- W oknie wpisz nazwę swojego aplikacja Google Chat.
- W wynikach wyszukiwania znajdź aplikację Google Chat, kliknij Dodaj >. Google Chat
- W pokoju czatu wpisz Hello i naciśnij enter. Twoje Aplikacja do obsługi czatu nie odpowiada, ponieważ jest aktywnie debugowania.
W narzędziu Visual Studio Code w Twoim środowisku lokalnym możesz zobaczyć, że wykonanie jest wstrzymane w ustawionym punkcie przerwania.

Rysunek 6. Wykonanie jest wstrzymane w ustawionym punkcie przerwania.
Gdy wznowisz wykonanie kodu z debugera Visual Studio Code przed upływem limitu czasu oczekiwania w Google Chat odpowiedzi: Your message : Hello.
Logi żądań i odpowiedzi HTTP możesz sprawdzić z poziomu interfejsu internetowego. hostowane przez aplikację ngrok w Twoim środowisku lokalnym.

Rysunek 7. Żądanie HTTP z interfejsu internetowego hostowanego przez ngrok aplikacja.
Aby zmienić działanie aplikacji, zamień Your message na Here was your message (w tekście 35) komponentu index.json. Po zapisaniu pliku, nodemon automatycznie ponownie załaduje aplikację z zaktualizowany kod źródłowy, a Visual Studio Code pozostaje w trybie debugowania.

Rysunek 8. Aplikacja działa i nasłuchuje żądań HTTP na porcie 9000 z załadowaną zmianą kodu.
Tym razem zamiast wysłać drugą wiadomość Hello w pokoju, może wybrać ostatnie żądanie HTTP zarejestrowane w interfejsie internetowym hostowanym przez aplikację ngrok w środowisku lokalnym i kliknij Replay. Tak jak ostatnio, aplikacja Google Chat nie odpowiada ponieważ trwa debugowanie.
Gdy wznowisz wykonanie kodu z debugera Visual Studio Code możesz zobaczyć z interfejsu internetowego hostowanego przez aplikację ngrok w środowisko lokalne, z którym aplikacja generuje odpowiedź zaktualizowana wersja wiadomości Here was your message : Hello.

Python

Uzyskiwanie nowych danych logowania użytkownika na potrzeby ustawienia Ustawienie domyślne aplikacji Dane logowania:
```
gcloud config set project PROJECT_ID
gcloud auth application-default login
```
Zamień PROJECT_ID na identyfikator projektu dla projektu Cloud aplikacji.
Klonowanie repozytorium googleworkspace/google-chat-samples z GitHuba do środowiska lokalnego, zawiera on kod aplikacji:
```
git clone https://github.com/googleworkspace/google-chat-samples.git
```
Z IDE Visual Studio Code zainstalowanego w Twoim środowisku lokalnym wykonaj te czynności:
1. Otwórz folder w nowym oknie google-chat-samples/python/avatar-app
2. Utwórz nowe środowisko wirtualne dla języka Python env i aktywuj je:
```
virtualenv env
source env/bin/activate
```
3. Zainstaluj wszystkie zależności projektu za pomocą interfejsu pip w środowisku wirtualnym środowisko:
```
pip install -r requirements.txt
```
4. Utwórz plik .vscode/launch.json w katalogu głównym i skonfiguruj uruchomienie o nazwie Debug Watch, które wyzwala aplikację z modułu functions-framework na porcie 9000 w trybie debugowania w środowisku wirtualnym env:
```
{
    "version": "0.2.0",
    "configurations": [{
        "type": "python",
        "request": "launch",
        "name": "Debug Watch",
        "python": "${workspaceFolder}/env/bin/python3",
        "module": "functions_framework",
        "args": [
            "--target", "avatar_app",
            "--port", "9000",
            "--debug"
        ]
    }]
}
```
5. Dodaj punkt przerwania, który wstrzymuje przetwarzanie żądania HTTP w pliku main.py i uruchom debugowanie za pomocą Konfiguracja Debug Watch została dodana wcześniej. Aplikacja jest teraz uruchomione i nasłuchiwane żądania HTTP na porcie 9000.
  
  Rysunek 3. Aplikacja działa i nasłuchuje HTTP do portu 9000.
Uruchom aplikację ngrok w środowisku lokalnym:
```
ngrok http --domain=NGROK_STATIC_DOMAIN 9000
```
Zastąp NGROK_STATIC_DOMAIN domeną statyczną w swoje konto ngrok. Wszystkie prośby są teraz przekierowywane do i port używany przez aplikację.

Rysunek 4. Terminal z serwerem ngrok uruchomionym i przekierowującym.
Interfejs internetowy jest również uruchamiany na lokalnym hoście przez interfejs ngrok możesz monitorować wszystkie działania, otwierając ją w przeglądarce.

Rysunek 5. Interfejs internetowy hostowany przez aplikację ngrok nie wyświetla żadnych żądań HTTP.
Przetestuj aplikację Google Chat, wysyłając ją bezpośrednio wiadomość:
- Otwórz Google Chat.
  
  Otwórz Google Chat
- Kliknij Nowy czat .
- W oknie wpisz nazwę swojego aplikacja Google Chat.
- W wynikach wyszukiwania znajdź aplikację Google Chat, kliknij Dodaj >. Google Chat
- W pokoju czatu wpisz Hey! i naciśnij enter. Twoje Aplikacja do obsługi czatu nie odpowiada, ponieważ trwa aktywnie debugowania.
W narzędziu Visual Studio Code w Twoim środowisku lokalnym możesz zobaczyć, że wykonanie jest wstrzymane w ustawionym punkcie przerwania.

Rysunek 6. Wykonanie jest wstrzymane w ustawionym punkcie przerwania.
Gdy wznowisz wykonanie kodu z debugera Visual Studio Code przed upływem limitu czasu oczekiwania w Google Chat odpowiedzi zawiera Twoją nazwę użytkownika oraz zdjęcie awatara w wiadomości.
Logi żądań i odpowiedzi HTTP możesz sprawdzić z poziomu interfejsu internetowego. hostowane przez aplikację ngrok w Twoim środowisku lokalnym.

Rysunek 7. Żądanie HTTP z interfejsu internetowego hostowanego przez ngrok aplikacja.
Aby zmienić działanie aplikacji, zamień Hello na Hey w tekście 51 z pliku main.py. Gdy zapiszesz plik, Visual Studio Code automatycznie wczytuje ponownie aplikację ze zaktualizowanym kodem źródłowym, pozostanie w trybie debugowania.

Rysunek 8. Aplikacja działa i nasłuchuje żądań HTTP na porcie 9000 z załadowaną zmianą kodu.
Tym razem zamiast wysłać drugą wiadomość Hey! w pokoju, może wybrać ostatnie żądanie HTTP zarejestrowane w interfejsie internetowym hostowanym przez aplikację ngrok w środowisku lokalnym i kliknij Replay. Tak jak ostatnio, aplikacja Google Chat nie odpowiada ponieważ trwa debugowanie.
Gdy wznowisz wykonanie kodu z debugera Visual Studio Code możesz zobaczyć z interfejsu internetowego hostowanego przez aplikację ngrok w środowisko lokalne, z którym aplikacja generuje odpowiedź zaktualizowaną wersję wiadomości.

Java

Uzyskiwanie nowych danych logowania użytkownika na potrzeby ustawienia Ustawienie domyślne aplikacji Dane logowania:
```
gcloud config set project PROJECT_ID
gcloud auth application-default login
```
Zamień PROJECT_ID na identyfikator projektu dla projektu Cloud aplikacji.
Klonowanie repozytorium googleworkspace/google-chat-samples z GitHuba w środowisku lokalnym zawiera on kod aplikacji:
```
git clone https://github.com/googleworkspace/google-chat-samples.git
```
Z IDE Visual Studio Code zainstalowanego w Twoim środowisku lokalnym wykonaj te czynności:
1. Otwórz folder w nowym oknie google-chat-samples/java/avatar-app
2. Skonfiguruj projekt Maven do uruchamiania aplikacji App port 9000 lokalnie przez dodanie kompilacji Cloud Functions Framework wtyczka function-maven-plugin w pliku pom.xml:
```
...
<plugin>
    <groupId>com.google.cloud.functions</groupId>
    <artifactId>function-maven-plugin</artifactId>
    <version>0.11.0</version>
    <configuration>
        <functionTarget>App</functionTarget>
        <port>9000</port>
    </configuration>
</plugin>
...
```
3. Możesz go teraz uruchomić lokalnie w trybie debugowania:
```
mvnDebug function:run
Preparing to execute Maven in debug mode
Listening for transport dt_socket at address: 8000
```
4. Utwórz plik .vscode/launch.json w katalogu głównym i skonfigurować uruchomienie o nazwie Remote Debug Watch, które wiąże się z plikiem aplikacja uruchomiona wcześniej na porcie 8000:
```
{
    "version": "0.2.0",
    "configurations": [{
        "type": "java",
        "request": "attach",
        "name": "Remote Debug Watch",
        "projectName": "http-function",
        "hostName": "localhost",
        "port": 8000
    }]
}
```
5. Dodaj punkt przerwania, który wstrzymuje przetwarzanie żądania HTTP w pliku App.java i rozpocznij załączanie i debugowanie za pomocą Konfiguracja Remote Debug Watch została dodana wcześniej. Ta aplikacja jest uruchomione i nasłuchujące żądania HTTP na porcie 9000.
  
  Rysunek 3. Aplikacja jest uruchomiona i nasłuchuje HTTP żądania do portu 9000.
Uruchom aplikację ngrok w środowisku lokalnym:
```
ngrok http --domain=NGROK_STATIC_DOMAIN 9000
```
Zastąp NGROK_STATIC_DOMAIN domeną statyczną w swoje konto ngrok. Wszystkie prośby są teraz przekierowywane do i port używany przez aplikację.

Rysunek 4. Terminal z serwerem ngrok uruchomionym i przekierowującym.
Interfejs internetowy jest również uruchamiany na lokalnym hoście przez interfejs ngrok możesz monitorować wszystkie działania, otwierając ją w przeglądarce.

Rysunek 5. Interfejs internetowy hostowany przez aplikację ngrok nie wyświetla żadnych żądań HTTP.
Przetestuj aplikację Google Chat, wysyłając ją bezpośrednio wiadomość:
- Otwórz Google Chat.
  
  Otwórz Google Chat
- Kliknij Nowy czat .
- W oknie wpisz nazwę swojego aplikacja Google Chat.
- W wynikach wyszukiwania znajdź aplikację Google Chat, kliknij Dodaj >. Google Chat
- W pokoju czatu wpisz Hey! i naciśnij enter. Twoje Aplikacja do obsługi czatu nie odpowiada, ponieważ trwa aktywnie debugowania.
W narzędziu Visual Studio Code w Twoim środowisku lokalnym możesz zobaczyć, że wykonanie jest wstrzymane w ustawionym punkcie przerwania.

Rysunek 6. Wykonanie jest wstrzymane w ustawionym punkcie przerwania.
Gdy wznowisz wykonanie kodu z debugera Visual Studio Code przed upływem limitu czasu oczekiwania w Google Chat odpowiedzi zawiera Twoją nazwę użytkownika oraz zdjęcie awatara w wiadomości.
Logi żądań i odpowiedzi HTTP możesz sprawdzić z poziomu interfejsu internetowego. hostowane przez aplikację ngrok w Twoim środowisku lokalnym.

Rysunek 7. Żądanie HTTP z interfejsu internetowego hostowanego przez ngrok aplikacja.
Aby zmienić działanie aplikacji, zamień Hello na Hey w tekście 55 pliku App.java, ponownie uruchom proces mvnDebug i uruchom ponownie aplikację Remote Debug Watch, aby podłączyć ją ponownie i uruchomić ponownie i debugowaniu.
Tym razem zamiast wysłać drugą wiadomość Hey! w pokoju, może wybrać ostatnie żądanie HTTP zarejestrowane w interfejsie internetowym hostowanym przez aplikację ngrok w środowisku lokalnym i kliknij Replay. Tak jak ostatnio, aplikacja Google Chat nie odpowiada ponieważ trwa debugowanie.
Gdy wznowisz wykonanie kodu z debugera Visual Studio Code możesz zobaczyć z interfejsu internetowego hostowanego przez aplikację ngrok w środowisko lokalne, z którym aplikacja generuje odpowiedź zaktualizowaną wersję wiadomości.

Debuguj ze środowiska zdalnego

W tej sekcji korzystasz z aplikacji Google Chat, która jest wykonywane w środowisku zdalnym.

Debuguj zdalnie
środowisko

Rysunek 9. Debuguj ze środowiska zdalnego.

Wymagania wstępne

Pokój czatu z Twoją aplikacją Google Chat. Dostępne opcje postępuj zgodnie z sekcją Przetestuj aplikację Google Chat na Krótki przewodnik i wyszukiwanie Żeby go uruchomić, otwórz aplikację Google Chat.
Twoja aplikacja działająca w środowisku zdalnym z debugerem włączony na danym porcie, odwołuje się on do: REMOTE_DEBUG_PORT.
Środowisko lokalne może ssh z Twoim środowiskiem zdalnym.
IDE skonfigurowane w środowisku lokalnym z możliwością debugowania. Wykorzystujemy Visual Studio Code IDE i jego środowisko domyślne funkcji debugowania w tej do celów ilustracyjnych.

Połącz środowiska lokalne i zdalne

w środowisku lokalnym, z którego chcesz zainicjować klienta debugowania; skonfiguruj tunel SSH:

ssh -L LOCAL_DEBUG_PORT:localhost:REMOTE_DEBUG_PORT REMOTE_USERNAME@REMOTE_ADDRESS

Zastąp następujące elementy:

LOCAL_DEBUG_PORT: port debugowania w sieci lokalnej dla środowiska.
REMOTE_USERNAME: nazwa użytkownika w środowisku zdalnym.
REMOTE_ADDRESS: adres środowiska zdalnego.
REMOTE_DEBUG_PORT: port debugowania na pilocie dla środowiska.

Port debugowania w środowisku lokalnym jest teraz połączony z portem debugowania w i środowisku zdalnemu.

Rozpocznij debugowanie

W środowisku IDE Visual Studio Code zainstalowanego w Twoim środowisku lokalnym wykonaj :

W nowym oknie otwórz kod źródłowy aplikacji.

Utwórz plik .vscode/launch.json w katalogu głównym i skonfiguruj uruchom o nazwie Debug Remote i dołącza do portu debugowania w środowisku lokalnym środowisko:

Node.js

{
    "version": "0.2.0",
    "configurations": [{
        "type": "node",
        "request": "attach",
        "name": "Debug Remote",
        "address": "127.0.0.1",
        "port": LOCAL_DEBUG_PORT
    }]
}

Python

{
    "version": "0.2.0",
    "configurations": [{
        "type": "python",
        "request": "attach",
        "name": "Debug Remote",
        "connect": {
            "host": "127.0.0.1",
            "port": LOCAL_DEBUG_PORT
        }
    }]
}

Java

{
    "version": "0.2.0",
    "configurations": [{
        "type": "java",
        "request": "attach",
        "name": "Debug Remote",
        "hostName": "127.0.0.1",
        "port": LOCAL_DEBUG_PORT
    }]
}

Zastąp LOCAL_DEBUG_PORT portem debugowania w w środowisku lokalnym.

Dodaj w kodzie źródłowym aplikacji punkt przerwania, który wstrzymuje żądanie HTTP przetwarzanie danych i rozpoczęcie uruchamiania debugowanie przy użyciu konfiguracji Debug Remote dodanej wcześniej.

W pokoju czatu w aplikacji Google Chat wpisz wszystko, co chcesz sprawdzić, i naciśnij enter. Twoje Aplikacja do obsługi czatu nie odpowiada, ponieważ jest aktywna debugowane w środowisku IDE Visual Studio Code.

Powiązane artykuły

Dowiedz się, jak włączyć logi błędów query.
Jak naprawić aplikację Google Chat błędy takie jak „Aplikacja nie odpowiada”, „Google Chat API”. jest dostępna tylko dla użytkowników Google Workspace” lub „Użytkownicy można wykluczyć z pokoi”.
Dowiedz się, jak naprawić błędy kart, takie jak komunikaty o kartach. oknach lub podglądy linków, które nie są renderowane bądź nie działają zgodnie z oczekiwaniami.