¿Cómo integrar Stripe con Bubble.io?

Integrar Stripe con Bubble.io es un proceso sencillo que comienza asegurándote de tener una cuenta activa en Stripe. Aquí tienes una guía paso a paso sobre cómo configurar la integración de Stripe usando el Plugin oficial de Stripe de Bubble:

Paso 1: Crea una cuenta de Stripe
Si aún no tienes una cuenta activa de Stripe, puedes crear una visitando el sitio web de Stripe. Necesitarás esta cuenta para obtener tus claves API para la integración.

Paso 2: Obtén tus claves API de Stripe
Inicia sesión en tu panel de control de Stripe y navega hasta la sección de claves API en la sección de Desarrolladores. Necesitarás recuperar tanto las claves API en vivo como las de prueba:

Para el entorno En Vivo:

• ID de cliente en vivo: Se encuentra en Configuración > Configuraciones de conexión.
• Clave secreta en vivo: Se encuentra en Desarrolladores > Claves API.
• Clave publicable en vivo: También en Desarrolladores > Claves API.

Para el entorno de Prueba:

• ID de cliente - desarrollo: Se encuentra en Configuración > Configuraciones de conexión.
• Clave secreta - desarrollo: Se encuentra en Desarrolladores > Claves API.
• Clave publicable - desarrollo: De nuevo, en Desarrolladores > Claves API.

Guarda estas claves ya que las introducirás en Bubble en breve.

Paso 3: Instala el Plugin de Stripe en tu aplicación Bubble
Ve a la sección de Plugins de tu editor Bubble y busca el Plugin oficial de Stripe. Instálalo en tu aplicación.

Paso 4: Configura las Preferencias del Plugin
En las preferencias del plugin, introduce las claves API que obtuviste de Stripe:

• Rellena los campos correspondientes con los ID de cliente, Claves secretas y Claves publicables para los entornos en vivo y de desarrollo.
• Si lo deseas, puedes agregar una imagen predeterminada para el Checkout de Stripe y establecer un nombre de producto predeterminado.
• Selecciona la versión de Checkout de Stripe (se recomienda la v3 sobre la v2).
• Elige configuraciones adicionales como la recopilación de direcciones de los usuarios o la activación de los pagos Link.

Paso 5: Configuración Adicional (Opcional)

• Si quieres usar un dominio personalizado con Checkout de Stripe, sigue los pasos para agregar tu dominio al panel de control de Stripe, crear registros DNS apuntando a Stripe, verificar tu configuración DNS y establecer tu dominio como activo.
• Ajusta las reglas de privacidad en Bubble que agrupan ciertos campos bajo "Redes Sociales" si deseas acceder a los datos de los clientes de Stripe.

Paso 6: Prueba tu Integración de Stripe
Antes de ponerla en servicio, usa el modo de prueba de Stripe para asegurarte de que todo funcione como se espera. Realiza transacciones de prueba utilizando tus claves de desarrollo y verifica que se estén procesando en el panel de control de Stripe.

Paso 7: Puesta en marcha
Después de hacer las pruebas y de asegurarte de que todo funciona correctamente, cambia al entorno en vivo y comienza a procesar transacciones reales. Recuerda, si cambias tu aplicación de desarrollo a la versión en vivo en Bubble, automáticamente usará las claves en vivo si están configuradas en el plugin de Stripe.

Asegúrate siempre de que tus planes de pago y productos tengan ID consistentes entre tus entornos de prueba y en vivo de Stripe para evitar problemas cuando cambies de desarrollo a en vivo. Siguiendo estos pasos, deberías tener Stripe integrado con éxito en tu aplicación Bubble.io.