Jan KönigIn this guide, you will learn how to host your voice apps on Heroku, a cloud service that offers an easy solution for developers to deploy, manage, and scale their code. We will walk you through the process of creating a Heroku app and modifying your code step by step.
Introduction
Righ now, Jovo offers two ways to host your voice app: Either on AWS Lambda or on a server by using a ExpressJS.
In our voice app tutorials, we usually use the Jovo Webhook for easy local prototyping. However, when it's time to run your app in production, most people deploy their code to AWS Lambda.
But what if you want to host your code on a web server, for example Heroku?
Let's try it out.
In this example, we will host our "Hello World!" sample voice app on Heroku. For a detailed overview on how to get started, take a look at our step by step course Project 1: Hello World. We'll assume you've followed all the necessary steps until the last one (Project 1 Step 6), where we're running the voice app on a local server.
Instead, we're now deploying it to Heroku.
Setting up Heroku
In this section, we will create an app on Heroku and deploy our sample voice app to the server. If you're new to Heroku, they a handy guide for beginners: Getting Started on Heroku with Node.js.
First, let's create a Heroku account (if you don't already have one), create an app, and use the Heroku CLI to do an initial push to the server.
Creating a Heroku App
You can sign up for a free account here. When signing up, you can already choose Node.js as a primary development language:
But no worries if you haven't selected it here. After signing up, you can create a new app in any language shown on the dashboard:
Choose Node.js and then specify an app name on the next screen:
Now, we have several options how to deploy our code.
Let's go with the default option, Heroku Git, for which we need to install the Heroku CLI.
Using the Heroku CLI
The Heroku command line tools are easy to install. You can find the full reference here: Heroku CLI (Heroku Dev Center). Also, here's more information about the CLI in relation to Node.js: Heroku: Getting Started with Node.js > Setup.
After you've installed the CLI, you can login like so:
This prompts you to type in your account credentials.
When this is done, go to your project folder to initialize the repository and add it to your Heroku app:
Now we can add and push changes to Heroku like so:
This should result in a success message similar to this one:
Cool, let's try it out. In your terminal, type this:
This opens the application in your browers, which should look like this:
It doesn't seem like the server is running already. And it makes sense: We usually use a command like jovo run or node src/index.js --cwd src to get the webhook started locally.
In the case of hosting the code online, we need to find a way to do that as well.
Preparing the Jovo Code for Heroku
As mentioned above, we would usually use a command like jovo run or node src/index.js --cwd src to start the server. Now, we need to find a way to tell Heroku to execute this command when the app is started.
Updating the Package.json
Heroku suggests two things, to do so, first, to add a postinstall script to your package.json file. You can do this by adding the following (the latest version of the Jovo voice app templates already has this script):
Also, Heroku wants you to specify the node version you're using for the app (learn more here). In this example, we're adding the following to package.json:
This is what the complete file looks like in our example:
Creating a Procfile
In the Heroku Getting Started guide, we learn that we can use a Procfile to let script Heroku execute scripts when deploying the code. We can use following line:
Take a look at the Heroku sample app's Procfile here. You can download the file from there or create it manually.
Adding Alexa Verification
When you're not host your Alexa Skill on AWS Lambda, you need to do one more thing: You need to verify that the requests are coming from Amazon.
To do this, simply replace this code in your index.js
with this:
Also, install the verifier like so:
That's it! Let's test your voice app on Heroku.
Testing the Server
First, we need to push the changes to Heroku again:
To see if it worked, open your Heroku dashboard, and open the logs:
There, you can see the build process and then the result:
Great!
The only thing that's left for us is to change the endpoint on the developer consoles at Amazon and Dialogflow, and we're good to go.
For example, this is what it looks like in the Amazon Developer Portal:
If we try it in the testing simulator, it works:
If you enable request logging, you can see them in the Heroku logs as well:
That's it for now!