Tworzenie klienta Django frontendu dla aplikacji Dialogflow

1. Zanim zaczniesz

W tym ćwiczeniu z programowania dowiesz się, jak utworzyć klienta Django po stronie frontend, aby zapewnić tryb konwersacyjny aplikacji Dialogflow. W szczególności wykonasz te czynności:

Pobierz, skonfiguruj i uruchom klienta frontendowego Django.
Skonfiguruj punkt końcowy detectIntent Dialogflow, aby można go było wywoływać z klienta frontendu Django.
wdrożyć aplikację w Google Cloud w App Engine,
Sprawdź, czy zaproszenia w Kalendarzu są konfigurowane zgodnie z prośbą użytkownika.

Wymagania wstępne

Zanim przejdziesz dalej, musisz ukończyć te ćwiczenia:

Czego się nauczysz

Konfigurowanie i uruchamianie klienta frontendowego Django dla Dialogflow
Wdrażanie klienta frontendu Django w Google Cloud w App Engine
Testowanie aplikacji Dialogflow z niestandardowego interfejsu

Co utworzysz

Skonfigurujesz i uruchomisz klienta frontendu Django dla Dialogflow.
Wdrożysz klienta frontendu Django w Google Cloud w App Engine.
Będziesz testować aplikację Dialogflow z tego niestandardowego interfejsu.

Czego potrzebujesz

podstawowa znajomość języka Python,
Podstawowa znajomość Dialogflow

2. Omówienie architektury

Użyjesz utworzonego wcześniej interfejsu konwersacyjnego Harmonogramu spotkań i stworzysz niestandardowy interfejs aplikacji. Zbudujesz go za pomocą Django, uruchomisz i przetestujesz lokalnie, a następnie wdrożysz w App Engine.

Użytkownik wyśle prośbę o spotkanie za pomocą interfejsu, który wywoła interfejs Dialogflow detectIntent API, aby umówić spotkanie na wybraną datę i godzinę. Realizacja Dialogflow wyśle wtedy do Kalendarza prośbę o ustawienie odpowiedniego spotkania i zwróci użytkownikowi potwierdzenie za pomocą Dialogflow.

Wynik końcowy będzie wyglądać tak:

3. Pobieranie i uruchamianie aplikacji frontendowej

Sklonuj repozytorium na komputer lokalny, wpisując to polecenie w lokalnym terminalu komputera:

git clone https://github.com/priyankavergadia/Django-Dialogflow-Appointment-Scheduler.git

Przejdź do katalogu zawierającego kod. Możesz też pobrać próbkę w formacie ZIP i ją rozpakować.

cd Django-Dialogflow-Appointment-Scheduler

4. Konfigurowanie środowiska lokalnego

Po wdrożeniu aplikacja używa serwera proxy Cloud SQL wbudowanego w środowisko standardowe App Engine do komunikacji z instancją Cloud SQL. Aby jednak przetestować aplikację lokalnie, musisz zainstalować i użyć lokalnej kopii serwera proxy Cloud SQL w środowisku programistycznym. Więcej informacji znajdziesz w artykule Informacje o serwerze proxy Cloud SQL.

Aby wykonywać podstawowe zadania administracyjne na instancji Cloud SQL, możesz użyć klienta Cloud SQL for MySQL.

Instalowanie Cloud SQL Proxy

Pobierz i zainstaluj serwer proxy Cloud SQL. Serwer proxy Cloud SQL służy do łączenia się z instancją Cloud SQL podczas uruchamiania lokalnego.

Pobierz serwer proxy.

curl -o cloud_sql_proxy https://dl.google.com/cloudsql/cloud_sql_proxy.darwin.amd64

Ustaw plik serwera proxy jako wykonywalny.

chmod +x cloud_sql_proxy

Tworzenie instancji Cloud SQL

Utwórz instancję Cloud SQL for MySQL drugiej generacji. Nazwij instancję „polls-instance” lub podobnie. Przygotowanie instancji może potrwać kilka minut. Gdy będzie gotowa, powinna być widoczna na liście instancji.
Użyj narzędzia gcloud, aby uruchomić to polecenie, gdzie [YOUR_INSTANCE_NAME] to nazwa instancji. Zapisz wartość wyświetlaną w przypadku nazwy połączenia instancji, która będzie potrzebna w następnym kroku. Jest ona podana w formacie [PROJECT_NAME]:[REGION_NAME]:[INSTANCE_NAME].

