Cette page a été traduite par l'API Cloud Translation.

Créer un client Django frontend pour une application Dialogflow

Dans cet atelier de programmation, vous allez apprendre à créer un client Django frontend pour créer une expérience conversationnelle pour une application Dialogflow. Plus précisément, vous allez effectuer les opérations suivantes :

Téléchargez, configurez et exécutez le client frontend Django.
Configurez le point de terminaison Dialogflow detectIntent pour qu'il soit appelé à partir du client frontend Django.
Déployez l'application sur Google Cloud sur App Engine.
Testez si les invitations Agenda sont configurées à la demande de l'utilisateur.

Prérequis

Avant de continuer, vous devez effectuer les ateliers de programmation suivants :

Points abordés

Configurer et exécuter un client frontend Django pour Dialogflow
Déployer le client frontend Django sur Google Cloud sur App Engine
Tester une application Dialogflow à partir d'une interface utilisateur personnalisée

Ce que vous allez faire

Vous allez configurer et exécuter un client frontend Django pour Dialogflow.
Vous allez déployer le client frontend Django sur Google Cloud dans App Engine.
Vous allez tester une application Dialogflow à partir de cette interface personnalisée.

Prérequis

Connaissances de base de Python
Avoir des connaissances de base sur Dialogflow

Vous allez utiliser l'expérience conversationnelle Appointment Scheduler que vous avez créée précédemment et créer une interface utilisateur personnalisée pour l'application. Vous allez créer l'interface utilisateur avec Django, l'exécuter et la tester localement, puis la déployer sur App Engine.

L'utilisateur enverra une demande de rendez-vous via l'interface utilisateur, qui appellera l'API Dialogflow detectIntent pour planifier un rendez-vous à la date et à l'heure demandées. Le fulfillment Dialogflow envoie ensuite une requête à l'agenda pour définir le rendez-vous correspondant et renvoie une confirmation à l'utilisateur via Dialogflow.

Le résultat final se présentera comme suit :

Clonez le dépôt sur votre machine locale en saisissant la commande suivante dans le terminal local de votre ordinateur :

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

Accédez au répertoire contenant le code. Vous pouvez également télécharger l'exemple en tant que fichier zip et l'extraire.

cd Django-Dialogflow-Appointment-Scheduler

Une fois déployée, votre application communique avec votre instance Cloud SQL via le proxy Cloud SQL intégré à l'environnement standard App Engine. Notez toutefois que pour tester votre application en local, vous devez installer et utiliser une copie locale du proxy Cloud SQL dans votre environnement de développement. Pour en savoir plus, consultez À propos du proxy Cloud SQL.

Pour effectuer des tâches administratives de base sur votre instance Cloud SQL, vous pouvez utiliser le client Cloud SQL pour MySQL.

Installer le proxy Cloud SQL

Téléchargez et installez le proxy Cloud SQL. Le proxy Cloud SQL permet de se connecter à votre instance Cloud SQL lorsqu'il est exécuté en local.

Téléchargez le proxy.

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

Rendez le proxy exécutable.

chmod +x cloud_sql_proxy

Créer une instance Cloud SQL

Créez une instance Cloud SQL pour MySQL de deuxième génération. Nommez l'instance "polls-instance" ou donnez-lui un nom similaire. La préparation de l'instance peut prendre quelques minutes. Une fois prête, celle-ci devrait apparaître dans la liste des instances.
Utilisez l'outil gcloud pour exécuter la commande suivante, en remplaçant [YOUR_INSTANCE_NAME] par le nom de votre instance. Notez la valeur affichée pour le nom de connexion de l'instance. Elle servira à l'étape suivante. Elle est au format [PROJECT_NAME]:[REGION_NAME]:[INSTANCE_NAME]..

gcloud sql instances describe [YOUR_INSTANCE_NAME]

Vous pouvez également cliquer sur l'instance pour afficher le nom de connexion de l'instance.

Initialiser votre instance Cloud SQL

Démarrez le proxy Cloud SQL en utilisant le nom de connexion de l'instance de l'étape précédente. Remplacez [YOUR_INSTANCE_CONNECTION_NAME] par la valeur que vous avez enregistrée à l'étape précédente. Cela permet d'établir une connexion depuis votre ordinateur local vers votre instance à des fins de test. N'arrêtez pas le proxy Cloud SQL lors du test local de votre application.

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

Créez ensuite un utilisateur et une base de données Cloud SQL.

Créez une base de données à l'aide de la console Google Cloud pour votre instance Cloud SQL nommée polls-instance. Par exemple, vous pouvez saisir "sondages" comme nom.
Créez un compte utilisateur à l'aide de la console Cloud pour votre instance Cloud SQL nommée polls-instance.

Configurer les paramètres de base de données

