eric-brechemier / how-i-replaced-skype-with-twilio

How I replaced Skype with Twilio to make phone calls from my computer
Creative Commons Attribution 4.0 International
43 stars 9 forks source link

Configure Twilio to send/receive text messages #7

Closed eric-brechemier closed 2 years ago

eric-brechemier commented 5 years ago

Ideally, I would like to:

Barring that, I would like to:

HengYeDev commented 3 years ago

I'm currently writing an app (fork linphone) that will receive SMS from the Twilio API and also do the features of Linphone.

eric-brechemier commented 3 years ago

@HengYeDev Thank you for letting me know. I'll be interested to test it. Which platform are you targeting?

HengYeDev commented 3 years ago

I'm targeting android for now, may also do linux, ubuntu touch, and sailfish

eric-brechemier commented 3 years ago

@HengYeDev It seems that you are only targeting mobile phones. I might not be able to test it then.

I am still interested to hear about how it pans out.

HengYeDev commented 3 years ago

I'm also trying to get it to forward to email and when you respond to the email you respond to the text.

Heng Ye https://yeheng.org | Twitter https://twitter.com/HengYeDev

---- On Mon, 18 Jan 2021 13:32:45 -0500 Eric Bréchemier notifications@github.com wrote ----

https://github.com/HengYeDev It seems that you are only targeting mobile phones. I might not be able to test it then.

I am still interested to hear about how it pans out.

— You are receiving this because you were mentioned. Reply to this email directly, https://github.com/eric-brechemier/how-i-replaced-skype-with-twilio/issues/7#issuecomment-762411836, or https://github.com/notifications/unsubscribe-auth/AO5TJ6IUNU7WGYLVSDZWL2LS2R5E3ANCNFSM4HODR3RQ.

eric-brechemier commented 3 years ago

Neat!

eric-brechemier commented 2 years ago

I have compared different services to help me send and receive SMS messages by email; I have identified Pipedream as a suitable solution, which supports:

The icing on the cake is that Pipedream allows to build workflows step by step, showing you how the incoming data look like at each step, and letting you select values from that data in the configuration of each following step. This is the part that allows to actually build the bridge from SMS to email and back again, where other services that I studied only provide the pillars on each end.

eric-brechemier commented 2 years ago

Create Pipedream Account

Note: There is a limitation in email notifications sent by Pipedream at the moment: they can only be sent to the email address that you used to sign up to the service. This limitation will be lifted in an upcoming update of the platform, but at the moment, you should sign up with the email address were you want to receive your SMS messages.

  1. Go to Pipedream home page
  2. Click the button to Signup For Free.
  3. Fill in your email address (where you want to receive SMS messages) and your unique password for the service.

Sign Up Form

  1. Click the Sign Up button.
  2. Confirm or modify your user name. By default, it is identical to the part of you email before the @sign, but only alphanumerical characters and dashes are allowed.

Confirm Username Form

  1. You are invited to share more details about yourself.

Form to Tell Us More About Yourself

  1. You can safely Skip and continue.

This completes your sign up and initiates the creation of your first workflow. We will start by configuring a workflow to send SMS messages by email.

But first, you can check your email and confirm your email address. You should receive an email of the form:

Thanks for signing up to Pipedream!

Please verify your email by clicking this link: https://api.pipedream.com/verify-email?token=[long-secret-token]
  1. Click the link to confirm that your email address is valid.

Strange enough, no confirmation gets displayed.

eric-brechemier commented 2 years ago

Configure Workflow to Send SMS by Email

This workflow is made of two steps:

  1. a trigger: an email sent from your usual email client, which will provide the text and recipient for the SMS.
  2. a connection to Twilio SMS API to send the text as an SMS to the destination number.

The wizard for the creation of a new workflow invites you to select the trigger:

New Workflow: Add Trigger

We'll start by naming our workflow. At the top left of the window, it is currently named Untitled workflow.

  1. Click that name, select all text and replace it with your own name, e.g. Send SMS by Email.
  2. Leave the field by clicking somewhere else or pressing the tab key. The new name is saved automatically.

Rename Workflow: Send SMS by Email

  1. The trigger that we want is called Email. There is no need to search for it, it is already present in the list on the right:

Select Email Trigger

  1. Click the Email trigger. A unique email address is generated as input for this workflow:

New Inbound Email

  1. The wizard is now waiting for you to send a realistic email to this inbound address. Copy Email then open your usual email client.
  2. You may want to create a contact for this email. You can include Pipedream and your Twilio phone number in the display name for this new contact, as a reminder that this is the email to send SMS messages from this phone number.

The text of the SMS will simply be the text of the email. To make things simpler at a later step, I have configured my email client to send these email messages as plain text rather than in HTML format, and to avoid including any signatures or inlining the original message in a reply.

The phone number of the recipient will be provided in international format, starting with a + and the country code, omitting any part of the number, such as a 0, that is only used when calling local numbers. You should choose a regular mobile phone number to test the reception of SMS messages.

Your test email should contain something along these lines:

  1. When you are ready, send your test email. You are not going to get an SMS right away, because we are going to guide it step by step through the Pipedream workflow. The Pipedream interface should now show that your new event just arrived:

Email Trigger Received a New Event

  1. Click the new event. It displays the title of your email:

New Email Event

  1. Click this title and the event gets parsed as a hierarchical data structure.

Email Event Tree Structure

  1. You can click on the elements of that tree structure to expand them and find the parts of interest:
  1. That's all we need. Let's Continue.

  2. A second step is added, in which we will select the action to do in response to the trigger:

Add a Step

  1. In the input field to Search for an app, type Twilio, then select the Twilio app in the results:

Search and Select Twilio App

  1. In the list of actions part of the Twilio app, select Send SMS:

Select Send SMS Action

  1. You are now invited to connect your Twilio account:

Settings for Send SMS Action

  1. Click connect-a-twilio-account.

  2. The connection to Twilio API requires 3 different things, which you will find or create in your Twilio account:

Create a New Connection to Twilio

  1. Sign in to Twilio and go to your console dashboard.

  2. Scroll down the page and you will find your Account SID in the Account Info section.
    Copy it and paste it to the AccountSid field of the Pipedream configuration form.

Copy Account SID from Twilio

Instead of providing your master token, which is like giving the password to your whole Twilio account, we are going to create an API key with more limited privileges.

  1. Open the Account Menu found in the top right of your Twilio dashboard, then select API keys & tokens under the Keys & Credentials section.
  2. You may be requested to provide a confirmation code to access this sensitive area. In my case, the verification code was sent to my email.

Verification Code Required for Access

  1. Provide the code and Verify.
  2. You probably don't have any API keys yet:

You don't have any API keys

  1. Click the button to Create API Key.
  2. Describe the key as Pipedream (Send SMS):

Create New API Key

  1. Click Create API Key button to create a new Standard API key.
  2. A notification pops out briefly to confirm the creation of the key. The generated SID and Secret are now displayed below the three fields which describe the key:

Copy Secret Key

  1. Copy the SID and Secret in turn to the corresponding fields in the Pipedream connection settings.
  2. Optionally, describe this connection as Twilio API:

Create a New Connection to Twilio API

  1. Then Save.

Note: If your connection to the Twilio API fails to authenticate, you may have created the API key for a different region.
That happened to me: I had mistakenly created the API key for the Ireland region instead of the US.

  1. Next, click Select an option or enter a custom expression… in the From field.
  2. Wait while the Twilio API is contacted to list your phone numbers, then click on your Twilio phone number in the list of results:

Select Twilio Phone Number