gcloud sql instances describe [YOUR_INSTANCE_NAME]

Możesz też kliknąć instancję, aby wyświetlić Nazwę połączenia instancji.

Inicjowanie instancji Cloud SQL

Uruchom serwer proxy Cloud SQL, używając nazwy połączenia instancji z poprzedniego kroku. Zastąp [YOUR_INSTANCE_CONNECTION_NAME] wartością zapisaną w poprzednim kroku. Ustanawia to połączenie między komputerem lokalnym a instancją na potrzeby testów lokalnych. Podczas testowania aplikacji lokalnie serwer proxy Cloud SQL powinien być uruchomiony.

./cloud_sql_proxy -instances="[YOUR_INSTANCE_CONNECTION_NAME]"=tcp:3306

Następnie utwórz nowego użytkownika i bazę danych Cloud SQL.

Utwórz nową bazę danych za pomocą konsoli Google Cloud dla instancji Cloud SQL o nazwie polls-instance. Możesz na przykład wpisać „ankiety”.
Utwórz nowe konto użytkownika w konsoli Google Cloud dla instancji Cloud SQL o nazwie polls-instance.

Konfigurowanie ustawień bazy danych

Otwórz plik mysite/settings.py do edycji.
W 2 miejscach zastąp [YOUR-USERNAME] i [YOUR-PASSWORD] nazwą użytkownika i hasłem bazy danych utworzonymi w poprzedniej sekcji. Pomaga to skonfigurować połączenie z bazą danych na potrzeby wdrożenia w App Engine i testowania lokalnego.
W wierszu ‘HOST': ‘cloudsql/ [PROJECT_NAME]:[REGION_NAME]:[INSTANCE_NAME],' zastąp [PROJECT_NAME]:[REGION_NAME]:[INSTANCE_NAME] wartością zapisaną w poprzedniej sekcji.
Uruchom to polecenie i skopiuj wartość nazwy połączenia instancji, która pojawi się w danych wyjściowych. Będzie ona potrzebna w następnym kroku.

gcloud sql instances describe [YOUR_INSTANCE_NAME]

Zastąp [YOUR-CONNECTION-NAME] wartością zapisaną w poprzedniej sekcji.
Zastąp [YOUR-DATABASE] nazwą wybraną w poprzedniej sekcji.

# [START db_setup]
if os.getenv('GAE_APPLICATION', None):
    # Running on production App Engine, so connect to Google Cloud SQL using
    # the unix socket at /cloudsql/<your-cloudsql-connection string>
    DATABASES = {
        'default': {
            'ENGINE': 'django.db.backends.mysql',
            'HOST': '/cloudsql/[PROJECT_NAME]:[REGION_NAME]:[INSTANCE_NAME]',
            'USER': '[YOUR-USERNAME]',
            'PASSWORD': '[YOUR-PASSWORD]',
            'NAME': '[YOUR-DATABASE]',
        }
    }
else:
    # Running locally so connect to either a local MySQL instance or connect to
    # Cloud SQL via the proxy. To start the proxy via command line:
    #     $ cloud_sql_proxy -instances=[INSTANCE_CONNECTION_NAME]=tcp:3306
    # See https://cloud.google.com/sql/docs/mysql-connect-proxy
    DATABASES = {
        'default': {
            'ENGINE': 'django.db.backends.mysql',
            'HOST': '127.0.0.1',
            'PORT': '3306',
            'NAME': '[YOUR-DATABASE]',
            'USER': '[YOUR-USERNAME]',
            'PASSWORD': '[YOUR-PASSWORD]'
        }
    }
# [END db_setup]

Zamknij i zapisz settings.py.

5. Konfigurowanie konta usługi

W konsoli Dialogflow kliknij . Na karcie Ogólne obok Identyfikator projektu kliknij Google Cloud.
Kliknij Menu nawigacyjne ☰ > Interfejsy API i usługi > Dane logowania.
Kliknij Utwórz dane logowania > Konto usługi.
W sekcji Szczegóły konta usługi wpisz „appointment-scheduler” jako Nazwę konta usługi, a następnie kliknij Utwórz.