Ouvrez mysite/settings.py pour y apporter des modifications.
À deux endroits, remplacez [YOUR-USERNAME] et [YOUR-PASSWORD] par le nom d'utilisateur et le mot de passe de base de données que vous avez créés dans la section précédente. Cela permet de configurer la connexion à la base de données pour le déploiement d'App Engine et les tests locaux.
Dans la ligne ‘HOST': ‘cloudsql/ [PROJECT_NAME]:[REGION_NAME]:[INSTANCE_NAME],', remplacez [PROJECT_NAME]:[REGION_NAME]:[INSTANCE_NAME] par la valeur que vous avez enregistrée dans la section précédente.
Exécutez la commande suivante et copiez la valeur du nom de connexion de l'instance qui s'affiche. Elle servira à l'étape suivante.

gcloud sql instances describe [YOUR_INSTANCE_NAME]

Remplacez [YOUR-CONNECTION-NAME] par la valeur que vous avez enregistrée dans la section précédente.
Remplacez [YOUR-DATABASE] par le nom que vous avez choisi dans la section précédente.

# [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]

Enregistrez et fermez le fichier settings.py.

Dans la console Dialogflow, cliquez sur . Dans l'onglet Général, à côté de ID du projet, cliquez sur Google Cloud.
Cliquez sur le menu de navigation ☰ > API et services > Identifiants.
Cliquez sur Créer des identifiants > Compte de service.
Dans Détails du compte de service, saisissez "appointment-scheduler" comme Nom du compte de service, puis cliquez sur Créer.

Dans la section Autoriser ce compte de service à accéder au projet, cliquez sur Continuer pour l'ignorer.
Sur la page Accorder l'accès à ce compte de service à des utilisateurs (facultatif), cliquez sur Créer une clé > JSON > Créer.

Un fichier JSON sera téléchargé sur votre ordinateur. Vous en aurez besoin dans les sections de configuration suivantes.

Dans le dossier "chat", remplacez AppointmentScheduler.json par votre fichier JSON d'identifiants.
Dans views.py du dossier de chat, remplacez GOOGLE_PROJECT_ID = "<YOUR_PROJECT_ID>" par l'ID de votre projet.

Pour exécuter l'application Django sur votre ordinateur local, configurez un environnement de développement Python incluant Python, pip et virtualenv. Pour obtenir des instructions, consultez Configurer un environnement de développement Python.

Créez un environnement Python isolé et installez des dépendances :

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

Exécutez les migrations Django pour configurer vos modèles.

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

Démarrez un serveur Web local :

python3 manage.py runserver

Dans votre navigateur Web, saisissez http://localhost:8000/. Vous devriez voir une simple page Web, comme le montre la capture d'écran suivante :

Les pages de l'exemple d'application sont diffusées par le serveur Web Django exécuté sur votre ordinateur. Lorsque vous êtes prêt à poursuivre, appuyez sur Control+S (Command+S sur Macintosh) pour arrêter le serveur Web local.

Exécutez la commande suivante pour déplacer tous les fichiers statiques de l'application dans le dossier spécifié par STATIC_ROOT dans settings.py :

python3 manage.py collectstatic

Mettez l'application en ligne en exécutant la commande suivante dans le répertoire de l'application où se trouve le fichier app.yaml :

gcloud app deploy

Attendez le message vous informant que la mise à jour est terminée.

Dans votre navigateur Web, saisissez https://<your_project_id>.appspot.com.

Cette fois, votre demande est traitée par un serveur Web s'exécutant dans l'environnement standard App Engine.

La commande app deploy déploie l'application conformément aux instructions du fichier app.yaml, et définit la version nouvellement déployée comme version par défaut, de sorte que celle-ci diffuse tout le nouveau trafic.

Accédez à https://<your_project_id>.appspot.com et saisissez les informations suivantes :

Utilisateur : "Prends rendez-vous pour l'immatriculation du véhicule à 15h demain."
Le chatbot répond comme suit :

Agenda enregistre la réponse.

Si vous prévoyez de suivre d'autres ateliers de programmation Dialogflow, ignorez cette partie pour le moment et revenez-y plus tard.

Supprimer l'agent Dialogflow

Cliquez sur à côté de votre agent existant.

Dans l'onglet Général, faites défiler l'écran vers le bas, puis cliquez sur Supprimer cet agent.
Saisissez Supprimer dans la fenêtre qui s'affiche, puis cliquez sur Supprimer.

Vous avez créé un chatbot dans Dialogflow et l'avez intégré à Agenda. Vous êtes maintenant développeur de chatbots !

En savoir plus

Pour en savoir plus, consultez les ressources suivantes :

Intégrer l'API Vision à Dialogflow
Exemples de code sur la page Dialogflow GitHub

Créer un client Django frontend pour une application Dialogflow Restez organisé à l'aide des collections Enregistrez et classez les contenus selon vos préférences.

Prérequis

Points abordés

Ce que vous allez faire

Prérequis

Installer le proxy Cloud SQL

Créer une instance Cloud SQL

Initialiser votre instance Cloud SQL

Configurer les paramètres de base de données

Supprimer l'agent Dialogflow

En savoir plus

Créer un client Django frontend pour une application Dialogflow