Dialogflow is a natural language understanding (NLU) platform provided by Google. It is used to design and integrate conversational user interfaces into mobile and web apps, devices, bots, and interactive voice systems. In this tutorial, we’ll demonstrate how to integrate with the Dialogflow and Vonage SMS APIs to build a quiz bot that interacts with the end user via SMS. We won’t be covering every piece of the application, so if you’re starting from scratch check out the full project repo (or read one of our previous tutorials on Flask development from the ground up!)
Vonage API Account
To complete this tutorial, you will need a Vonage API account. If you don’t have one already, you can sign up today and start building with free credit. Once you have an account, you can find your API Key and API Secret at the top of the Vonage API Dashboard.
This tutorial also uses a virtual phone number. To purchase one, go to Numbers > Buy Numbers and search for one that meets your needs.
Create an Application
We will begin by using the Nexmo CLI mode to create an app. Install the Nexmo CLI on your machine as follows:
|
1 2 |
npm install nexmo-cli@beta -g |
Create a directory for your application locally:
|
1 2 |
mkdir your-application |
Inside the directory, run the following command:
|
1 2 |
nexmo app:create |
In the interactive CLI mode:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 |
Application Name: your-app-name Select capabilities: press the space bar to select voice, messages and rtc Use default HTTP methods?: yes Voice answer url: press enter to leave it as default (https://example.com) Voice Fallback Answer URL: Optional Voice Event URL: press enter to leave it as default (https://example.com) Messages Inbound URL: use ngrok to create a URL and add '/update/' on the end Messages Status URL: press enter to leave it as default (https://example.com) RTC Event URL: press enter Public key path: press enter Private Key path: your private key (downloadable from the nexmo dashboard) |
The application should now be created. Visit the dashboard and navigate to Applications. Your shiny new app should be listed there.
Set Up the Dialogflow Agent
To set up the Dialogflow agent, visit https://console.cloud.google.com and create a new project:
Take note of the PROJECT ID. Enable the Dialogflow API from the list of APIs:
Visit https://dialogflow.cloud.google.com to create a new agent:
To make it easy to get your application up and running, I’ve included a zip file in the GitHub repo for this project. Navigate to the dialogflow directory, and under resources download the quizzie.zip file. This zip is exported from the Dialogflow settings page and it contains all the intents, contexts, and responses required to set up an agent on the Dialogflow dashboard.
On the Dialogflow dashboard, click Settings and navigate to Export/Import. Import the zip file we just downloaded:
Our Dialogflow quiz agent is all set up and ready to go!
For the next steps, we need to create the logic that will handle the back and forth messaging between the end user and our Dialogflow agent.
Application Code
We want to write an interface for sending an SMS to the end user. First, make sure you have the Nexmo Python library installed:
|
1 2 |
pip install nexmo |
The function for sending an SMS looks like this:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 |
import nexmo import os import json def nexmo_sms(sms, recipient): NEXMO_API_KEY = os.getenv("NEXMO_API_KEY") NEXMO_API_SECRET = os.getenv("NEXMO_API_SECRET") NEXMO_NUMBER = os.getenv("NEXMO_NUMBER") client = nexmo.Client(key=NEXMO_API_KEY, secret=NEXMO_API_SECRET) response_data = client.send_message( { "from": NEXMO_NUMBER, "to": recipient, "text": sms, } ) if response_data["messages"][0]["status"] == "0": return json.dumps("Message sent successfully.") else: return json.dumps(f"Message failed with error: {response_data['messages'][0]['error-text']}") |
Next add the code that will notify our customer:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 |
#! /usr/bin/env python3 import argparse import sys import os from dotenv import load_dotenv sys.path.append('../') from vonage.nexmo import nexmo_sms APP_ROOT = os.path.join(os.path.dirname(__file__), '..') # refers to application_top dotenv_path = os.path.join(APP_ROOT, '.env') load_dotenv(dotenv_path) def notify_customer(number): text = "Hello. You can start your quiz with quizzie-bot by sending the following keywords: hi," \ " hello or vonage." print(nexmo_sms(text, number)) |
Once the end user receives the messages, we want them to reply. We need to create an incoming webhook endpoint to receive the reply. Remember, we set up the inbound sms URL while creating an app earlier. It is now time to add logic to our webhook:
|
1 2 3 4 5 6 7 8 9 10 11 12 |
@app.route("/update/", methods=['POST']) def update_url(): trigger = request.get_json().get('message') project_id = os.getenv("PROJECT_ID") session_id = os.getenv("SESSION_ID") language_code = os.getenv("LANG_CODE") response = detect_intent_texts(project_id, session_id, trigger, language_code) phone = phone_number() return send_sms(response, phone) |
We need to chain the responses we receive from the end user as input to our Dialogflow agent. For this, we need to use the Dialogflow REST agent.
Specifically we need to detect the user intent and pass it as input to the agent:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 |
def detect_intent_texts(project_id, session_id, texts, language_code): """Returns the result of detect intent with texts as inputs. Using the same `session_id` between requests allows continuation of the conversation.""" import dialogflow_v2 as dialogflow session_client = dialogflow.SessionsClient() session = session_client.session_path(project_id, session_id) print('Session path: {}\n'.format(session)) for text in texts: text_input = dialogflow.types.TextInput( text=text, language_code=language_code) query_input = dialogflow.types.QueryInput(text=text_input) response = session_client.detect_intent( session=session, query_input=query_input) return response.query_result.fulfillment_text |
Conclusion
The basic setup is now complete. We’ve shown the logic necessary for the app to send and receive SMS messages, as well as how to connect to the Dialogflow agent. To see the full code for the app, check out the project repo: https://github.com/nexmo-community/Vonage-QnA-app. And for any further questions, feel free to shoot me an email.
Developer
