eHow to transition away from inline editor on actions on google

Question

In a previous Stack Overflow question, I shied away from using an external webhook on Actions on Google so I needed to go back to the inline editor. I got that worked out, but now I'm feeling brave again.

I've outgrown the inline editor and want the ability to develop my code on my laptop, testing it in Firebase, and publishing to a site for my webhook, presumably where the inline code editor publishes to. In fact, I have already written the require functions and deployed them from Firebase. So the full functionality is ready to go, I just need to hook it up properly to Actions on Google.

What I have now in Actions on Google, inline editor, is more of a stub. I want to merge that stub into my more fullblown logic that I have in Firebase. Here is what is in the inline editor:

const { conversation } = require('@assistant/conversation');
const functions = require('firebase-functions');

const app = conversation(); 

app.handle('intent_a_handler', conv => {
    // Implement your code here
    conv.add("Here I am in intent A");
});

app.handle('intent_b_handler', conv => {
    // Implement your code here
    conv.add("Here I am in intent B");
});

exports.ActionsOnGoogleFulfillment = functions.https.onRequest(app);

When I search on the Internet, I see discussion from the point of view of Dialogflow, but like I say, I'm in "Actions on Google". I want to transition away from the inline editor, taking what I already have, as a basis.Can someone explain how I set that up? I'm happy to do this within the context of the Google ecosystem.

Answer 1

To test your own webhook locally on your own system I would recommend incorporating a web app framework such as express. With express you can host code on your local machine and make it respond to request from Actions on Google. In your case you would replace this will all the code related to the Firebase functions package. Here is an example of what a simple webhook for Actions on Google looks like:

const express = require('express');
const bodyParser = require('body-parser')
const { conversation } = require('@assistant/conversation');

const exprs = express();
exprs.use(bodyParser.json()) // allows Express to work with JSON requests

const app = conversation();

app.handle('example intent', () => {
  // Do something
})

// More app.handle() setups

exprs.post('/', app);
exprs.listen(3000);

With this setup you should be able to run your own application locally. The only thing you need to do is install the required dependencies and add your own intent handlers for your action. At this point you have a webhook running on your own machine, but that isn't enough to use it as a webhook in Actions on Google because it runs locally and isn't publicly available via the internet.

For this reason we will be using a tool called ngrok. With ngrok you can create a public https address that runs all messages to your local machine. This way you can use ngrok address as your webhook URL. Now you can just make as many code changes as you want and Actions on Google will automatically use the latest changes when you develop. No need to upload and wait for Firebase to do this.

Just to be clear: Ngrok should only be used for development. When you are done with developing your action you should upload all your code to a cloud service or host it on your own server if you have any. A (free plan) ngrok URL usually expires every 6 hours. So its not a suitable solution for anything other than development.