fbpx

Si tienes un negocio y constantemente recibes pagos de diferentes cantidades, sabes lo tedioso que llega a ser tener que solicitarlos por medio de un depósito bancario. Implica un esfuerzo extra de la otra persona: debe entrar a su banco en una aplicación, agregar tu contacto a una lista especial, escribir la cantidad y autorizarla con un token. No siempre tomamos en cuenta este proceso si estamos muy acostumbrados a hacerlo, pero causa una fricción suficiente como para demorar el pago, porque este camino varía para cada persona.

Entonces, mientras más podamos facilitar el proceso para que quien tenga que hacerte un pago, simplemente lo haga, deberíamos buscar hacerlo. Hay muchas plataformas que intentan solucionar esto de formas muy innovadoras, pero en la que quiero que nos enfoquemos hoy, es en habilitar lo más sencillo y cotidiano que sabemos que funciona: pagos con tarjeta de crédito.

En este artículo voy a contarte un poco sobre nuestro camino para implementar estos pagos en línea y te compartiré las herramientas que utilizamos nosotros para hacerlo. Esta guía no es exhaustiva porque sería muy larga y técnica, entonces si solamente quieres usar este servicio contáctanos y te podemos ayudar a implementarlo. Si eres desarrollador o simplemente muy curioso sobre cómo resolvimos este problema, ¡continúa leyendo!

Simplificando el problema: solo quiero recibir pagos

El problema inicial es muy simple: queremos poder hacer cobros eventuales y de cantidades variables con una simple página de pago pública. Estamos acotando la solución a solamente eso por ahora, porque si empezamos a hablar de conectarlo con más sistemas, la cosa se complica mucho y muy rápido.

Entonces, lo que queremos poder hacer es simplemente darle a un cliente un link a una dirección web, que introduzca los datos mínimos para un típico pago por internet, que seleccione el botón de ‘Pagar’ y reciba un mensaje de que su pago fue procesado exitosamente. Fin de la historia. Las demás comunicaciones y procesos, las seguimos manejando como siempre: Whatsapp, correo, etc.

Los datos que le pediremos al cliente son:

  • Número de tarjeta de crédito o débito
  • Nombre
  • Correo
  • Concepto del pago
  • Cantidad a pagar

En nuestro diseño, también mínimo, esto se ve así:

Y así se ve la versión de escritorio:

Opcionalmente, queremos poder elegir entre diferentes monedas, porque algunos de nuestros clientes son internacionales:

Y finalmente, también opcional pero muy útil, tenemos una forma de enviar un link en el que esté preparada desde antes la información de la cantidad de pago. Por ejemplo, si queremos solictar un pago de 100 USD , tendríamos un link preparado de esta forma:

  • https://pagos.midominio.com/100USD

Explorando plataformas de pagos

Para poder procesar la información de cada pago, necesitamos forzosamente una plataforma que pueda manejar esto por nosotros. Después de investigar muchas opciones que se acercaban a nuestro objetivo, la verdad es que ninguna simplificaba el proceso tanto como nosotros queríamos.

Probamos, por ejemplo, con PayPal y su servicio de PayPal.Me, que básicamente genera una página personal en la que te pueden hacer pagos. Lo que no nos gustó, fue que requiere que tu cliente haga o tenga ya una cuenta de PayPal, y ese paso extra, nos dejó básicamente en el mismo lugar con algunos clientes que simplemente no querían o no podían usar PayPal.

El botón de Next te lleva a darle tus datos a PayPal. No nos sirve.

Otras plataformas parecían muy buenas, como MercadoPago o TransferWise, pero casi todas están pensadas para ser integradas a otro proceso de e-commerce con inventarios, productos, cuentas de usuario, y demás cosas que nos sobran, porque, de nuevo, nuestro objetivo es solo recibir pagos de cualquier cantidad con tarjeta. Otra razón por la que no elegimos algunas plataformas, fue que requerían procesos muy largos y engorrosos para inscribirse e identificarse (este fue el caso de OpenPay, que requería una entrevista personalizada por videollamada y mucha documentación).

Integración de Stripe como procesador de pagos

Stripe fue el procesador de pagos que se acomodó perfectamente a nuestra necesidad, porque provee una plataforma muy flexible para configurar pagos con tarjeta y tanto herramientas como documentación muy accesibles para desarrolladores.

Creamos entonces nuestra cuenta de Stripe en stripe.com:

Después, integramos la idea de los pagos eventuales en su plataforma, con el diseño que expusimos en un principio, a su vez basado en los ejemplos de Stripe Elements . Como tal no había un ejemplo que pudiéramos usar que ya estuviera listo para implementar, entonces decidimos hacerlo nosotros y compartir el código con la comunidad open source:

Con ese código, utilizamos la interfaz de desarrollador de Stripe en la sección de desarrolladores (developers) para obtener nuestras API Keys:

Otro requisito que nos pusimos fue el no tener que utilizar un servidor tradicional que se estuviera ejecutando todo el tiempo sin sentido, sino que la página fuera prácticamente estática y solo atendiera las peticiones necesarias para mostrarse y procesar el pago. Para implementar esto, nos funcionó muy buena utilizar un servicio de Google Cloud Platform llamado Cloud Functions for Firebase. Si estás familiarizado con AWS, es el equivalente al servicio de AWS Lambda.

La explicación de cómo configurar e implementar cada una de estas cosas, la dejaré para una serie de posts futuros, porque son varias cosas técnicas a tomar en cuenta, pero sí te quiero compartir que todo esto que estoy exponiendo es código abierto. Si quieres colaborar con nosotros en el código como desarrollador y proponer mejoras, solamente debes ir al repositorio de Github y crear un pull request.

Tesel te ayuda a implementar pagos en línea

Si te interesa implementar este sencillo sistema de recepción de pagos con tarjeta de crédito para tu dominio pero no quieres preocuparte por todas las implicaciones técnicas, solamente contáctanos y con gusto nos puedes contratar para que te ayudames a configurar tu propia página para recibir pagos con Stripe.