Introductory Guideline for Using Twilio Programmable Messaging and Programmable Voice Services

Table of contents :
Start

Citation preview

Introductory Guideline for Using Twilio Programmable Messaging and Programmable Voice Services By

Dr. Hidaia Mahmood Alassouli

[email protected]

1. Introduction:

Twilio.com is an American cloud communications platform. Twilio allows software developers to programmatically make and receive phone calls, send and receive text messages, and perform other communication functions using its web service APIs.

Twilio uses Amazon Web Services to host telephony infrastructure and provide connectivity between HTTP and the public switched telephone network (PSTN) through its APIs Twilio has very complicated system to understand and use. Its services mainly provided for qualified software developers. But in this report, I will provide introductory guideline for using the Twilio Programmable Messages and Programmable Voices services for simple use without the need to have deep knowledge in Programming. The report consists from the following sections:

Opening a Twilio Account and get a Twilio Trial Number Upgrading the Twilio account Twilio guideline for sending and receiving SMS TwiML™ for Programmable SMS TwiML™ for Programmable Voice Basic steps to build Programmable Voice Using TwiML Bins functions Xampp and Ngrok  web server setup for Twilio development Sending messages from the dashboard of the Twilio account Auto Dialer for Twilio Platform

Summary of testing Programmable Voice using different options

Summary of testing Programmable Messaging through different options Creating free website to save the files on it Making voice call using Twilio in browser

2. Opening a Twilio Account and get a Twilio Trial Number

1. Signup for Twilio Free Trial Account from the link https://www.twilio.com/try-twilio. You need your phone number to verify the account. You will be given a trial balance 15.5 USD. The trial account has limitations and restricts as:

2. Trial projects can only use your project's Twilio number, or a verified caller-ID, as the caller-ID (From number) when making outgoing calls. You can send messages and make calls to verified numbers. Messages and calls include a note about this coming from a "Twilio trial account." All trial calls are limited to a maximum of 10 minutes - both outbound and inbound. Trial projects are limited to a maximum of 1 Elastic SIP Trunk. Trial projects are limited to a maximum of 1 Phone Number. Trial SIP trunks can only be used to place calls using your project's Twilio number, or a Verified Caller-ID, as the Caller-ID/From number for all calls. You can see all limitations of trial account from

https://www.twilio.com/docs/usage/tutorials/how-to-use-your-free-trialaccount

3. There are three options of pricing can be seen from https://www.twilio.com/pricing: Pay-as-you-go, Volume-discounts, Committed-to-use-discounts.

4. Twilio has the following types of services you can pay for. You can find them at https://www.twilio.com/pricing. Programmable Voice, Programmable SMS, Twilio SendGrid Email API, Twilio API for WhatsAPP, Elastic SIP Trunking , Twilio Conversations, Programmable Video, Programmable Wireless. Twilio Flex, Twilio SendGrid Marketing Campaigns, Twilio for Salesforce , Twilio Studio , Autopilot, Task Router, Notify, Authy , Verify, Proxy    

5.  Get Yourself a Twilio Number. Find a suitable number then hit the ‘Buy’ box. You’ll have to confirm your purchase. My phone no was: 00447723356654

6. This is how my console shows up after buying the phone number.

3. Upgrading the Twilio account:

In order to remove the limitations on the account, you need to upgrade the account. To upgrade the account, choose the upgrade icon. You must enter your address and Credit/Debit card or PayPal payment details and charge your account by 20 USD.

4. Twilio guideline for sending and receiving SMS:

In my case I rent a UK phone number. I was able to send from that phone number to any international number. But I was not able to receive message to my Twilio UK phone number from non UK international numbers. I was able to receive only messages from only certain UK numbers. I asked the Twilio support and they gave me the following guideline and rules regarding sending and receiving SMS to Twilio phone numbers. Sending messages to international destinations is supported by Twilio numbers. Please make sure you have done the below steps:

1. You have purchased SMS enabled Twilio number from the console https://www.twilio.com/console/phone-numbers/search.

2. You have turned on all the Geo permissions for the countries you wish to send to from here https://www.twilio.com/console/sms/settings/geo-permissions

3. You have read and applied the required rules by the country regulators in the guidelines pages of the country you want to send messages to it https://www.twilio.com/guidelines/us/sms 4. In case if sending messages to the US and Canada please make sure you only use a US or Canada numbers from Twilio as the US and Canadian networks accepts messages from only US or

Canadian numbers, and if you try to send messages to any US/Canada number from an alphanumeric sender Id or a long code from other country that will not work.

The error explanation is here https://www.twilio.com/docs/api/errors/21612. The solution for this is to buy a US Twilio number from here https://www.twilio.com/console/phone-numbers/search and use this US number to send messages to the US or Canada.

5. Make sure you register an alphanumeric sender id if requested as mentioned in the country guidelines, and to register please fill this form here https://twiliodoer.secure.force.com/SenderId. This is required in Palestine. and without the registration messages won’t be delivered. 6. Please use this guide to get started and send your messages through Twilio API https://www.twilio.com/docs/sms. 7. As you are trying to receive messages to your UK Twilio number from Non-UK number, and as this is inbound international delivery case, it was documented clearly that Twilio doesn’t support these cases, and we cannot guarantee such delivery from other countries, please see This is because the messages coming to Twilio follow other routes that what Twilio has, and we have no insights on the routes and the networks that are delivering these messages.

The only way Twilio can guarantee the delivery and ensure that inbound messages are delivered is by using a Twilio number from the same country where you want to receive from.

My only recommendation for now is to apply for a Twilio number from the same country and once you get it then your messages should be delivered, in case not then we can escalate to our carrier to check what happened.

8. Please note that in Palestine the 2 way SMS is not supported, Twilio cannot provide Twilio Palestinian numbers.

5. TwiML™ for Programmable SMS

1. TwiML (the Twilio Markup Language) is a set of instructions you can use to tell Twilio what to do when you receive an incoming call, SMS, or fax. TwiML can be generated using one of the Twilio Language Helper Libraries, or written manually to instruct Twilio on what actions to take in response to various SMS related events.

2. The following manual TwiML will instruct Twilio to respond to an incoming SMS with a "Hello World!" reply:

version="1.0" encoding="UTF-8"?>

    Hello World!

3. The verb sends a message to a phone number or a Wireless

The verb supports the following attributes that modify its behavior:

4. The verb transfers control of a Message response to the TwiML at a different URL. All verbs after are unreachable and ignored. The verb supports the following attributes that modify its behavior:

6. TwiML™ for Programmable Voice

1. TwiML (the Twilio Markup Language) is a set of instructions you can use to tell Twilio what to do when you receive an incoming call, SMS, or fax.

2. When someone makes a call to one of your Twilio numbers, Twilio looks up the URL associated with that phone number and sends it a request. Twilio then reads the TwiML instructions hosted at that URL to determine what to do, whether it's recording the call, playing a message for the caller, or prompting the caller to press digits on their keypad.

3. At its core, TwiML is an XML document with special tags defined by Twilio to help you build your Programmable Voice application.

4. In TwiML parlance, XML elements are divided into three groups: the root element, verbs, and nouns.

5. The In any TwiML response to a Twilio request, you must nest all verb elements within , the root element of Twilio's XML markup. As example: version="1.0" encoding="UTF-8"?>

“This message must be nested in a Response element   in order for Twilio to say it to your caller.”

6. TwiML verbs for Programmable TwiML verbs tell Twilio what actions to take on a given call. Because of this, most elements in a TwiML document are TwiML verbs. Verb names are case sensitive, as are their attribute names. You can use different combinations of TwiML verbs to create all kinds of interactive voice applications.

7. The core TwiML verbs for Programmable Voice are:  You can use different combinations of TwiML verbs to create all kinds of interactive voice applications. 8. The core TwiML verbs for Programmable Voice are: - Read text to the caller

- Play an audio file for the caller - Add another party to the call

- Record the caller's voice

- Collect digits the caller types on their keypad

9. The following verbs may be used to control the flow of your call:

- Hang up the call - Add the caller to a queue of callers - Remove a caller from a queue of callers

- Wait before executing more instructions - Redirect call flow to a different TwiML document

- Twilio initiates SIP REFER towards IP communication infrastructure

- Decline an incoming call without being billed 10. TwiML nouns: A TwiML noun describes the phone numbers and API resources you want to take action on. Effectively, a TwiML noun is anything nested inside a verb that is not itself a verb: it's whatever the verb is acting on. TwiML nouns are usually just text. However, as in the case of with its and nouns, at times there are nested XML elements that are nouns.

11. Twilio's request to your application: When someone makes an inbound call to one of your Twilio phone numbers, Twilio needs to request TwiML from your application to get instructions for handling the call. You can configure your Twilio phone number to point to your application's URL by visiting the phone numbers section of the console. Select your phone number, then scroll to the 'Voice & Fax' section to set a webhook, TwiML bin, or Twilio Function for Twilio to send that HTTP request when a call comes in:

Configure webhook on phone number for voice.  Twilio makes its request over HTTP, either as a GET or POST, just like requesting a web page in your browser or submitting a form. Twilio cannot cache POSTs. If you want Twilio to cache static TwiML pages, then have Twilio make requests to your application using GET. By including parameters and values in its request, Twilio sends data to your application that you can act upon before responding.

7. Basic steps to build Programmable Voice:

Here the basic steps to build programmable voice: 1. Get a Number. In order to make calls or send messages through the Twilio API, you need to get a Twilio phone number.

2. Confirm Your Programming Language, whether: C#, Java, Node.js, PHP, Python, Ruby

If you are not a developer? You might want to check out these Twilio-powered contact center and help desk providers.

https://showcase.twilio.com/s/

3. Make and receive voice calls to your Twilio phone number. Use the diagrams below to understand basic inbound and outbound call architectures, and then complete the quick start guide to make and receive your first phone calls.

4. Managing an Incoming Call: A call comes in to your Twilio phone number Party A Twilio asks your server how to handle the call Your server replies with instructions written in TwiML

In this example, Twilio rings the phone for Party B.

4. Managing Outgoing Call:

Your app initiates a REST API call to Twilio Twilio asks your app for instructions via a webhook Your server replies with instructions written in TwiML In this example, Twilio calls Party A's phone to deliver an appointment reminder

8. Using TwiML Bins functions:

TwiML Bins are a serverless solution that helps you provide Twiliohosted instructions to your Twilio applications. They’re a useful way to prototype and explore Twilio’s capabilities without needing to set up your own web server to respond to requests.

a) A serverless and codeless to try Twilio SMS forwarding using TwiML-Bins: 1. Twilio announced Twilio Functions, a serverless Node.js environment for spinning up functions without having to find hosting

2. Set Up an SMS-Forwarder. Go to the link

https://console.twilio.com/?frameUrl=/console/twiml-bins/create Write the following code

version="1.0" encoding="UTF-8"?>     to="+970598725325">{{From}}: {{Body}}

Substituting number with your actual, real, about-to-be-masked cell phone number: Name it any name you wish, then create the TwiML App with the big red ‘Create’ button on the bottom of the box.

3. Now, back to the Phone Number Console https://www.twilio.com/console/phone-numbers/incoming. Click the number you recently purchased, and scroll down to the ‘Messaging’ Section.  In ‘A Message Comes In’ you’ll see two menus. On the left, you need to pick the type of ‘handler’ for events on this number; select the menu option ‘TwiML’. On the right, you need to pick the specific TwiML Bin – direct it to the function you just saved. Here’s how it might look:

4. In my case I rent a UK phone number. I was able to send from that phone number to any international number. But I was not able to receive message to my Twilio UK phone number from

non UK international numbers. I was able to receive only messages from only certain UK numbers. They gave me the following reason:

