How to Allow Automated Ordering with WhatsApp and Node.js

Published May 07, 2020 by Garann Means
Categories:

Automated ordering is a great place to begin offering your customers the ability to interact with your organization via WhatsApp. If you have a fairly short list of products, completing an order by messaging back and forth is totally possible. That way people can make their order while they’re standing in line. And because your system is using WhatsApp, you can always augment the ordering process with things like media or location data that might appear inconsistently across SMS.

To try it out, you can build a Node.js service using Vonage’s WhatsApp sandbox. In this example, let’s pretend you’re a pharmacy. Your customers can message you to receive a list of their prescriptions available for refill, and then text their selection to order it.

Prerequisites

An advantage of using Vonage’s Messages API Sandbox is that you don’t need your own WhatsApp business account to test this out. If you have Node installed and a Vonage Developer account, you can get started with a bit of installing, copying, and pasting. You’ll need:

If you want even fewer steps than that, you can remix the example on Glitch.

Create a Node Application

To get started, create a new directory for your application and run npm init to create a package.json. Install the packages you’ll use with npm install express body-parser [email protected] -s. Then create a server.js file and let’s start coding!

The server for this example looks a lot like a plain Express.js server, using body-parser, listening on port 3000. You can stub out endpoints for your webhooks and a helper function that we’ll discuss below. Other than that, your server won’t need much:

Add Some Test Data

To make your application run, you’ll need your API credentials to create a Nexmo client that will connect to Vonage’s API, and you’ll need some test data.

The Nexmo client is initialized with your API key and secret, an application ID, and the application’s private key. You can find the API key and secret on the Getting Started page in your dashboard. You can use one of your existing applications from the dashboard’s Your applications page, or create a new one there. The private key you supply to the Nexmo client can be either the key itself or the path to a file that contains it.

You’ll add an important option to the Nexmo client in this case, changing the apiHost for the sandbox. This will allow you to send messages to the sandbox test number instead of having to provide your own WhatsApp business account:

You don’t need very sophisticated test data to mock up the prescription ordering system. Even the simplest real-world system would no doubt use some sort of data store, but you can hard-code a few arrays mimicking relational data. Create one array with your whitelisted WhatsApp numbers and one with some medications. A third prescriptions matrix can map them together, using array indexes as IDs. Finally, you can leave an empty array for incoming orders:

Listen for Messages

In the Messages API Sandbox you have the option to set up some webhooks. You’ll need the Inbound webhook so that your customers can send you messages. If you haven’t already, add an endpoint of the form https://[YOUR-SERVER]/answer. It’s not essential for this example, but you can also add a Status endpoint that looks like https://[YOUR-SERVER]/event.

Inbound Messages

The /answer endpoint you already created in your server will receive requests containing the number that sent the message and the message text. Declare some variables to store those, as well as the customer index associated with the number. You’ll also want a variable for your reply text.

Before running any logic, check that the person messaging you is actually your customer. If they are you can see if their message contained the ID of one of the medications they have a prescription for. If there’s no order you can send them a list of their available medications. Otherwise, you can add the order to your system.

With your reply text set, you can send a WhatsApp message using the Nexmo client. You need to supply the original from_number as the number to send it to, the sandbox number as the number it’s from, and some content of type text with your generated reply.

Finally, make sure to acknowledge receipt of the message and end your response:

Status Messages

The /event endpoint doesn’t do anything in this example, but you can add it in case you need it down the line. For now all it needs to do is send back a 2xx status and end the response:

Add Orders

Because you’re using arrays of test data, adding an order is pretty quick. There’s minimal error checking in this application and it’s just assumed everything worked. So your addOrder function is a short one, but would be longer with a real data store.

First you’ll check that the customer is allowed to make the order. If not, you’ll send them a notification of the error. If they are, you can add the order to your orders array and generate an order number that’s just the count of orders. In this no-frills example, the order just appears in the console for your pharmacy to prepare. The function returns a message for the customer letting them know the order is being prepared:

Next Steps

Now you can test your application by starting the server in Node with node server.js. If you message the sandbox number with WhatsApp, you should receive the list of your prescriptions in response. If you respond again with one of the IDs it gives you as an option you should get a confirmation.

When you test, make sure also to have the console open. Your order notification for the pharmacy’s side of things will appear there.

Now that you have a basic system, you can of course swap it out for real data and logic. You can also go beyond just text to send media, location information, or other data that may be relevant to your business. Once you see it working, you can apply for a WhatsApp business profile and take your ordering system live to your customers on WhatsApp.

Leave a Reply

Your email address will not be published.

Get the latest posts from Nexmo’s next-generation communications blog delivered to your inbox.

By signing up to our communications blog, you accept our privacy policy , which sets out how we use your data and the rights you have in respect of your data. You can opt out of receiving our updates by clicking the unsubscribe link in the email or by emailing us at [email protected].