Tus clientes podrán usar el saldo de su cuenta bancaria para comprar en tu sitio o aplicación
Web
iOS
Android
Permite que tus clientes aprovechen el saldo disponible en su cuenta bancaria para adquirir tus productos o servicios desde tu página web, a través de PSE o PSE Avanza. Para lograrlo, debes habilitar el listado de bancos disponibles en Colombia, obtener los datos básicos de tu cliente pagador y direccionarlos al sitio de su sucursal bancaria virtual, para realizar el débito a la cuenta bancaria.
El flujo de pago para PSE (Versión 1.0) que integrarás es el siguiente:El flujo de pago para PSE Avanza (Versión 2.0) que integrar ás es el siguiente:Con esta versión mejoramos la experiencia de usuario permitiendo a tus clientes comprar en menos pasos.
Importante
Ten en cuenta que, debido a nuestras políticas de riesgo, los medios de pago disponibles y el tipo de integración pueden variar al momento en que formalices la afiliación. Te indicaremos cómo proceder en caso de que este proceso aplique para tu comercio.
La responsabilidad del front-end es recolectar los datos principales del usuario, tokenizar esa información a través de los servidores de Kushki y luego enviarla al back-end para iniciar el proceso de pago.Para ello cuentas con dos opciones: Kajita y Kushki.js.
Kushki cuenta con formularios de pago listos para recopilar información de tarjeta de forma segura. Podrás usar cualquiera de nuestras versiones:
Cajita: la primera versión del formulario de pagos. No es personalizable.
Kajita: la segunda versión. Te permite personalizar tus formularios de pago desde tu Consola de administración e incluso tener varias versiones de Kajita.
Incluye el script de kushki-checkout.js en tu página de pago añadiéndolo al <head> de tu archivo HTML. Siempre carga kushki-checkout directamente desde cdn.kushkipagos.com. No incluyas el script en un bundle o paquete ni hostees una copia de él.
Kajita necesita un espacio dentro de tu página. Ingresa el siguiente código en el <body> de tu sitio donde quieras que se despliegue el formulario de pago.Para Kajita (v.2):
Para Cajita (v.1):
Recuerda configurar la acción del formulario action de acuerdo con el endpoint correspondiente en tu back-end, para obtener el token.Luego, agrega el tag script.Para la Kajita (v.2) podrás obtener dicho script desde tu Consola de administración, según lo explicado en Crea y personaliza tus Kajitas.
Para la v.1 (Cajita), añade el siguiente script y asegúrate de que el formulario se haya cargado:
Esto creará un formulario predefinido en tu página para aceptar pagos.
Puedes utilizar Kajita para ofrecer no solo pagos a través de transferencias, sino también con tarjeta o con efectivo.
Antes de generar el token, necesitas cargar el listado completo de bancos disponibles, para que el cliente pagador pueda seleccionar la entidad para efectuar la transferencia:
Recolecta la información del usuario y envíala a tu back-end#
Primero, añade el formulario a tu página de pagos con los campos requeridos. Puedes diseñarlo como desees.Por ejemplo:
Envía notificaciones a tus clientes
Si deseas que tus clientes reciban notificación de sus transacciones, asegúrate de capturar el email de tu cliente en el formulario de pago. Adicional a esto, recuerda habilitar la opción de envío de notificaciones desde tu Consola.
Luego, cuando el usuario envía el formulario, deberás solicitar el token y enviarlo a tu back-end.
En caso de no haber detectado en el token toda la información necesaria para poder generar la transacción con PSE Avanza, a tus clientes se les mostrará un formulario, el cual será enviado una única vez para registrar sus datos.
La responsabilidad del back-end es recibir el token obtenido desde tu front-end e iniciar el proceso de pago con Kushki.Cuando el usuario envía el formulario, tu front-end transfiere un token al endpoint que hayas especificado. Con este token, deberás realizar una llamada a nuestro endpoint de cobros para iniciar el proceso de cobro.
El inicio de la transacción requiere la cabecera Private-Merchant-Id. Nunca expongas tu Private Key en código de front-end: esta llamada debe salir siempre desde tu back-end.
JavaScript
Python
PHP
Si utilizas la versión 1.0 de PSE no es necesario que envíes el objeto contactDetails.
Para PSE (Versión 1.0)
De acuerdo a la respuesta del consumo del método para iniciar la transacción, redirecciona al usuario hacia PSE usando el parámetro redirectUrl para que tu cliente pueda autenticarse y así autorizar el débito del monto de la transacción del saldo de su cuenta bancaria.
Para PSE Avanza (Versión 2.0)
De acuerdo a la respuesta del consumo del método para iniciar la transacción, redirecciona al usuario hacia la URL que te retorna Kushki para que pueda autenticarse en el portal virtual de su entidad bancaria y así autorizar el débito del monto de la transacción del saldo de su cuenta bancaria.
Para la redirección, trata de no utilizar contenedores como Frame, Panel, o IFrame. Evita funciones como ventanas de pop-up ya que pueden ser bloqueadas por el navegador. Redirecciona al usuario en la misma pestaña o ventana.
Una vez terminado el pago en el portal de PSE (Versión 1.0) o en el portal bancario (Versión 2.0), se retornará el cliente con una llamada GET a la callbackUrl que hayas especificado al solicitar el token.Junto con la URL de retorno te enviaremos en la ruta el token de la transacción, con el cual puedes verificar el estado de la transacción utilizando este endpoint. Además, obtendrás la información necesaria para el comprobante de pago de tu cliente.Por ejemplo, para callbackUrl = 'http://www.example.com' se retornará el cliente a:GET https://www.example.com/?token=26735cbb653a421ba7138eb515e0ab1ddonde token es igual a 26735cbb653a421ba7138eb515e0ab1dDe acuerdo con la respuesta que recibas del estado de la transacción, muestra al usuario una pantalla de éxito o fracaso para informar al cliente si el pago se realizó correctamente o si hubo un error.
El resultado final de estos datos de prueba depende de la configuración de tu comercio: requiere que el ambiente de pruebas (sandbox) esté activo en tu comercio y que el procesador asignado admita simular ciertos estados. Si no obtienes el resultado esperado, escribe a tu ejecutivo de Kushki o a soporte.
Existen números de identificación de prueba que puedes utilizar para asegurarte de que tu integración está lista. Úsalos para simular cualquier estado:
Transacción aprobada: 123456789
Transacción pendiente: 999999990
Transacción en estado rechazado ('NOT_AUTHORIZED'): 100000002
Transacción fallida ('FAILED'): Cualquier número de identificación
Toma en consideración las siguientes pautas para aprobar la certificación técnica (requerida para obtener credenciales productivas):
El cálculo de los impuestos y el monto total, debe ser el correcto.
Muestra tus mensajes en pantalla de acuerdo con las respuestas de Kushki.
Guarda y registra todas las respuestas de Kushki (requeridas en caso de necesitar soporte).
El cliente debe reconocer el método de pago que está utilizando, por lo que debes incluir el logo de PSE.
Puedes mostrar el medio de pago, como:
Débito desde cuenta corriente/Ahorros
Débito bancario PSE
Evita utilizar los siguientes textos:
Transferencia bancaria
Débito a cuenta
Para la redirección no utilices contenedores como Frame, Panel, IFrame, etc. Evita funciones como las ventanas emergentes que son bloqueadas por los navegadores, y redirige en la misma pestaña y/o ventana.
En el comprobante de pago, agrega la siguiente información:
Nombre de tu empresa (Nombre o razón social)
NIT de tu empresa (NIT)
Descripción del pago
Fecha de la transacción
Estado de la transacción
Código de trazabilidad (CUS). Lo puedes obtener en la respuesta del método init
Muestra el estado de la transacción de la siguiente forma:
ProcessorStateOK:APROBADA El estado no debe mostrarse en inglés. Adicional, evita el uso de sinónimos, como: exitoso, autorizada, aceptada, pagada, afirmativo, etc.
ProcessorStatePENDING:PENDIENTE El estado no debe mostrarse en inglés. Adicional, evita el uso de sinónimos, como: en confirmación, sin resolver, incompleto, etc.
ProcessorStateNOT_AUTHORIZED:RECHAZADA El estado no debe mostrarse en inglés. Adicional, evita el uso de sinónimos, como: declinado, cancelado, no aceptado, etc.
ProcessorStateFAILED:FALLIDA El estado no debe mostrarse en inglés. Adicional, evita el uso de sinónimos, como: falla, error, etc.
Incluir dentro del recibo de pago, un enlace (botón) para acceder a un módulo de consulta en el que se muestren los siguientes datos básicos: CUS, monto, fecha de la transacción, estado actual. Las empresas que no requieran autenticación con nombre de usuario y contraseña para realizar pagos, no tendrán que construir el módulo de consulta.
Incluir una opción para descargar e imprimir el recibo.
Si la transacción queda PENDIENTE, NO se debe permitir realizar una nueva transacción hasta que el estado final de la misma sea aprobada o rechazada.
La transacción no puede estar en PENDING:PENDIENTE por más de 21 minutos.
Todos los estados deben incluir el texto con un número de teléfono y una dirección de correo electrónico de tu empresa, donde tus clientes puedan verificar el estado de la transacción.
En caso de que recibas correctamente la notificación al Webhook, responde la solicitud con un statusCode 200 e informa a tu cliente.
El botón "Pagar" se desactiva después del primer clic.
El logo de Kushki debe ser visible para el cliente. Puedes encontrar nuestro logo en varios formatos aquí.
Asegúrate de enviar todas las variables requeridas, especificadas en la referencia de la API.
Acepta webhooks
Maneja eventos post-pago de la manera correcta.
Consulta el estado de tus transacciones
Con el token que recibiste desde el front-end, también podrás consultar el estado de las transacciones por medio de nuestra API.