((As you are trying to receive messages to your UK Twilio number from Non-UK number, and as this is inbound international delivery case, it was documented clearly that Twilio doesn’t support these cases, and we cannot guarantee such delivery from other countries, please see here

https://support.twilio.com/hc/en-us/articles/223133447-Not-ReceivingIncoming-SMS-and-MMS-Messages-on-Twilio-PhoneNumber#:~:text=Check%20that%20your%20Twilio%20number,valid%2 0configuration%20for%20receiving%20messages.

This is because the messages coming to Twilio follow other routes that what Twilio has, and we have no insights on the routes and the networks that are delivering these

b) Using a TwiML Bins to Receive SMS and MMS Messages without responding: TwiML Bins allow for simple XML scripting with little to no Programmable experience needed.

1. Set Setting up a TwiML Bin only requires creating the bin, adding a single line of code, and then configuring it on your number. Here are the instructions: 2. Login to your account at www.twilio.com/console.

3. Click the left-side navigation bar. If Runtime is not visible, you may first need to Products & The link is https://console.twilio.com/develop/explore

4. Click TwiML and then select Create New TwiML or the red plus + sign button.

5. Add a Friendly Name and some and then click

Friendly This is up to you - we select using something that gives an idea of what the TwiML Bin will do like “No-response”.

For the code, you will use a simple empty open and closed . You should end up with something like this:

6. Configure this TwiML bin on your Twilio to the Phone Number Console https://www.twilio.com/console/phone-numbers/incoming. Click the number you recently purchased, and scroll down to the ‘Messaging’ Section.  In ‘A Message Comes In’ you’ll see two menus. On the left, you need to pick the type of ‘handler’ for events on this number; select the menu option ‘TwiML’. On the right, you need to pick the specific TwiML Bin – direct it to the function you just saved. Here’s how it might look:

7. In my case I rent a UK phone number. I was able to send from that phone number to any international number. But I was not able to receive message to my Twilio UK phone number from non UK international numbers. I was able to receive only messages from only certain UK numbers. They gave me the following reason:

((As you are trying to receive messages to your UK Twilio number from Non-UK number, and as this is inbound international delivery case, it was documented clearly that Twilio doesn’t support these cases, and we cannot guarantee such delivery from other countries, please see here https://support.twilio.com/hc/en-us/articles/223133447-Not-ReceivingIncoming-SMS-and-MMS-Messages-on-Twilio-PhoneNumber#:~:text=Check%20that%20your%20Twilio%20number,valid%2 0configuration%20for%20receiving%20messages.

This is because the messages coming to Twilio follow other routes that what Twilio has, and we have no insights on the routes and the networks that are delivering these

9.  Working with Twilio Studio:

Twilio Studio allows you to drag and drop widgets to build a number of different Programmable Messaging flows. Here are steps for creating a simple SMS message forwarding flow, and configuring it for use on your Twilio number.

a) Creating Message Autoresponder flow through Twilio Studio:

Twilio Studio is a flowchart-like environment for building Twilio Programmable Voice and Programmable Messaging workflows. Studio allows you to drag, drop, and connect different widgets to build anything from a simple message confirmation app, to a complicated Phone tree or IVR, all with the flexibility of adding your own code as desired, or using a completely code-free selfcontained flow with no additional hosting requirements. With Studio, you can create flows for receiving voice calls, receiving text messages, or for sending either via the API. Here's how to get started.

1. A Studio flow consists of a Trigger connecting to one or more widgets.

i. Flows in Twilio Studio always start with a Trigger This widget serves as the entryway to the new flow, and contains 3 leads that can each route differently depending on how the Flow is executed - either via an incoming call, SMS, or an API request.

ii. Widgets: For a full rundown of the available Widgets, see Widget Library https://www.twilio.com/docs/studio/widget-library. Here are a number of examples:

Send a Text Use the Send Message or Send & Wait for Reply widgets. Collect DTMF keypresses or Voice Use the Gather Input On Call widget. Branch options by user Use the Split Based On… widget. Connect a call to another Use the Connect Call To widget.

2. Go to Twilio explore products page https://console.twilio.com/develop/explore. Choose Twilio studio.  You will get the following console

3. Twilio Studio is a visual interface to design, deploy, and scale customer communications. Anyone on your team can use Twilio Studio to quickly and easily create and modify flows.  To get started quickly, create a one of these pre-made templates. Or, for step-by-step instructions on how to create it yourself. Here are some of the available templates at Twilio.

IVR/Phone Tree: An interactive Voice Response (IVR) system that precisely routes each caller. Message Autoresponder: Deploy a customizable autoresponder to greet incoming texts with a personalized message. Call Forwarding: Divert incoming calls to your personal or business number with call forwarding. Messaging Chatbot:  Have conversations with your customers using both inbound and outbound SMS or WhatsApp. Appointment Reminders: Reduce no-shows by sending confirmation messages. Text Surveys: Build an SMS or WhatsApp survey by hooking into your application via Studio's REST API

4. I will create here a flow for Message Autoresponder. I will start with a fresh Twilio Studio flow; log into your Twilio account and navigate to the Studio Dashboard, then tap the Create flow  + icon to create a new flow. You can name your flow anything you like;  such as “Hidaia Message Autoresponder”. Then click Next.

5. You will get the library widgets in the right side area

6.We are going to trigger an incoming message. We are going to state that if there is  incoming message, send particular message. So I chose “Send Message” widget and I dragged it to the dashboard.

7. Specify the auto responding message to be sent. And connect the  “Incoming Message” trigger  with “Send Message” widget. Then publish the flow

8. Configure this Studio flow on your Twilio to the Phone Number Console https://www.twilio.com/console/phone-numbers/incoming. Click the number you recently purchased, and scroll down to the ‘Messaging’ Section.  In ‘A Message Comes In’ you’ll see two menus. On the left, you need to pick the type of ‘handler’ for events on this number; select the menu option ‘Studio’. On the right, you need to pick the specific Studio flow – direct it to the Studio flow  you just saved. Here’s how it might look:

b) Creating Call Forwarding flow through Twilio Studio:

1. I will create here a flow for Call Forwarding. I will start with a fresh Twilio Studio flow; log into your Twilio account and navigate to the Studio Dashboard, then tap the Create flow  + icon to create a new flow. You can name your flow anything you like;  such as “Hidaia Call Forwarding”. Then click Next. Then select “start from scratch”.

2. You will get the library widgets in the right side area

3.We are going to trigger an incoming call. We are going to state that if there is  incoming call, then connect the call to certain phone number . So I chose “Connect Call To” widget and I dragged it to the dashboard.

4. We can connect the call to single number, multiple numbers, conference, SIP Endpoint, Client User, SIM. I chose to connect the call to single number. Write that phone number. And connect the  “Incoming Call” trigger  with “Connect Call” widget. Then publish the flow

5. Configure this Studio flow on your Twilio to the Phone Number Console https://www.twilio.com/console/phone-numbers/incoming. Click the number you recently purchased, and scroll down to the ‘Voice &Fax’ Section.  In ‘A CALL COMES IN’ section you’ll see two menus. On the left, you need to pick the type of ‘handler’ for events on this number; select the menu option ‘Studio’. On the right, you need to pick the specific Studio flow – direct it to

the Studio flow you just saved, in my case “Hidaia Call Forwarding”. Here’s how it might look:

6. I tested that,  the voice call was forwarded. The phone number must be among the verified numbers in the account to forward the call.

c) Creating Voicemail flow through Twilio Studio:

