Vonage Whatsapp Channel Connector for Front

Short Description

​ This connector allows you to send and receive Whatsapp messages from Front.com via the Vonage Messages API. ​

Long Description

​ The Vonage Messages API allows you to send and in some cases receive messages over SMS, MMS, Facebook Messenger, Viber, and WhatsApp.

In this project, using the Vonage Messages API, you will create a Whatsapp connector that will send and receive messages via Front.com Inboxes and Front Application Channels.

This project uses Vonage Cloud Runtime, removing the need to manage servers and hosting.

Visit the developer portal to view documentation on how it works.

Setup

VCR & Front App Setup

1. Create an App in Front and copy the App UID and the App Secret.

   

   

2. Create a Front API Token and copy its value for later use.

   • Select Scopes: Private Resources and Shared Resources.

3. Deploy the Vonage VCR Application into your account by using the Front App UID and Front App Secret as Variables

   • You'll need to select a Vonage phone number. You can pick from your existing Vonage numbers or buy a new one directly on demand.
   • The popup will also ask you for a "Front Channel Authorization Bearer Token". This is a secure random secret that you can generate yourself. (e.g. you could generate it with this command in your terminal: openssl rand -hex 32). Note down the secret that you fill here, because you will need it later when you connect the channel in Front.

4. Click the "Launch" Button to open your running connetor and get your phone number and VCR app url to note down for the following front setup.

5. Create a Channel type and fill in the following information:

   • Description: e.g. "Vonage Whatsapp Channel"
   • Server: create a new server with your above VCR app url as webhook url and Authentication set to "Bearer".
   • Url Path: "/"
   • Contact Type: Phone
   • Supported Attachments: Text, Image, Audio, Video
   • Allow both replies and compose
   • Composer Type: Basic
   • Timeline: Chat Timeline

   

   

6. Create a Webhook in the features section.

   • Subscribe the Webhook to all events in the list
   • Use your VCR app url with “/” as a path in the end

   

Front Channel Setup

1. Go to your Front Settings under your Personal or Work Profile that can be selected on the top left.

2. Select the Channels section on the left side and click "Connect Channel" and select the channel you just created from the "Others" section in hte bottom of the list.

   

3. Name the Channel and use the Bearer Token you have created in the VCR App Creation as Bearer Token for the new Channel.

4. Connect the Channel to an Inbox and you should now be able to send and receive Vonage Whatsapp messages with the Vonage Number you selected before from the Front Inbox.