W sekcji Przyznaj temu kontu usługi dostęp do projektu kliknij Dalej, aby pominąć ten krok.
W sekcji Przyznaj użytkownikom dostęp do tego konta usługi (opcjonalnie) kliknij Utwórz klucz > JSON > Utwórz.

Na komputer zostanie pobrany plik JSON, który będzie potrzebny w kolejnych sekcjach konfiguracji.

6. Skonfiguruj punkt końcowy detectIntent Dialogflow, aby można go było wywoływać z aplikacji.

W folderze chat zastąp AppointmentScheduler.json plikiem JSON z danymi logowania.
W pliku views.py w folderze czatu zmień GOOGLE_PROJECT_ID = "<YOUR_PROJECT_ID>" na identyfikator projektu.

7. Kompilowanie i uruchamianie aplikacji lokalnie

Aby uruchomić aplikację Django na komputerze lokalnym, musisz skonfigurować środowisko programistyczne Pythona, w tym Python, pip i virtualenv. Instrukcje znajdziesz w artykule Konfigurowanie środowiska programistycznego w Pythonie.

Utwórz izolowane środowisko Pythona i zainstaluj zależności:

virtualenv env
source env/bin/activate
pip install -r requirements.txt

Uruchom migracje Django, aby skonfigurować modele.

python3 manage.py makemigrations
python3 manage.py makemigrations polls
python3 manage.py migrate

Uruchom lokalny serwer WWW.

python3 manage.py runserver

W przeglądarce wpisz http://localhost:8000/. Powinna wyświetlić się prosta strona internetowa, jak na tym zrzucie ekranu:

Strony przykładowej aplikacji są dostarczane przez serwer WWW Django działający na Twoim komputerze. Gdy wszystko będzie gotowe, naciśnij Control+S (Command+S na komputerze Macintosh), aby zatrzymać lokalny serwer WWW.

8. Wdrażanie aplikacji w standardowym środowisku App Engine

Uruchom to polecenie, aby przenieść wszystkie pliki statyczne aplikacji do folderu określonego przez STATIC_ROOT w settings.py:

python3 manage.py collectstatic

Prześlij aplikację, uruchamiając to polecenie w katalogu aplikacji, w którym znajduje się plik app.yaml:

gcloud app deploy

Poczekaj na komunikat z informacją o zakończeniu aktualizacji.

9. Testowanie klienta frontendowego

W przeglądarce wpisz https://<your_project_id>.appspot.com.

Tym razem Twoje żądanie jest obsługiwane przez serwer WWW działający w standardowym środowisku App Engine.

Polecenie app deploy wdraża aplikację zgodnie z opisem w app.yaml i ustawia nowo wdrożoną wersję jako domyślną, co powoduje, że obsługuje ona cały nowy ruch.

10. Produkcja

11. Gdy wszystko będzie gotowe do wyświetlania treści w środowisku produkcyjnym, zmień zmienną DEBUG na False w pliku mysite/settings.py.

12. Testowanie czatbota

Otwórz stronę https://<your_project_id>.appspot.com i wpisz:

Użytkownik: „Umów mnie na jutro na godzinę 15:00 na rejestrację pojazdu”.
Chatbot odpowie w ten sposób:

Kalendarz zarezerwuje odpowiedź.

13. Czyszczenie danych

Jeśli planujesz ukończyć inne laboratoria kodowe Dialogflow, na razie pomiń tę część i wróć do niej później.

Usuwanie agenta Dialogflow

Kliknij obok istniejącego agenta.
Na karcie Ogólne przewiń do dołu i kliknij Usuń tego agenta.
W wyświetlonym oknie wpisz Usuń i kliknij Usuń.

14. Gratulacje

Czatbot został utworzony w Dialogflow i zintegrowany z Kalendarzem. Jesteś teraz programistą czatbota.

Więcej informacji

Więcej informacji znajdziesz w tych materiałach:

Integracja interfejsu Vision API z Dialogflow
Przykłady kodu na stronie Dialogflow w GitHubie