1. I will create here a flow for Voicemail. I will start with a fresh Twilio Studio flow; log into your Twilio account and navigate to the Studio Dashboard, then tap the Create flow  + icon to create a new flow. You can name your flow anything you like;  such as “Hidaia Voicemail”. Then click Next. Then select “start from scratch”.

2. You will get the library widgets in the right side area 3.We are going to trigger an incoming call. We are going to state that if there is  incoming call, then record the voicemail. So I chose “Record Voicemail” widget and I dragged it to the dashboard. Set the parameters for recording the voicemail, such as “Stop Recording After”, “Seconds of Silence“, “Stop recording on keypress”, “Max recording length.

4. Connect the  “Incoming Call” trigger  with “Record voicemail ” widget. Then publish the flow”

5. Configure this Studio flow on your Twilio to the Phone Number Console https://www.twilio.com/console/phone-numbers/incoming. Click the number you recently purchased, and scroll down to the ‘Voice &Fax’ Section.  In ‘A CALL COMES IN’ section you’ll see two menus. On the left, you need to pick the type of ‘handler’ for events on this number; select the menu option ‘Studio’. On the right, you need to pick the specific Studio flow – direct it to the Studio flow you just saved, in my case “Hidaia Voicemail”. Here’s how it might look:

6. I tested that. The voice was recorded successfully.

d) Creating “Gather Input on Call” flow through Twilio Studio:

1. I will create “Gather Input on Call”  flow. I will start with a fresh Twilio Studio flow; log into your Twilio account and navigate to the Studio Dashboard, then tap the Create flow  + icon to create a new flow. You can name your flow anything you like;  such as “Hidaia Gather Inpur on Call”. Then click Next. Then select “start from scratch”.

2. You will get the library widgets in the right side area 3.We are going to trigger an incoming call. We are going to state that if there is  incoming call, then say a message or play and audio file. So I chose “Gather Input on Call” widget and I dragged it to the dashboard. Set the parameters for “Say or Play Message”. So if you choose “Say Message” option, it will say the message you indicated in the message box. If you choose “Play Message” option, it will play an audio file, and you must indicate the link of the audio file.

4. I chose  “Say Message” option. I put my message in message box.   5. Connect the  “Incoming Call” trigger  with “Gather Input on Call” widget. Then publish the flow”

6. Configure this Studio flow on your Twilio to the Phone Number Console https://www.twilio.com/console/phone-numbers/incoming. Click the number you recently purchased, and scroll down to the ‘Voice &Fax’ Section.  In ‘A CALL COMES IN’ section you’ll see two menus. On the left, you need to pick the type of ‘handler’ for events on this number; select the menu option ‘Studio’. On the right, you need to pick the specific Studio flow – direct it to the Studio flow you just saved, in my case “Hidaia Gather Input on Call ”. Here’s how it might look:

7. I tested that and the test was successful. I got the audio form of the message that I setup in message box.

e) Forwarding incoming SMS messages with Twilio Studio:

1. Twilio Studio allows you to drag and drop widgets to build a number of different Programmable Messaging flows. Here are steps for creating a simple SMS message forwarding flow, and configuring it for use on your Twilio number.

2. To create an SMS Message Forwarding Flow, 

Access the Studio Dashboard in Console https://console.twilio.com/?frameUrl=/console/studio/dashboard. Click the + sign icon  to create a new Studio flow. Enter the desired name for your flow, and then click Next. Select "Start from scratch", and then click Next. I named the studio flow as “SMS-Forward”. . From the "Widget Library" on the right, drag and drop a Send Message widget into the flow.

Click the Send Message widget to display the widget's options on the right. Enter the following in the MESSAGE BODY field

NEW MESSAGE FROM: {{trigger.message.From}}

BODY: {{trigger.message.Body}}

In the SEND MESSAGE widget options, scroll to and click to & CHAT Enter the desired destination forwarding number in the SEND MESSAGE TO field, and then click

Click Publish

3. Activate a Flow on a Twilio Number: When your flow is published, it can then be configured to handle incoming text messages for Twilio phone numbers that support SMS. Here’s how to add your flow to a phone number: Access the Active Numbers page in Console.

Click the desired phone number to modify. Scroll to the Messaging section, and then modify the phone number’s routing:

CONFIGURE Webhooks, TwiML Bins, Functions, Studio, or Proxy A MESSAGE COMES Studio Flow

DROP-DOWN Select the previously saved flow. A new flow may not be immediately visible; try refreshing the page if you don't see it at first.

Click

10. Xampp and Ngrok web server setup for Twilio development:

In this tutorial, you will learn how to setup the PC for Twilio development. You will learn installation and configuration of Xampp, Notepad++ and Ngrok.

a) Xampp, Notepad++ and Ngrok

1. Download and install Notepad++ which is a text editor. You can get it from https://notepad-plus-plus.org/downloads/

2. Download and install Xampp Apache web server. You can find all Xampp versions in https://sourceforge.net/projects/xampp/files/XAMPP Windows.   I chose to download xampp-portable-win32-7.1.19-0-VC14-installer. Download link: https://sourceforge.net/projects/xampp/files/XAMPP%20Windows/7.3. 2/xampp-portable-win32-7.1.19-0-VC14-installer.exe/download

3. Download and install Ngrok. You can download Ngrok from https://ngrok.com/download. I downloaded ngrok-stable-windows386.zip from the following link

https://bin.equinox.io/c/4VmDzA7iaHb/ngrok-stable-windows-386.zip

4. After installing  Xampp Apache web server, you will get the following Xampp Control Panel. From this control panel, you can start Apache server, MySQL server and other servers.

5. Go to the default htdocs folder. In my case C:\xampp\htdoocs. Create folder tutorial (C:\xampp\htdocs\tutorial). Create inside the tutorial folder subfolder name tutorial1 (C:\xampp\htdocs\tutorial\tutortial1).

