Acepta un pago con tarjeta
Web
iOS
Android
Esta funcionalidad se encuentra disponible para los siguientes modelos:
☐ Adquirente☑ Agregador
¿Estas buscando un plugin?
Importante
1. Configura tu front-end
Kajita
Crea y personaliza tus Kajitas
Configura Kajita
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.Añade Kajita a tu sitio
<body> de tu sitio donde quieras que se despliegue el formulario de pago.action de acuerdo con el endpoint correspondiente en tu back-end, para obtener el token.script.Kushki.js
Configura Kushki.js
Opción 1 - CDN
script al final del <body> en tu página de pagos.Option 2 - NPM
Configura el objeto Kushki
Recoge la información del usuario y envíala a tu back-end
Muestra las opciones de diferidos de acuerdo al BIN de la tarjeta de tu cliente
type (corresponde al creditType al ejecutar el cargo), los meses disponibles y los meses de gracia (skip payments), tal como se muestra en el siguiente ejemplo de respuesta. Esta es la información que deberás usar al ejecutar el cargo: {
name: "Diferido con intereses",
type: "002",
months: ["3", "6"],
monthsOfGrace: ["1", "2", "3"]
}Importante
deferred o en el parámetro months cuando inicies el proceso de cobro con Kushki.Kushki.js Hosted Fields
Importa Kushki.js Hosted Fields en tu aplicación
Opción 1 - CDN
<script> dentro de la etiqueta <body>. Una vez importada, podrás acceder a los recursos descritos más adelante para crear un flujo de pago con Kushki.kushki.min.js (la cuál trae el código necesario para almacenar las credenciales de tu comercio) como la biblioteca card.min.js (módulo el cuál trae las funcionalidades necesarias para el flujo de pagos con tarjeta).Opción 2 - NPM
Opción 3 - YARN
Crea una instancia de KushkiOptions
KushkiOptions la cuál te permite declarar la clave pública del comercio así como poder seleccionar el ambiente (prueba o producción) mediante el método init().Inicializa el formulario en el front-end
Paso 1. Definir los contenedores para los campos de lado del servidor.
initCardToken(), es requerido colocar los elementos necesarios para poder renderizar cada campo de lado del servidor.Paso 2. Crear una instancia de CardOptions
CardOptions con la información de la transacción, tal como el monto, la moneda, entre otros parámetros.Paso 3. Renderizar campos de lado del servidor con el método initCardToken()
CardOptions, es necesario mandar a llamar a la función initCardToken() para inicializar una instancia de ICard..
Solicita un token para seguir con el flujo de pago
requestToken() en la instancia de card inicializada previamente. Este método realiza las validaciones de 3DS, OTP y Sift Science automáticamente. También, valida que todos los campos sean correctos; de lo contrario, arrojará una excepción.deferred será devuelto junto al token. Para que el usuario pueda seleccionar los meses sin intereses a diferir la compra, se deberá colocar una etiqueta div con el id de deferred_id (<div id="deferred_id"></div>) y se deberá definir dentro de la instancia CardOptions en el objeto fields dicho id. Los campos disponibles dentro de deferred varían dependiendo el país. Consulta la referencia para más información sobre diferidos.2. Configura tu back-end
deferred con los parámetros meses de gracia, meses y tipo de crédito (recibidos al consultar los diferidos para un BIN y seleccionados por el usuario en el formulario), junto con la información del cobro, como en el siguiente ejemplo:JavaScript
Python
PHP
Importante
deferred solo debe enviarse en los casos en que la tarjeta tenga la posibilidad de hacer pagos diferidos, en todos los demás casos el objeto mencionado debe omitirse.Envía notificaciones a tus clientes
3. Prueba tu integración
5451951574925480457444121519033543490030000470154. Prepara tu certificación
productDetails), así como también los datos de contacto de tu cliente-pagador (contactDetails), junto con los datos de facturación ( "orderDetails"."billingDetails") y envío (si tú modelo de negocio lo requiere: "orderDetails"."shippingDetails"), dentro del request para realizar el cargo.email, del objeto contactDetails es requerido.Modificado en 2026-10-21 19:52:35