We will use an expression to extract the phone number of the recipient from the subject of the email. Remember that we formatted the subject with the phone number in international format at the end: New SMS to +## ###-###-#####. We identified previously that the subject is stored at the location steps.trigger.event.headers.subject in the event generated for the incoming email by Pipedream. We are going to use a regular expression to extract the phone number, starting with the + sign, and keeping only the digits, discarding all other symbols such as dashes added for readability.

I used RegExr to test different regular expressions. I designed the replacement in two steps to cover some edge cases. The phone number is expected to start with the last + sign in the subject. Everything before the last + sign will be discarded:

  1. Remove all characters before the + sign found closest to the end: .replace(/^.+\+/,'+')
  2. Keep only the + sign and digits, discarding all separators and other symbols: .replace(/[^+0-9]/g,'')

Then I tested these replacements in the JavaScript console of a browser:

"New SMS to +1202-555-0488".replace(/^.+\+/,'+').replace(/[^+0-9]/g,'')
"+12025550488"

"Re[3]: 3rd SMS +1-2-3 to +1202-555-0488".replace(/^.+\+/,'+').replace(/[^+0-9]/g,'')
"+12025550488"
  1. Copy and paste the following expression in the To field of the send_sms configuration:
{{steps.trigger.event.headers.subject.replace(/^.+\+/,'+').replace(/[^+0-9]/g,'')}}
  1. For the text of the SMS, we will simply copy the contents of the email. Copy the following expression in the Message Body field of the send_sms configuration:
{{steps.trigger.event.body.text}}

send_sms Configuration Complete

  1. The configuration of the workflow to send SMS messages by Email is now complete, and your test SMS is ready to leave.

  2. If your test number is in a different country than your Twilio phone number or if you plan to send SMS messages internationally, you should activate the geographic permissions for each of these countries. In the Messaging section of the Twilio dashboard, open the Settings and Geo permissions subsections. Then select each country or region that you want to allow to send and receive SMS messages from.

Twilio Messaging Geographic Permissions

  1. You can click Test button to send your SMS message. If all goes well, you should see a notification that the test is in progress for a little while, then a notification of success.

Test Complete: Success

  1. The send_smsstep now shows the successful result.

send_sms Successul

  1. The SMS itself may take a while to arrive. In the meantime, you can check the logs on Twilio's side in the Monitor section of your dashboard, opening the Logs and Messaging subsections to see more details about the delivery of that SMS.

  2. Once you have successfully received the SMS, you can now Deploy the Pipedream workflow to allow it to process events automatically, instead of reviewing them step by step.

Congrats

Note: When sending an SMS to a phone number in a different country, your Twilio phone number may not be displayed as the sender. The recipient may see the short code of a local service instead. This should not happen when sending messages within the same country as your Twilio phone number.

eric-brechemier commented 2 years ago

Configure Workflow to Receive SMS by Email

We are now going to configure a second workflow to receive SMS messages as emails. Again, this workflow will have two steps:

  1. a trigger step, an HTTP webhook configured in Twilio to get notified of new SMS messages.
  2. an action step to send ourselves an email with the contents of the SMS.

This second workflow does not require a connection to Twilio API. It listens on an HTTP URL, which we will configure to get triggered by new SMS messages in the Twilio dashboard.

  1. In the left sidebar of your Pipedream dashboard, click Workflows to open the list of workflows.

  2. Click the New button to create a new workflow. We have now reached the stage where we were at the beginning of the configuration of the first workflow, which was created automatically for us just after the signup.

New Workflow

  1. Let's rename our workflow. Click the current name, Untitled workflow then remove previous text and type the new name, e.g. Receive SMS by Email. The name is saved automatically when you leave the input field.

Receive SMS by Email

  1. The trigger that we need is already displayed at the top of the list on the right.

Select HTTP/Webhook Requests

  1. Click HTTP / Webhook Requests to select this first step as trigger.

New HTTP/Webhook Trigger

  1. Twilio is expecting an answer from our webhook, a list of instructions in Twilio Markup Language (TwiML) format, a dialect of the XML language. We have no further actions to request from Twilio, so we will send an empty response, which has the following structure:
<?xml version="1.0" encoding="UTF-8" ?>
<Response/>

and must be served with the HTTP Content-Type header application/xml.

  1. Under HTTP Response, click the default value Return HTTP 200 OK to open the list and select Return a static response instead.

HTTP Response: Return a static response

  1. Under Status Code, type 200:

Status Code: 200

  1. Under Headers, click the EMPTY:EMPTY placeholder and replace it with Content-Type: application/xml:

EMPTY:EMPTY header placeholder

Content-Type: application/xml

  1. Click the X button to close that part of the form.

  2. Under the Body, click the input field and copy/paste there our static TwiML response:

<?xml version="1.0" encoding="UTF-8" ?>
<Response/>

Static TwiML response

  1. Finally, click Save and continue button to save our trigger step.

  2. Once the trigger is saved, Pipedream generates a new URL of the form https://[unique-id].m.pipedream.net for this trigger:

New Webhook URL

  1. Click Copy URL to copy this URL. We will configure it as webhook for new SMS messages in the Twilio dashboard.

  2. Go to your Twilio dashboard. In the Develop sidebar, open the Phone Numbers section then the Manage and Active Numbers subsections.

  3. Click the link which displays your phone number in the list displayed on the right.

  4. In the Messaging section, select Webhook and copy the URL of your Pipedream trigger under WHEN A MESSAGE COMES IN:

Twilio Messaging Webhook: When a Message Comes In

  1. Click the Save button to save the webhook configuration.

  2. Send an SMS to your Twilio phone number using a regular mobile phone. This is going to feed the Pipedream webhook which will show us what kind of data to expect from Twilio.

  3. If all goes well, the Pipedream trigger shows that a new event has arrived:

New SMS event

  1. Click Select event… to open the list and select the new event in the list:

Select New SMS Event

  1. Pipedream displays the data received from Twilio as a hierarchical structure:

Test SMS Data

  1. You can click elements in that tree to expand them and identify the location of items of interest. I have found the path of the two parts of the SMS that we will include in email notifications to yourself:
  1. Click the Continue button to complete the configuration of the webhook trigger.

  2. We will now add the Send Email action step, which is available in the list displayed on the right:

Select action to Send an Email to Yourself

  1. The configuration of the Send Email action step starts:

email_me action setup

In the subject, we will include the phone number of the sender, using a template message of the form:

New SMS from {{steps.trigger.event.body.From}}
  1. Under Subject, copy the above template, which you can customize to your liking:

Email Subject Template

  1. Click the X button to close that part of the form.

For the text of the email, we will simply provide the text of the SMS, using the template below:

{{steps.trigger.event.body.Body}}
  1. Under Text, copy the above template:

Email Text Template

  1. Click the X button to close that part of the form.

  2. Click the Test button to receive your test SMS by email.

  3. A few seconds later, Pipedream should display that the email was sent successfully:

email_me Action Successful

  1. You should now have received an email from notifications@pipedream.com on the email address that you used to register your Pipedream account.

  2. Once you have successfully received the email message, you can Deploy your second Pipedream workflow.

Congrats

Note: If you have not validated your email address, you may not receive any email, although testing the workflow will still pretend that the email was sent successfully.

eric-brechemier commented 2 years ago

You may leave your comments below.

ally9335 commented 11 months ago

@eric-brechemier you have a French number which is capable of receiving SMS, right? When searched for a French number at "buy a number", there's no support for SMS in France at all. How can it be?

Screenshot_20230903_232241

eric-brechemier commented 6 months ago

@ally9335 Sorry for the late answer. I do have a French phone number with SMS support.

In my experience, the availability of Twilio Phone Numbers in different countries varies over time. If I remember correctly, I had to check a couple of days in a row to find a suitable phone number in the UK. There might be a shortage of French numbers at the moment.

Checking today, there is not a single French phone number available from Twilio:

no French phone number