6. Using Notepad++, create inside the tutrial1 folder test.txt file and type anything on it . Test that your webserver works fine by browsing the test.txt file http://127.0.0.1/tutorial/tutortial1/test.txt

7.   ngrok - tunnel local ports to public URLs and inspect traffic. Ngrok exposes local networked services behinds NATs and firewalls to the public internet over a secure tunnel. Share local websites, build/test webhook consumers and self-host personal services.

8. Go to the folder that you saved ngrok.exe file on to it. In my case C:\ngrok. Using the cmd command, browse to this folder.

9. ngrok http command starts http tunnel. As example, ngrok http 80 command secure public URL for port 80 webserver. Type the following command from command line

>C:\ngrok\ngrok.exe http 80 You will get the following screen if you are connected to internet.

The link http://51f9745dbca3.ngrok.io and https://51f9745dbca3.ngrok.io are public links will tunnel our PC which is in local area network  to internet network. If we browse now http://51f9745dbca3.ngrok.io/tutorial/tutortial1/test.txt, we will see our test.txt  file 

b) Creating Twilio Hello World Xml file Webhook

1. Now we are going to test hello world xml file. Create inside tutorial1 folder  using notepad hello.xml file  which has the following xml format

version="1.0" encoding="UTF-8"?> Hello World

2. You can browse to the XML file   using the ngrok public link. In my case was: 54889c83f0f4.ngrok.io/tutorial/tutortial1/hello.xml

3. Configure this webhook on your Twilio to the Phone Number Console https://www.twilio.com/console/phone-numbers/incoming. Click the number you recently purchased, and scroll down to the ‘Voice &Fax’ Section.  In ‘A CALL COMES IN’ section you’ll see two menus. On the left, you need to pick the type of ‘handler’ for events on this number; select the menu option ‘Webhook’. On the right, you need to the URL link your webhook which is in our example the ngrok URL https://51f9745dbca3.ngrok.io/tutorial/tutortial1/hello.xml

This how it looks.

4. I tested that and the test was successful.  I heard  the audio form of  “Hello World” sentence

c) Creating  simple voice conference:

1. The verb's noun  allows you to connect to a conference room. Much like how the noun allows you to connect to another phone number, the noun allows you to connect to a named conference room and talk with the other callers who have also connected to that room. Conference is commonly used as a container for calls when implementing hold, transfer, and barge.

2. Start Xampp Apache and MySQL server. 3. Now we are going to create simple voice conference. Create inside tutorial folder sub folder name tutorial2. Then  using notepad create conference.xml file  which has the following xml format

version=”1.0” encoding=”UTF-8”?> Welcome to Hidaia Conference       Hidaia  

The file will be saved in C:\xampp\htdocs\tutorial\tutortial2\conference.xml

The local link http://127.0.0.1/tutorial/tutorial2/conference.xml

4. Ngrok http command starts http tunnel. As example, ngrok http 80 command secure public URL for port 80 webserver. Type the following command from command line

>C:\ngrok\ngrok.exe http 80

You will get the following screen if you are connected to internet.

5. You can browse to the XML file   using the ngrok public link . In my case was:

https://858ac9a50a4c.ngrok.io/tutorial/tutorial2/conference.xml 6. Configure this webhook on your Twilio to the Phone Number Console https://www.twilio.com/console/phone-numbers/incoming. Click the number you recently purchased, and scroll down to the ‘Voice &Fax’ Section.  In ‘A CALL COMES IN’ section you’ll see two menus. On the left, you need to pick the type of ‘handler’ for events on this number; select the menu option ‘Webhook’. On the right, you need to the URL link your webhook which is in our example the ngrok URL https://858ac9a50a4c.ngrok.io/tutorial/tutorial2/conference.xml This how it looks.

7. I tested that and the test was successful.  I got the audio form of  “Welcome to Hidaia Conference” sentence, and the conference music played. 8. You can change the music by adding waitUrl command to the xml code Welcome to Hidaia Conference waitUrl="http://twimlets.com/holdmusic? Bucket=com.twilio.music.classical&Message=please%20wait">Hidaia

d) Testing Twilio Call Forwarding

1. During an active call, you can use TwiML’s verb to connect the current caller to another party. The following example shows the most basic use of :

version="1.0" encoding="UTF-8"?>     415-123-4567

If the party at 415-123-4567 answers the call, the two parties can communicate until one hangs up.

The verb will end the new call if:

The called party does not pick up. Twilio receives a busy signal. The number does not exist.

2. Start Xampp Apache and MySQL server.

3. Ngrok http command starts http tunnel. As example, ngrok http 80 command secure public URL for port 80 webserver. Type the following command from command line >C:\ngrok\ngrok.exe http 80

You will get the following screen if you are connected to internet.

4. Create XML file for forwarding the call. Below is the XML function that dials the phone. Create inside tutorial folder sub folder name tutorial3. Then  using notepad create forward.xml file  which has the following xml format

version="1.0" encoding="UTF-8"?>     +15165770632     Goodbye Change the phone number to your phone number. The phone number must be among the verified numbers in the account. The file will be saved in C:\xampp\htdocs\tutorial\tutortial3\forward.xml

The local link http://127.0.0.1/tutorial/tutorial3/forward.xml 5. You can browse to the XML file   using the ngrok public link. In my case was:  http://22a201696da1.ngrok.io/tutorial/tutorial3/forward.xml 6. Configure this webhook on your Twilio to the Phone Number Console https://www.twilio.com/console/phone-numbers/incoming. Click the number you recently purchased, and scroll down to the

‘Voice &Fax’ Section.  In ‘A CALL COMES IN’ section you’ll see two menus. On the left, you need to pick the type of ‘handler’ for events on this number; select the menu option ‘Webhook’. On the right, you need to the URL link your webhook which is in our example the ngrok URL

http://22a201696da1.ngrok.io/tutorial/tutorial3/forward.xml This how it looks.

7. I tested that. The voice call was forwarded successfully to the phone number I setup.

e) Testing Twilio call recording:

1. The verb records the caller’s voice and returns to you the URL of a file containing the audio recording. You can optionally generate text transcriptions of recorded calls by setting the transcribe attribute of the verb to true.

2. Start Xampp Apache and MySQL server.

3. Ngrok http command starts http tunnel. As example, ngrok http 80 command secure public URL for port 80 webserver. Type the following command from command line

>C:\ngrok\ngrok.exe http 80

You will get the following screen if you are connected to internet.

4. Create XML file for forwarding the call. Below is the XML function that dials the phone. Create inside tutorial folder sub folder name tutorial4. Then  using notepad create forward.xml file  which has the following xml format

version="1.0" encoding="UTF-8"?>      Record your message after tone

     timeout="20" transcribe="true" />

The file will be saved in C:\xampp\htdocs\tutorial\tutortial4\record.xml

The local link http://127.0.0.1/tutorial/tutorial4/record.xml

5. You can browse to the XML file   using the ngrok public link. In my case was: 

http://e59ae3b7ec31.ngrok.io/tutorial/tutorial4/record.xml 6. Configure this webhook on your Twilio to the Phone Number Console https://www.twilio.com/console/phone-numbers/incoming. Click the number you recently purchased, and scroll down to the ‘Voice &Fax’ Section.  In ‘A CALL COMES IN’ section you’ll see two menus. On the left, you need to pick the type of ‘handler’ for events on this number; select the menu option ‘Webhook’. On the right, you need to the URL link your webhook which is in our example the ngrok URL

http://e59ae3b7ec31.ngrok.io/tutorial/tutorial4/record.xml

7. I tested that and the test was successful. I got the audio form of  “Record your message after tone”. The message recorded successfully and can be found in voice calls log.

8. You can listen to the recorded message at the voice calls log https://console.twilio.com/us1/monitor/logs/calls? frameUrl=%2Fconsole%2Fvoice%2Fcalls%2Flogs%3Fx-targetregion%3Dus1

f ) Exploring SMS send and receive.

1. The verb sends a message to a phone number or a Wireless SIM.

2. The verb transfers control of a Message response to the TwiML at a different URL. All verbs after are unreachable and ignored.

3. Start Xampp Apache and MySQL server. 4. Ngrok http command starts http tunnel. As example, ngrok http 80 command secure public URL for port 80 webserver. Type the following command from command line

>C:\ngrok\ngrok.exe http 80

You will get the following screen if you are connected to internet.

5. Create XML file for responding to a message. Below is the XML function that responds to received SMS with a message.

Create inside tutorial folder sub folder name tutorial5. Then  using notepad create sms.xml file  which has the following xml format

version="1.0" encoding="UTF-8"?>             Nice to meet you. How are you.    

The file will be saved in C:\xampp\htdocs\tutorial\tutortial5\sms.xml

The local link http://127.0.0.1/tutorial/tutorial5/sms.xml 6. You can browse to the XML file   using the ngrok public link. In my case was:  https://7343dda5a3c1.ngrok.io/tutorial/tutorial5/sms.xml

7. Configure this Webhook bin on your Twilio to the Phone Number Console https://www.twilio.com/console/phonenumbers/incoming. Click the number you recently purchased, and scroll down to the ‘Messaging’ Section.  In ‘A Message Comes In’ you’ll see two menus. On the left, you need to pick the type of ‘handler’ for events on this number; select the menu option ‘Webhook’. On the right, you need to the URL link your webhook which is in our example the ngrok URL 8. I tested the configuration. The message received, but there I did not receive response message. I got the following error

message for the reason:

Permission to send an SMS has not been enabled for the region indicated by the 'To' number

11.  Sending messages from the dashboard of the Twilio account:

1. You can send SMS with a Messaging Service from the Twilio account dashboard

2.  Go to Messaging section. Then select “Send SMS”. Select the Messaging Service you would like to use while sending the SMS and the phone number you want to send the message, and send your message. The link: https://console.twilio.com/us1/develop/sms/try-it-out/sendan-sms

12. Auto Dialer for Twilio Platform

Twilio Auto Dialer is a chrome extension, Which is used to make online phone calls and SMS b=using Twilio account.

a) Installation and setup of Twilio Auto Dialer softphone:

1. Download and install Twilio Auto Dialer Chrome Extension. You can download the Twilio Auto Dialer Chrome Extension from

https://chrome.google.com/webstore/detail/auto-dialer-for-twiliopl/djlifjbljbhnhkplahimejgmjmnandjk/related?hl=en

2. After downloading and installing Twilio Auto Dialer Chrome Extension, you will get the following interface:

3. Sign in to your Twilio account. You must sign in with your Twilio SID and Twilio AuthToken. This information you can get

from your Twilio account. Choose unique Client Name  for your account.

4. Choose your default Twilio phone number you want to use in the Autodialer. You can enable or disable “Route  inbound calls” option.

5. Then you will be forwarded to select the CRM provider. You don’t need to select one, so select “Skip”

6. This is the Twilio Auto dialer interface :

7. From the  Auto dialer settings,   you can configure the following options: Enable/Disable SMS, Enable/Disable Voicemail, Enable/Disable Call forwarding, Voicedrops setting, advanced settings, Payments.  

When enabling SMS to your Twilio phone number, choose the SMS options: “Action on clicking number”: Call, SMS or Ask.

When enabling Voicemail, choose the Greeting message. You can enable or disable “Open CRM page on Ring” future.

b) Making Twilio Auto Dialer - VoIP calls:

1. Twilio Auto dialer is a Chrome extension softphone, Which is used to make and receive VoIP calls online by using your twilio account.

2. Fellow the previous section to sign in to your Twilio account using the Twilio Auto Dialer.

3. After setup of the Twilio Auto Dialer, you will see the following page

4. Dial the phone number you want to call.

5. In case of international numbers, you need to dial the phone number with country code. Or you can assign the international number a keyboard shortcut from the advanced settings. As example I assigned the shortcut * for certain phone number, then I dialed that number by just dialing *.

6. You can also receive incoming calls to your Twilio phone number at the Auto Dialer.

7. You can change the caller ID  from Outbound Caller ID section in Advanced Settings tab

c) Integrating CRM:

You can integrate CRM to  the Twilio autodialer. 1. Go to Settings/Advanced Settings. Then select CRM connections. You will see the CRM the auto dialer supports.

2. As an example, to connect to Hubspot CRM, you need to add the API key. You can find the  API key in your Hubspot account app.hubspot.com .

Note: You must have hubspot account. Login to your hubspot account. Go to Settings page, then go to integration section, you will see the Hubspot API key 

3. You can choose to enable or disable “Open CRM page on ring”. This option opens the contact information of the caller when getting the incoming call. As soon you get incoming call, the contact information at hubspot will open up. 

d) Enabling

1. You can enable Voicemail from the Twilio Autodialer Settings.

2. When the call is made to your Twilio phone number and no answer, the caller will hear the voicemail message and then the caller will be requested to record his message.

3. The voicemail will be recorded under the voicemail tab. If you was not able to access the voice message from the Auto dialer, you can see it on the Calls logs page in the Twilio account

https://console.twilio.com/us1/develop/voice/overview

e) Enabling Call

1. You can enable Call forwarding from the Twilio Autodialer Settings. You must setup the phone number to forward the call to it.

2. Now if you make a call to the Twilio number, the number will be forwarded to number you setup to forward the call to.

f ) Sending Messages from the

1. Enable SMS from the Autodialer settings.

2. Then go to Messages page and create the message. You must indicate the phone number you would like to send the message to.

3. The message delivered successfully

13. Summary of testing Programmable Voice using different options:

a) Testing Hello World function using different options:

1. I tested TwiML Bins function “Hello World” with following XML form:

version="1.0" encoding="UTF-8"?>

Hello World This is Dr. Hidaia Phone

Then I configured the TwiML Bins on the Twilio number

The test was successful. After the phone rings, it will say the sentence “Hello World. This is Dr. Hidaia Phone”

2. I setup XAMPP server and saved on it the XML code of “Hello World” function. Then  I created the Ngrok link to be used as the Webhook  URL. The XML code is version="1.0" encoding="UTF-8"?>

Hello World

Webhook URL during the test was : https://9fea1f71645c.ngrok.io/tutorial/tutortial1/hello.xml

Then I configured the Webhook URL  on the Twilio number

The test was successful. After the phone rings, it will say the sentence “Hello World. This is Dr. Hidaia Phone”

b) Testing Voicemail using different options:

1. I tested TwiML Bins function for call recording with following XML

version="1.0" encoding="UTF-8"?>

     Record your message after tone      timeout="20" transcribe="true" />

Then I configured the TwiML Bins on the Twilio number

The test was successful. After the phone rings, you will be promoted to record your message. The message will be recorded and can be found in the message logs.

2. I tested Twilio call recording using the Webhook URL for the XML code for call recording. The XML code is version="1.0" encoding="UTF-8"?>

     Record your message after tone

     timeout="20" transcribe="true" />

Webhook URL during the test was:

https://1e2153f92453.ngrok.io/tutorial/tutorial4/record.xml

Then I configured the Webhook URL  on the Twilio number The test was successful. After the phone rings, you will be promoted to record your message. The message will be recorded and can be found in the message logs.

3. I tested the Voicemail using studio flow. I created a studio flow that connects the  “Incoming Call” trigger  with “Record voicemail ” widget. Then I published the flow.

Then I configured the Studio flow on the Twilio number

The test was successful. After the phone rings, you will be promoted to record your message. The message will be recorded and can be found in the message logs.

4. I tested the Voicemail using Twilio Autodialer. I Voicemail from the Twilio Autodialer Settings. When the call is made to your Twilio phone number and no answer, the caller will hear the voicemail message and then the caller will be requested to record his message. The voicemail will be recorded under the voicemail tab.

c) Testing Call Forwarding  using different options:

1. I tested TwiML Bins function for call forwarding with following XML

version="1.0" encoding="UTF-8"?>

    +970598725325     Goodbye

Then I configured the TwiML Bins on the Twilio number

The test was successful. After the phone rings, the call will be forwarded to the phone number you setup in the TwiML Bins function.

2. I tested Twilio call forwarding  using the Webhook URL for the XML code for call forwarding. The XML code is version="1.0" encoding="UTF-8"?>

    +970598725325

    Goodbye

Webhook URL during the test was:

https://1e2153f92453.ngrok.io/tutorial/tutorial3/forward.xml

Then I configured the Webhook URL  on the Twilio number The test was successful. After the phone rings, the call will be forwarded to the phone number you setup in the XML

3. I tested the Call Forwarding using Twilio Autodialer. I enabled Voicemail from the Twilio Autodialer Settings. You must setup the phone number to forward the call to it.

The test was successful. After the phone rings, the call will be forwarded to the phone number you setup in the TwiML Bins function.

14. Summary of testing Programmable Messaging through different options:

a) Testing SMS and MMS Messages without responding:

In my case I rent a UK phone number. I was able to send from that phone number to any international number. But I was not able to receive message to my Twilio UK phone number from non UK international numbers. I was able to receive only messages from only certain UK numbers. They gave me the following reason:

((As you are trying to receive messages to your UK Twilio number from Non-UK number, and as this is inbound international delivery case, it was documented clearly that Twilio doesn’t support these cases, and we cannot guarantee such delivery from other countries. This is because the messages coming to Twilio follow other routes that what Twilio has, and we have no insights on the routes and the networks that are delivering these messages.))

1. I tested TwiML Bins function to Receive SMS and MMS Messages without Responding. TwiML Bins function has the following XML form:

Then I configured the TwiML Bins on the Twilio number. The number can accept messages only from certain domestic UK numbers. It is very difficult to deal with as it can’t accept SMS from any number.

2. I tested SMS and MMS Messages without Responding using the Webhook URL for the XML code for receiving SMS without responding. The XML code is

Webhook URL during the test was:

https://2eb33edc8740.ngrok.io/tutorial/tutorial5/sms.xml

Then I configured the Webhook URL  on the Twilio number. The number can accept messages only from certain domestic numbers. It is very difficult to deal with as it can’t accept SMS from any number. 3. I enabled the SMS option on the Autodialer settings.  You can see all received SMS Messages using But  the TwiML Bins, the Webhook URL or the studio flow must be configured on the phone number from the Twilio account dashboard as that can’t be done using the Auto dialer

b) Testing Forwarding SMS and MMS Messages

1. I tested TwiML Bins function to forward SMS and MMS Messages. The TwiML Bins function has the following XML form:

version="1.0" encoding="UTF-8"?>

    to="+970598725325">{{From}}: {{Body}}

The number can accept messages only from certain domestic numbers. The message forwarded successfully.

2. I tested forwarding SMS and MMS Messages using the Webhook URL for the XML code for SMS forwarding . The XML code is

version="1.0" encoding="UTF-8"?>

    to="+970598725325">{{From}}: {{Body}}

Webhook URL during the test was:

https://2eb33edc8740.ngrok.io/tutorial/tutorial3/forward.xml

The number can accept messages only from certain domestic numbers. The message forwarded successfully.

3. I tested forwarding SMS and MMS Messages using studio flow. Create studio flow:

. From the "Widget Library" on the right, drag and drop a Send Message widget into the flow.

Click the Send Message widget to display the widget's options on the right. Enter the following in the MESSAGE BODY field NEW MESSAGE FROM: {{trigger.message.From}}

BODY: {{trigger.message.Body}}

In the SEND MESSAGE widget options, scroll to and click to & CHAT Enter the desired destination forwarding number in the SEND MESSAGE TO field, and then click Save and Publish the

The number can accept messages only from certain domestic numbers. The message forwarded successfully.

c) Testing Sending Messages through different options

1. I tested Sending Messages from the dashboard of the Twilio Account. Go to Messaging section. Then select “Send SMS”. Select the Messaging Service you would like to use while sending the SMS and the phone number you want to send the message, and send your message.

The link: https://console.twilio.com/us1/develop/sms/try-it-out/sendan-sms The message was delivered successfully.

2. I tested Sending Messages using Twilio Autodialer. Enable SMS from the Autodialer settings.  Then go to Messages page and create the message. You must indicate the phone number you would like to send the message to. The message delivered successfully

15. Creating free website to save the files on it:

1. You can see in the web site http://www.absolutely-freehosting.com/free_hosts_01.php, some of the free web hosting.

2.  I chose to create a website in https://www.000webhost.com 3. Signup at https://www.000webhost.com. You will get one free webhosting. You must choose the website name and password when signing up. In my case, I got the following two website names after signing up: https://part-attorney.000webhostapp.com/ https://rhonchial-guesses.000webhostapp.com/ 4. When logon on, you will get the following dashboard

5. Click “Manage Website” to go to a particular website control panel. As example, this is the link of the control panel of the

website https://part-attorney.000webhostapp.com https://www.000webhost.com/members/website/part-attorney/build

6. From tools menu, you can go to the file manager where you can upload your website files. Choose “File Manger” to upload the website files. The link is

https://files.000webhost.com/

7.  There are two folders, the public_html folder and temp folder. We must upload the website files in public_html folder

8. As an example, I uploaded the XML files used in the previous tutorials that I hosted on the XAMPP server to be used as webhook URL through the ngrok links. I uploaded the XML files Hello.xml, conference.xml, sms.xml, forward.xml, record.xml

9. Now the webhook URLs will become: https://part-attorney.000webhostapp.com/hello.xml https://part-attorney.000webhostapp.com/sms.xml https://part-attorney.000webhostapp.com/forward.xml https://part-attorney.000webhostapp.com/record.xml https://part-attorney.000webhostapp.com/conference.xml

16. Making voice call using Twilio in browser

1.You need to download  “Voice App using Twilio Client”. App using Twilio Client” is a sample app that will show you how to:

Add voice communications to you’re the web application to call a customer using Twilio Client (VOIP) or via PSTN Make outbound calls from a website to a PSTN number (VOIP to PSTN) Make outbound calls from a website to the same website in new browser tab (VOIP to VOIP)

2. Download Voice App using Twilio Client  from

https://drive.google.com/file/d/1SAxlkBEeKJWwJ-ko8HiF-IZTLWsoHcl/view

The downloaded file is TWILIO-VOICE-CALL-FROM-BROWSER.zip

3. Extract the zip file, and name the extracted folder as javascript folder. The folder will contain the following files:

index.html, jquery.min.js, quickstart.js, request.php, site.css, twilio.min.js

4. Upload the javascrip folder to the public_html folder of your web site at 000webhost.com using the file manager https://files.000webhost.com/. In my case my website was https://part-attorney.000webhostapp.com. So the link of index.html folder will be https://partattorney.000webhostapp.com/javascript/index.html. You will get the following screen

5. In Twilio account dashboard, go to Programmable Voice section, then TwiML Apps. A TwiML Application is a set of URLs and other configuration data that tells Twilio how to handle incoming calls or messages. You can set the Request URL, Fallback URL and others on a TwiML App, instead of directly setting them on a phone number. You can then assign the TwiML App to multiple phone numbers. Any changes to the configuration data in a TwiML App are instantly applied to all phone numbers. 6. Create TwiML App. Name the App and enter the Request URL to be the link of request.php page. In my case I put

TwiML App name: hidaia-voicecall

Request URL: https://partattorney.000webhostapp.com/javascript/request.php

7. After you created the TwiML App, it will be listed among the list of TwiML Apps. Go to the created TwiML to get its SID 

8. Then go to functions section in your Twilio account dashboard. Create a Function to respond to Twilio Webhook Events like an incoming phone call or inbound SMS. You can also create a Function to respond to other kinds of HTTP requests or for integration into Twilio Studio or Twilio Flex. Select “Create Function”. You will get the following screen:

9. Choose “Twilio Client Quickstart“, you will get the following page. Enter the “TWIML_APP_SID”, and “CALLER_ID” The “TWIML_APP_SID” must be your created TWIML_APP SID. In my case hidaia-voicecalll SID The  “CALLER_ID” must be your Twilio phone number that you want to use as Caller_ID

10. After that you will see two functions created, one  has a path /client-voice and the other has path /capability-token

11. Go to the/capability-token  function to edit the function. You must change the following line:  const identity = 'the_user_id' To be  TwiML App name. In my case ‘hidaia-voicecall’

const identity = 'hidaia-voicecall' Copy the link of capability-token function: In my case the URL link was: https://pear-kouprey-4104.twil.io/capability-token

12. Go to your website file manager https://files.000webhost.com. Edit the file quickstart.js. Configure the following line to be the capability-token function URL. In my case https://pear-kouprey4104.twil.io/capability-token:

$.getJSON('

13. Go to your website file manager https://files.000webhost.com. Edit the Configure the callerId in the file to be your Twilio phone number that you used as

14. Now browse your website index.html link. In my case:

https://part-attorney.000webhostapp.com/javascript/index.html You will get the following page

15. Now you can make a call from the browser easily.