Vonage will be releasing a “Conversations for Salesforce” product that has the same functionality as the open source connector and Lightning component we share below. The product will provide 2-way text and WhatsApp messaging inside Salesforce, and now is available to Early Access customers! If you want to be up and running in minutes, reach out to us and join the Early Access program before we release.
If you’d still like to take advantage of the tutorial below, you’ll learn how to build the functionality provided by the open source connector and Lightning component.
Introduction
In this tutorial, we are going to install Vonage’s open source connector and Lightning component to allow you to send push notifications and perform 2-way SMS and WhatsApp messaging straight from Salesforce!
We’ll be using Salesforce, Node.js, Apex, JavaScript, and the Vonage Messages API.
The open source components can be found in the following GitHub repositories:
You can see it in action here:
Setting up Salesforce Org
If you are reading this tutorial, you most certainly aren’t new to Salesforce, but before you start, let’s make sure that you have the correct setup.
You need to be a System Administrator in the Org to install the package.
Before installing this directly on your production Org, why don’t you deploy it in a sandbox environment? They call these developer accounts, and you can get as many as you like here: Developer Sign-up.
By the time you have gone through the onboarding flow, you will have your OWN developer instance of Salesforce, and you can do whatever you like without breaking anything!
Create Connected App Inside Salesforce
When connected to your Salesforce Org, go to 'Setup' in the top right!
⚙️ Search for App Manager in the left-hand menu.
Then click on 'New Connected App'.
Create the Connected App as per the screenshot and tick 'Enable OAuth Settings'.
Add a callback URL to a local webhook (this does not get used in our case) under the API section and select 'Full Access' under 'Selected OAuth Scopes'.
When you click 'Continue' on the following page, you will find the 'Consumer Key' and 'Consumer Secret'. Store both of these for the later part of the integration.
Install the Salesforce Unmanaged Package
Option 1: Install it via the link
Go to the GitHub link for the Lightning Web Component, and at the very top, you will find a link to 'install the unmanaged package'. Please use the link in the first paragraph of GitHub, as it will be updated with the latest version.
Click on the link to install the package. When you have finished, it will take you to the installed application page:
Option 2: Install it via GitHub
Download the Lightning Web Component on GitHub, install the Salesforce CLI and follow the instructions.
To continue, you need to have the package installed and the Consumer Key and Consumer Secret.
Deploying the Salesforce Node.Js Connector
In order to do 2-way SMS and WhatsApp inside Salesforce, you need to create a webhook to receive the inbound messages from Vonage API and send them into the Salesforce Org via a Custom Object. We’ve got you covered.
You will need to download the code from the Node.js connector and deploy it onto your favourite Node.js environment: Heroku, AWS Lambda, etc.
Before deploying your code, you will need to provide the correct environment variables for the JavaScript connector. You will need to retrieve your API credentials for Salesforce so that this Node.js script can call the Salesforce API.
Please follow the steps:
Retrieve your Connected App setting: We followed this step earlier. These are your CONSUMER KEY AND CONSUMER SECRET and you will need to save them under the following environment variables. More info here
SFDC_CONSUMER_KEY
SFDC_CONSUMER_SECRET
Create a dedicated Salesforce user (or reuse an existing user): More info here.
In the step above, after creating the user, you will be able to save the username and password of the user under the following environment variables:
SFDC_USERNAME
SFDC_PASSWORD
Please store the URL on which you are hosting the service as you will need it when you set up the webhooks within the Vonage API Applications. Two URLs will be exposed:
Inbound URL: https://yourNodeServer/webhook/inbound
Event URL: https://yourNodeServer/webhook/event
Setting up Vonage API Dashboard
If you don’t have a Vonage API account, head to our Sign-up page or go straight to our dashboard.
You will need to perform 3 things:
Get your API key and Secret: You can find them as soon as you have created your account on the dashboard.
Create an Application and configure webhooks: Create an application under the API key on the Applications page of the dashboard.
Generate a public and private key (these will not be used). Under the Capabilities, activate Messages and insert the two callback URLs you created in the previous Node.js step.
Associate an SMS/WhatsApp phone number or use the WhatsApp Sandbox: you will need to order a phone number for WhatsApp or SMS. You can buy these by logging on to the Numbers page.
You can also easily create a WhatsApp number using our new Embedded Sign-up feature.
Otherwise, you can use our WhatsApp Sandbox right away by configuring the same webhooks as before on the dedicated Sandbox page.
At this point, inbound messages should directly trigger your node connector and get pushed straight into Salesforce! You’re nearly done!
Configuring Your Vonage Credentials Inside Salesforce
So now that inbound messages from Vonage should be working, let’s look at setting up the outbound part. Since the package is installed, you will find specific settings for the Vonage credentials.
As before, go into the Setup section (top left menu).
Then look for Custom Settings.
You will find one called 'Vonage API Configuration'.
Click on 'Manage' and then 'New' at the top to add your credentials.
Enter all fields accordingly. Tick 'USE_SANDBOX_FOR_MESSAGES_API' and enter 'WHATSAPP_LVN' as '14157386102', if you are using the WhatsApp Sandbox.
Save it!
Decide Where You Want to Place the Lightning Component
So now that you are here, you can decide where you want to position the Lightning component installed.
Let’s see how you can add it to the cases.
Open a case by going to the Service Console and viewing an existing open case.
Click on the cog in the top right-hand menu and select 'Edit Page'.
Let’s create a new tab next to Feed and Related Select the middle window.
Click 'Add Tab' and select 'Custom' to rename it.
Look on the left-hand side and look under the Custom Lightning component. Drag and drop the
VonageMessaging
component into the right part of the page.
You’re DONE. You can now send and receive messages from any case.
Bonus: You Can Also Automate Outbound Notification via the Process Builder and Flow
If you need to automate messages straight out of Salesforce, you can use the integration to send SMS and WhatsApp messages.
Go to 'Setup' and search for 'Process Builder'.
Click 'New' to create a new process.
Build your process with objects, conditions, and under 'Immediate Action', you can decide to send an SMS or a WhatsApp message as per the screenshot.
Select Apex and then 'Send Vonage Message'.
What's Next?
Now that you have integrated SMS and WhatsApp into Salesforce, your team can run all their B2C communication straight within Service Cloud or Sales Cloud and keep all your data in one place. Stay tuned as we will be adding even more features as part of our full-blown product.