Saltar al contenido principal

Crear un Botón de Pago

Una vez que tu cuenta esté verificada en Nivel 2, puedes crear un botón de pago desde el panel de ApoloPay (dashboard). Esto generará las llaves API que necesitarás para la integración.

Creando el Botón

  1. Inicia sesión en el Panel de ApoloPay
  2. Navega a la sección Configuración
  3. Haz clic en "Crear Botón"
  4. Ingresa un nombre para tu botón (ej. "Mi Tienda en Línea", "Página de Pago") — esto es solo para tu referencia para identificar el botón
  5. Haz clic en "Continuar"

Después de hacer clic en continuar, ApoloPay generará dos llaves para ti:

LlavePropósitoDónde usarla
Llave Pública (Public Key)Identifica tu botón en el frontendPasada como propiedad (prop) al componente SmartPay
Llave Privada (Private Key / Secret)Autentica tus llamadas a la API en el backendUtilizada en el header x-secret-key al llamar a la API
¡Mantén tu Llave Privada segura!

Nunca expongas tu Llave Privada en el código del frontend, repositorios públicos o JavaScript del lado del cliente. Solo debe ser usaba en tu backend del lado del servidor.

Configurando Webhooks (Opcional)

Después de crear el botón, puedes configurar opcionalmente un webhook para recibir notificaciones en tiempo real cuando se complete un pago:

  1. En la configuración del botón, busca la sección Webhook
  2. Ingresa la URL de tu Webhook — el endpoint en tu servidor que recibirá las notificaciones de pago (ej. https://tutienda.com/api/webhooks/apolopay)
  3. Se generará un Secreto de Webhook (Webhook Secret) — usa esto para verificar que las solicitudes entrantes del webhook son genuinamente de ApoloPay
tip

Recomendamos encarecidamente configurar webhooks para entornos de producción. Proporcionan una confirmación de pagos confiable de servidor a servidor, que es más segura que depender únicamente de callbacks del frontend.

Para más detalles sobre el manejo de webhooks, consulta Webhooks →.

Qué Necesitarás para la Integración

Después de crear tu botón, tendrás todo lo necesario para integrar SmartPay:

ElementoEstado
Llave PúblicaPara el componente SDK del frontend
Llave PrivadaPara las llamadas a la API del backend (crear preórdenes)
URL del Webhook (opcional)Para recibir confirmaciones de pago
Secreto del Webhook (opcional)Para verificar la autenticidad del webhook

Siguiente Paso

Elige tu framework de frontend y sigue la guía de integración: