SMS bidireccionales para captar clientes

Los SMS programables no sólo son útiles para las notificaciones unidireccionales. Cuando combinas notificaciones salientes con mensajes entrantes creas interacciones tipo chat entre tu empresa y tus clientes.

En este tutorial

Ya ve lo rápido que es integrar la comunicación bidireccional en su aplicación: envíe una notificación de entrega al número de teléfono de su cliente y gestione su respuesta cuando quiera cambiar una franja horaria de entrega.

El flujo de trabajo para tu aplicación es:

Phone numberVonageAppPhone numberVonageAppRequest acceptedRequest acceptedRequest to SMS APIResponse from SMS APISend delivery notification SMSReply to delivery notificationSend reply to webhook endpointRequest to SMS APIResponse from SMS APISend acknowledgement in SMS

Para ello:

  1. Configurar un número virtual de Vonage - alquilar un número virtual y configurar los puntos finales de webhook para los mensajes entrantes
  2. Crear una aplicación web básica - cree una aplicación web para recopilar el número de teléfono de sus clientes.
  3. Enviar una notificación SMS - envíe a su cliente una notificación de entrega en un SMS y solicite una respuesta.
  4. Procesar el SMS de respuesta - procesar y acusar recibo de la respuesta SMS.

Requisitos previos

Para trabajar a través de este tutorial que necesita:

Configurar un número virtual de Vonage

Vonage reenvía los mensajes entrantes al punto final de webhook asociado con tu número virtual de Vonage.

La gestión de los Numbers virtuales se realiza a través de la opción API para desarrolladores o el CLI de Vonage. Los siguientes ejemplos utilizan la CLI de Vonage para alquilar un número de Vonage:

vonage numbers search US

✅ Searching for numbers

There is 1 number available for purchase in United States

Number       Type    Features         Monthly Cost  Setup Cost
-----------  ------  ---------------  ------------  ----------
16127779311  Mobile  MMS, SMS, VOICE  €0.90         €0.00

Use vonage numbers buy to purchase.

vonage numbers buy US 16127779311 
✅ Searching for numbers
Are you sure you want to purchase the number 16127779311 for €0.90? [y/n] y

✅ Purchasing number
Number 16127779311 purchased

Number: 16127779311 
Country: 🇺🇸 United States
Type: Mobile
Features: MMS, SMS, VOICE
Monthly Cost: €0.90
Setup Cost: €0.00
Linked Application ID: Not linked to any application
Voice Callback: Not Set
Voice Callback Value: Not Set
Voice Status Callback: Not Set

A continuación, asocie el número virtual a su punto final de webhook que gestiona los SMS entrantes:

vonage numbers update US 16127779311 `
  --voice-status-callback='https://example.com/voice/status' `
  --voice-callback-value='https://example.com/voice/callback' `
  --voice-callback-type='sip'
  
Searching for number to update [======================================] 1/1 100%

Number updated successfully

Number: 16127779311 
Country: 🇺🇸 United States
Type: Mobile
Features: MMS, SMS, VOICE
Monthly Cost: €0.90
Setup Cost: €0.00
Linked Application ID: Not linked to any application
Voice Callback: sip
Voice Callback Value: https://example.com/voice/callback
Voice Status Callback:https://example.com/voice/status

NotaAsegúrese de que su servidor está en funcionamiento y disponible al público antes de asociar el punto final del webhook a su número virtual. número virtual. Vonage debe recibir una respuesta 200 OK de tu punto final de webhook para que la configuración sea exitosa. Si estás desarrollando localmente, utiliza una herramienta como ngrok para exponer su servidor web local a Internet.

Ahora que ha configurado su número virtual, puede enviar notificaciones de entrega de SMS.

Crear una aplicación web básica

Utilice Sinatra para crear una aplicación Web de una sola página:

Gemfile

source 'https://rubygems.org'

# our web server
gem 'sinatra'

app.rb

# web server and flash messages
require 'sinatra'

# load environment variables
# from .env file
require 'dotenv'
Dotenv.load

# Index
# - collects a phone number
#
get '/' do
  erb :index
end

Añade un formulario HTML para recoger el número de teléfono al que enviarás un SMS de notificación:

vistas/index.erb

<form action="/notify" method="post">
  <div class="field">
    <label for="number">
      Phone number
    </label>
    <input type="text" name="number">
  </div>

  <div class="actions">
    <input type="submit" value="Notify">
  </div>
</form>

El formulario captura el número de teléfono en el campo E.164 esperado por SMS API:

Enviar una notificación SMS

En este tutorial, para enviar un SMS se añade el botón SDK de servidor de Vonage para Ruby a su aplicación:

Gemfile

# the nexmo library
gem 'vonage'
# a way to load environment
# variables
gem 'dotenv'

Usa tu API de Vonage clave y secreto para inicializar el cliente:

app.rb

# Vonage library
require 'vonage'
vonage = Vonage::Client.new(
  api_key: ENV['VONAGE_API_KEY'],
  api_secret: ENV['VONAGE_API_SECRET']
)

Notano almacene sus credenciales API en su código, utilice variables de entorno.

Para recibir respuestas a sus SMS de notificación, debe establecer su número virtual como SenderID para los mensajes salientes cuando realice una solicitud a SMS API:

app.rb

# Notify
# - Send the user their delivery
#   notification, asking them
#   to respond back if they
#   want to make any changes
#
post '/notify' do
  notification = "Your delivery is scheduled for tomorrow between " +
                 "8am and 2pm. If you wish to change the delivery date please " +
                 "reply by typing 1 (tomorrow), 2 (Thursday) or 3 (deliver to"
                 "post office) below.<br/><br/>";

  vonage.sms.send(
    from: ENV['VONAGE_NUMBER'],
    to: params['number'],
    text: notification
  )

  "Notification sent to #{params['number']}"
end

Para Verify que este SMS fue recibido por el cliente, compruebe el recibo de entrega. Este tutorial no verifica los recibos de entrega.

Procesar el SMS de respuesta

Cuando tu cliente responde a tu SMS de notificación, Vonage reenvía el mensaje de entrada a el punto final de webhook asociado al número virtual.

En esta aplicación tutorial se procesa el webhook entrante, se extrae el texto y el número, y se envía un mensaje de confirmación al cliente.

app.rb

# Receive incoming message
#
# - Receives incoming SMS
#   message, stores it, and
#   notifies sender
#
get '/update' do
  choice = params['text']
  number = params['msisdn']

  # You can store or validate
  # the choice made here

  message = "Thank you for picking option #{choice}. " +
            "Your delivery is now fully scheduled in."

  vonage.sms.send(
    from: ENV['VONAGE_NUMBER'],
    to: number,
    text: message
  )

  body ''
end

El almacenamiento y la validación de las entradas de los clientes está fuera del alcance de este tutorial.

Ahora responde al SMS que has recibido antes. Deberías ver cómo tu aplicación lo procesa y recibir una confirmación de tu elección en cuestión de segundos.

Conclusión

Así de rápido es enviar y recibir SMS en tu aplicación. Con unas pocas líneas de código has enviado un SMS al teléfono de un cliente' de un cliente con la SMS API, gestionado una respuesta y respondido con una confirmación.

Obtener el código

Todo el código de este tutorial está disponible en el archivo SMS bidireccionales para captar clientes GitHub repo.

Recursos