Neste codelab, você aprenderá a criar um cliente frontend de front-end para criar uma experiência de conversação para um app Dialogflow. Especificamente, você fará o seguinte:
- Faça o download, configure e execute o cliente de front-end do Python.
- Configurar o endpoint detectIntent do Dialogflow a ser chamado pelo cliente de front-end do Python.
- Implantar o aplicativo no Google Cloud no App Engine.
- Teste se os convites do Agenda estão sendo configurados por solicitação do usuário.
Prerequisites
Antes de continuar, conclua os codelabs a seguir:
- Criar um agendamento de horários com o Dialogflow
- Noções básicas sobre entidades no Dialogflow
- Entenda o fulfillment integrando o Dialogflow ao Agenda
O que você vai aprender
- Como configurar e executar um cliente de front-end do Flutter para o Dialogflow
- Como implantar o cliente de front-end do Flutter no Google Cloud no App Engine
- Como testar um app do Dialogflow em um front-end personalizado
O que você vai criar
- Você vai configurar e executar um cliente de front-end do Flutter para o Dialogflow.
- Você implantará o cliente de front-end do Python no Google Cloud no App Engine.
- Você testará um app do Dialogflow usando esse front-end personalizado.
Pré-requisitos
- Noções básicas do Python
- Conhecimento básico do Dialogflow
Você usará a experiência de conversa do Agendador de horários, que criou anteriormente, e criará um front-end personalizado para o app. Você criará o front-end com o ConfigMap, executará e testará localmente e o implantará no App Engine.
O usuário enviará uma solicitação de agendamento pelo front-end, que chamará a API Dialogflow Intent para configurar um horário na data e hora solicitadas. O fulfillment do Dialogflow enviará uma solicitação ao Agenda para definir o horário em questão e retornar uma confirmação ao usuário pelo Dialogflow.
O resultado final terá esta aparência:
- Clone o repositório na sua máquina local digitando este comando no terminal local do computador:
git clone https://github.com/priyankavergadia/Django-Dialogflow-Appointment-Scheduler.git
- Acesse o diretório que contém o código. Outra opção é fazer o download do exemplo como arquivo zip e extraí-lo.
cd Django-Dialogflow-Appointment-Scheduler
Quando implantado, o aplicativo usa o Cloud SQL Proxy integrado ao ambiente padrão do App Engine para se comunicar com sua instância do Cloud SQL. No entanto, para testar o aplicativo localmente, instale e use uma cópia local do Cloud SQL Proxy no seu ambiente de desenvolvimento. Para mais informações, consulte Sobre o Cloud SQL Proxy.
Para executar tarefas administrativas básicas na sua instância do Cloud SQL, use o cliente do Cloud SQL para MySQL.
Instalar o Cloud SQL Proxy
Faça o download do Cloud SQL Proxy e instale-o. O Cloud SQL Proxy é usado para se conectar à sua instância do Cloud SQL quando executado localmente.
Faça o download do proxy.
curl -o cloud_sql_proxy https://dl.google.com/cloudsql/cloud_sql_proxy.darwin.amd64
Torne o proxy executável.
chmod +x cloud_sql_proxy
Crie uma instância do Cloud SQL
- Crie uma instância de segunda geração do Cloud SQL para MySQL. Dê à instância o nome "polls-instance" ou algo semelhante. Pode levar alguns minutos para a instância ficar pronta. Depois de pronta, ela ficará visível na lista de instâncias.
- Use a ferramenta gcloud para executar o comando a seguir, em que
[YOUR_INSTANCE_NAME]
representa o nome da instância. Anote o valor mostrado para o nome da conexão da instância na próxima etapa, que é mostrado no formato[PROJECT_NAME]:[REGION_NAME]:[INSTANCE_NAME].
.
gcloud sql instances describe [YOUR_INSTANCE_NAME]
Se preferir, clique na instância para ver o nome da conexão da instância.
Inicializar a instância do Cloud SQL
Inicie o Cloud SQL Proxy usando o nome da conexão da instância da etapa anterior. Substitua [YOUR_INSTANCE_CONNECTION_NAME]
pelo valor registrado na etapa anterior. Isso estabelece uma conexão do computador local com a instância para fins de teste local. Mantenha o Cloud SQL Proxy em execução enquanto testa seu app localmente.
./cloud_sql_proxy -instances="[YOUR_INSTANCE_CONNECTION_NAME]"=tcp:3306
Em seguida, crie um novo usuário e banco de dados do Cloud SQL.
- Crie um banco de dados usando o Console do Google Cloud para a instância do Cloud SQL chamada polls-instance. Por exemplo, você pode inserir "polls" como o nome.
- Crie uma conta de usuário usando o Console do Cloud para a instância do Cloud SQL chamada polls-instance.
Definir as configurações do banco de dados
- Abra
mysite/settings.py
para edição. - Em dois locais, substitua
[YOUR-USERNAME]
e[YOUR-PASSWORD]
pelo nome de usuário e senha do banco de dados criados na seção anterior. Isso ajuda a configurar a conexão com o banco de dados para a implantação do App Engine e testes locais. - Na linha
‘HOST': ‘cloudsql/ [PROJECT_NAME]:[REGION_NAME]:[INSTAN
CE_NAME'
, substitua[PROJECT_NAME]:[REGION_NAME]:[INSTANCE_NAME]
pelo valor registrado na seção anterior. - Execute o seguinte comando e copie o valor de nome da conexão da instância de saída para a próxima etapa.
gcloud sql instances describe [YOUR_INSTANCE_NAME]
- Substitua
[YOUR-CONNECTION-NAME]
pelo valor registrado na seção anterior. - Substitua
[YOUR-DATABASE]
pelo nome escolhido na seção anterior.
# [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]
- Feche e salve
settings.py
.
- No console do Dialogflow, clique em . Na guia Geral ao lado de ID do projeto, clique em Google Cloud.
- Clique em Navigation menu ☰ > APIs & Services > Credentials.
- Clique em Criar credenciais > Conta de serviço.
- Em Detalhes da conta de serviço, digite "appointment-scheduler" como o Nome da conta de serviço e clique em Criar.
- Em Conceder acesso à conta de serviço ao projeto , clique em Continuar para pular.
- Em Conceda aos usuários acesso a essa conta de serviço (opcional), clique em Criar chave > JSON > Criar.
O download de um arquivo JSON será feito no seu computador, que será necessário nas seções de configuração a seguir.
- Na pasta do chat, substitua
AppointmentScheduler.json
pelo arquivo JSON de credenciais. - Em
views.py
na pasta de chat, mudeGOOGLE_PROJECT_ID = "<YOUR_PROJECT_ID>"
para o ID do projeto.
Para executar o app Python no seu computador local, é preciso configurar um ambiente de desenvolvimento Python, incluindo Python, pip e ChromeVox. Para ver instruções, consulte Como configurar um ambiente para desenvolvedores do Python.
- Crie um ambiente Python isolado e instale as dependências:
virtualenv env source env/bin/activate pip install -r requirements.txt
- Execute as migrações do Python para configurar os modelos.
python3 manage.py makemigrations python3 manage.py makemigrations polls python3 manage.py migrate
- Inicie um servidor da Web local:
python3 manage.py runserver
- No navegador da Web, digite http://localhost:8000/. Você verá uma página da Web simples como mostrado na captura de tela a seguir:
As páginas do aplicativo de amostra são entregues pelo servidor da Web Python em execução no seu computador. Quando estiver tudo pronto para avançar, pressione Control+S
(Command+S
no Macintosh) para interromper o servidor da Web local.
Execute o seguinte comando para mover todos os arquivos estáticos do app para a pasta especificada por STATIC_ROOT
no settings.py
:
python3 manage.py collectstatic
Faça upload do app executando o seguinte comando no diretório do app em que o arquivo app.yaml
está localizado:
gcloud app deploy
Aguarde a mensagem que informa sobre a atualização.
No navegador da Web, digite https://<your_project_id>.appspot.com.
Desta vez, sua solicitação é atendida por um servidor da Web em execução no ambiente padrão do App Engine.
O comando app deploy
implanta o aplicativo conforme descrito em app.yaml
e define a versão recém-implantada como padrão. Com isso, ela veicula todo o novo tráfego.
Acesse https://<your_project_id>.appspot.com e insira o seguinte:
- Usuário: "quot;Agendar um horário para registro do veículo amanhã às 15h".
- O bot de chat responde da seguinte maneira:
- O Agenda agenda a resposta.
Se você planeja concluir outros codelabs do Dialogflow, pule esta parte por enquanto e volte a ela mais tarde.
Excluir o agente do Dialogflow
- Clique em ao lado do seu agente.
- Na guia General, role até a parte inferior e clique em Delete This Agent.
- Digite Delete na janela exibida e clique em Excluir.
Você criou um bot de chat no Dialogflow e o integrou ao Agenda. Agora você é um desenvolvedor de bots de chat.
Saiba mais
Confira os recursos a seguir para saber mais:
- Integrar a API Vision ao Dialogflow
- Exemplos de código na página do Dialogflow no Github