Adding backend for Google Actions
Setting up firebase functions for Actions on Google
Hey Developer! Hope you’re doing great! Today we will discuss fulfilment and setting up a backend for our Actions for Google, using FirebaseFunctions. If you are new into Actions on Google Development, you have come to the right place.
But before I begin, here’s a brief overview as to what Google Assistant is, and a few terms that we must accustom ourselves with.
Introduction
Google Assistant: It is an AI powered virtual assistant developed by Google which is mostly controlled by Voice commands
Actions on Google, on the other hand is any skill (or app) developed by Google or third party that can be accessed through the Google Assistant. As apps is to Smart Phones, so is Action is to Google Assistant.
Intents, Training Phrases and Responses: Intent is basically defined by a collection of ‘training phrases’ or user-queries and ‘responses’ given out by the Google Assistant. So, whatever user says, or whatever input we expect the user to give, is called a ‘Training Phrase’. And whatever the Google Assistant gives out, in response to a user query is called ‘Response’
If you need help making your first Action for Google, you can read my previous article here.
So, let’s get started!
So, in my previous article, we learnt how to set up the Google Actions Console and Dialogflow, and how to add new Training Phrases and Responses into Intents. Now, we shall see the third and the most important part of the integration, ie. integrating the backend! As mentioned, we shall be using firebase functions for the same.
How to integrate firebase functions:
- download and install nodejs and npm from this website. To check if they are correctly installed, run the following commands on your terminal
node -v //to check node versionnpm -v //to check npm version
2. now, install firebase tools on your system by the following command
npm install -g firebase-tools3. Login to your firebase account and then initialise the firebase-functions project
firebase login firebase init
Now, follow instructions carefully, when asked which features you want to set up for this folder, select Functions as shown in the image below.
After this, choose your firebase project, note that the project you choose must be the same as the one you chose while creating your Action on the Actions Console and Dialogflow Agent. You can choose JavaScript as your preferred language.
Build better voice apps. Get more articles & interviews from voice technology experts at voicetechpodcast.com
5. Next, install actions-on-google from command prompt. Note that to call npm install you must be inside functions folder of your firebase-functions project.
npm install actions-on-google6. Install dialogflow-fulfillment
npm install dialogflow-fulfillment7. Open index.js and edit this way:
const functions = require('firebase-functions');const {dialogflow} = require('actions-on-google')const app = dialogflow()const appName='My Cool App'
app.intent('Default Welcome Intent',conv=>{welcome(conv)})
function welcome(conv){conv.add('Hello! Welcome to '+appName+' from Firebase Functions!')}exports.coolAppFulfillment = functions.https.onRequest(app);
What we basically did in the above lines of code is, we defined that when Default Welcome Intent is triggered, we will call the method welcome(conv)
8. Now that we are done with all the changes in the local, we are ready to deploy our code. For that, fire this command
firebase deployCongratulations, the first and the most important part of the set-up is done. Now that our firebase function is successfully deployed, we will have to map our Action to this firebase function.
9. On Dialogflow Console, go to the intent named ‘Default Welcome Intent’. At the bottom, in the Fulfillment section, switch on ‘enable webhook call for this intent’
10. Now, head-over to the firebase console, select the project and then click on Functions under Develop tab from the left menu. Here, we will find a function named coolAppFulfillment as defined in the index.js file. Now, copy the URL of that function.
11. Now, go to the Dialogflow Console again, and from the menu on the left, click Fulfilment and switch on Webhook. Under URL*, paste that link you just copied in point 10.
Aaaaand, YOU ARE DONE!
Congratulations! You have successfully implemented a backend for your Action for Google!
Let’s test it out!
Hey Google, Talk to My Cool App
This time, ‘My Cool App’ will respond with ‘Hello! Welcome to ‘My Cool App’ from Firebase Functions!’
So, there you go, you have successfully implemented a backend to your Action for Google.
Bonus Tip:
If you want to add some fancier responses like Lists, Carousals, Suggestion Chips etc., do have a look on the Google Developer Docs
Thanks for reading it, it would mean a lot to me if you could clap or leave a comment if you find it useful. Thanks again!
