1. kushki.js-hosted-fields
Español
  • Español
  • English
  • Bienvenida
    • Home Page
  • Perú 🇵🇪
    • Kushki Developer Portal 🚀
    • Perú 🇵🇪
    • Raíz
      • Libraries & SDKs (Online Payments)
        • Release notes
        • Mobile
          • Kushki Android
          • Kushki iOS 
          • Kushki iOS ARM Setup
        • Web
          • Kushki.js 🌐
          • kushki.js-hosted-fields
            • kushki.js Hosted Fields
            • Guía de migración a Kushki.js 2.0
            • Antifraud
              • Interfaces
                • SecureInitRequest
                • SecureInitResponse
                • SiftScienceObject
              • Methods
                • requestInitAntiFraud
                • requestSecureInit
                • requestValidate3DS
            • Card
              • CarApplePay interface
                • ICardApplePay Interface
              • Card-Interface
                • ICard Interface
                • ICardSubscriptions Interface
              • Errors
                • Error list
              • Interfaces
                • Amount
                • ApplePayGetTokenOptions Interface
                • ApplePayOptions Interface
                • ApplePayPaymentContact
                • AppleTokenResponse
                • BrandByMerchantResponse Interface
                • CardFieldValues
                • CardInfo
                • CardOptions
                • CardTokenResponse
                • DeferredByBinOptionsResponse
                • DeferredInputValues
                • DeferredValuesResponse
                • DeviceTokenRequest
                • Field
                • FieldInstance
                • Fields
                • FieldValidity
                • FormValidity
                • MasterCardBrandingRequest
                • SecureDeviceTokenOptions
                • Styles
                • TokenResponse
                • VisaBrandingRequest
              • Methods
                • initApplePayButton
                • initCardToken
                • initSecureDeviceToken
                • requestBrandsByMerchant method
                • requestDeviceToken method
                • requestInitCardBrandingAnimation
              • Types
                • CssProperties
                • Currency
                • FieldTypeEnum
            • Card Payouts
              • Card Payouts Interface
                • ICardPayouts
              • Enumerations
                • Enumeration `InputModelEnum`
              • Errors
                • Errors
              • Interfaces
                • CardPayoutOptions
                • CardPayoutSubscriptionTokenResponse
                • CardPayoutUniqueTokenResponse
                • Field
                • Fields
                • FieldValidity
                • Interface FormValidity
                • Interface `Styles`
              • Methods
                • initCardPayoutToken
              • Type Aliases
                • CardPayoutTokenResponse
                • InputTypeEnum
              • Types
                • CssProperties
            • Kushki
              • Methods
                • init function
                • requestBankList function
                • requestCommissionConfiguration function
              • Classes
                • KushkiError
              • Interfaces
                • CommissionConfigurationRequest
                • IKushki
                • KushkiOptions
    • Schemas
      • API Raw Card Present
        • metadata
        • extra_taxes
        • card
        • sub_merchant
        • pos_details
        • enc_tlv
        • deferred
        • contact_details
        • card_details
        • amount
      • Chargebacks
      • Commissions
      • Gateway Status
      • ChargebackListResponse
      • StatusComponent
      • currency
      • one-and-two-step-payment
      • webhooksChargeback
      • ChargebackItem
      • webhooks
      • networkToken
      • webhooksItem
      • transactionType
      • ErrorResponse400
      • threeDomainSecure
      • ErrorResponse401
      • product
      • ErrorResponse403
      • payment_submethod
      • ErrorResponse500
      • payment_method
      • paymentMethod
      • orderDetails
      • Shipping Address
      • headers
      • extraTaxes
      • documentType
      • currency
      • currency-cash-in
      • currency-CL
      • binInfo
      • UnexpectedErrorResponse
      • citMit
      • SubscriptionUpdate
      • messageFields
      • network
      • SubscriptionAdjustmentRequest
      • Subscription
      • Submerchant
      • Shipping-Address
      • Promotions
      • Metadata
      • Language
      • InvalidBinResponse
      • GetConfigurationRequest
      • ErrorResponse
      • Deferred
      • Country
      • ContactDetails
      • ChargesVoidCardResponse
      • Channel
      • Card
      • Billing-Address
      • BadRequestResponse
      • Amount
      • Amount-cash-in
      • Amount-CL
  • México 🇲🇽
    • Bienvenidos
    • ONLINE PAYMENTS
      • CARD
        • CARD
        • 1. Request a card token
        • 2. Make a charge or deferred charge
        • 3. Void a transaction
        • 4. Refund a transaction
        • 5. Request deferred options
        • 6. Authorize payments
        • 7. Reauthorize payments
        • 8. Capture an authorized payment
        • 9. Bin Info
        • 10. Bin Info V2
        • 11. Validate OTP
        • 12. Verify Account
        • 12. Verify Account
        • 6. Authorize payments
        • 10. Bin Info V2
        • 8. Capture an authorized payment
        • 3. Void a transaction
        • 4. Refund a transaction
        • 7. Reauthorize payments
        • 1. Request a card token
        • 9. Bin Info
        • 5. Request deferred options
        • 2. Make a charge or deferred charge
        • 11. Validate OTP
      • CASH IN
        • 1. Request a cash in token
        • 2. Init Transaction
        • 3. Transaction Status
        • 1. Request a cash in token
        • 2. Init Transaction
        • 3. Transaction Status
      • TRANSFER IN
        • 1. Request a Transfer In token
        • 2. Init Transaction
        • 4. Get Status Copy
        • 1. Request a Transfer In token
        • 4. Get Status Copy
        • 2. Init Transaction
      • TRANSFER OUT
        • 1. Get Bank List
        • 2. Request a Transfer Out token
        • 3. Init Transaction
        • 4. Get Status
        • 5. Wallet Balance
        • 5. Wallet Balance
        • 1. Get Bank List
        • 4. Get Status
        • 2. Request a Transfer Out token
        • 3. Init Transaction
      • ONE-CLICK & SCHEDULED PAYMENTS
        • 1. Request a recurring charge token
        • 2. Create a recurring charge
        • 3. Update recurring charge card data
        • 4. Make an One-click payment
        • 5. Cancel a recurring charge
        • 6. Update a recurring charge
        • 7. Add a temporary charge or discount
        • 8. Authorize payments Copy
        • 9. Capture an authorized payment Copy
        • 10. Get recurring charge Info
        • 1. Request a recurring charge token
        • 8. Authorize payments Copy
        • 3. Update recurring charge card data
        • 6. Update a recurring charge
        • 10. Get recurring charge Info
        • 2. Create a recurring charge
        • 5. Cancel a recurring charge
        • 9. Capture an authorized payment Copy
        • 4. Make an One-click payment
        • 7. Add a temporary charge or discount
      • PAYMENT BUTTON
        • 1. Create a payment button
        • 1. Create a payment button
      • SMARTLINKS V2
        • 1. Create a Smartlink
        • 2. Get a Smartlink
        • 3. Delete a Smartlink
        • 4. Update a Smartlink
        • 1. Create a Smartlink
        • 4. Update a Smartlink
        • 2. Get a Smartlink
        • 3. Delete a Smartlink
      • PAYMENT CREDENTIALS
        • 1. Create a credential
        • 2. Search credentials
        • 3. Advanced search
        • 4. Activate or deactivate
        • 5. Delete credential
        • 6. Update credential
        • 7. Regenerate a credential
        • 3. Advanced search
        • 6. Update credential
        • 5. Delete credential
        • 2. Search credentials
        • 4. Activate or deactivate
        • 7. Regenerate a credential
        • 1. Create a credential
      • COMMISSIONS
        • 1. Get Commission Configuration
        • 1. Get Commission Configuration
      • GATEWAY STATUS
        • 1. Get gateway status
        • 1. Get gateway status
      • ANALYTICS
        • 1. Get transactions list
        • 1. Get transactions list
    • CARD PRESENT PAYMENTS (BILLPOCKET)
      • Get token
      • States
      • Validate token
      • Municipalities
      • Collect payments
      • Tax companies
      • Capture an authorized payment
      • Commercial activities
      • Refund
      • Create checkout
      • Get status
      • Get checkout details
      • Collect card payments
      • Print Ticket
      • Collect card payments v2
      • Cancel Push Notification
      • Get transaction status
      • Add or update CLABE account
      • Configure payment link
      • Get payment link configuration
      • Create payment link
      • Update payment link
      • List payment links
      • Delete payment link
      • Add CLABE account
      • Get token
      • Get transaction list
      • Get transaction list v2
      • Get transaction list v3
      • Get transaction list v4
      • Create user
    • CARD PRESENT PAYMENTS (API RAW) Copy Copy
      • error-catalog
      • Test data
      • One-time payments
        • Single payment
      • Two-step-payments
        • Authorization and capture
      • Voids & Refunds
        • Void & Reverse
        • Refund a transaction
      • Card information
        • Balance inquiries
        • Get BIN Info
        • BIN info V2
        • Request deferred options
      • Query Transactions
        • Transaction Search
  • Ecuador 🇪🇨
    • Bienvenidos
    • ONLINE PAYMENTS
      • Card
        • Overview
        • Request a card token
        • Make a charge or deferred charge
        • Void a transaction
        • Request deferred options
        • Validate OTP
        • Refund a transaction
        • Bin Info
        • Bin Info V2
      • One Click Charges
        • Overview
        • Request a recurring charge token
        • Create a recurring charge
        • Make an One-click payment
        • Cancel a recurring charge
        • Add a temporary charge or discount
        • Get recurring charge Info
        • Update a recurring charge
        • Update recurring charge card data
      • Transfer in
        • Overview
        • Get Bank List
        • Request a Transfer In token
        • Init Transaction
        • Get Status
      • Cash in
        • Overview
        • Request a cash in token
        • Init Transaction
        • Transaction Status
        • Update a cash in transaction
        • Delete a cash in transaction
      • Chargebacks
        • Overview
        • Query chargebacks
        • Request chargeback export
      • Smartlinks
        • Overview
        • Create a Smartlink
        • Update a Smartlink
        • Get a Smartlink
        • Delete a smartlink
        • Get a Smartlink
        • Delete a Smartlink
        • Update a Smartlink
        • Create a Smartlink
      • Payment Button
        • Overview
        • Create a payment button
      • Payment Credentials
        • Overview
        • Regenerate a credential
        • Activate or deactivate
        • Update credential
        • Search credentials
        • Delete credential
        • Create a credential
        • Advanced search
      • Gateway Status
        • Overview
        • Get gateway status
      • Analytics
        • Overview
        • Get transactions list v2
        • Get transactions list v1
      • Commissions
        • Commissions
        • Get Commission Configuration
  • Colombia 🇨🇴
    • ANALYTICS
      • Get transactions list v1
      • Get transactions list v2
    • CARD-OUTS
      • Request a cash out token
      • Init Transaction
      • Update a cash out transaction
      • Delete a cash out transaction
      • Transaction Status
    • CARD
      • Bin Info
      • Bin Info V2
      • Request deferred options
      • Request a card token
      • Make a charge or deferred charge
      • Create payment (tokenless)
      • Authorize payments
      • Preauthorization (tokenless)
      • Capture an authorized payment
      • Reauthorize payments
      • Refund a transaction
      • Void a transaction
      • Verify Account
      • Validate OTP
    • TRANSFER IN
      • Get Bank List
      • Request a Transfer In token
      • Init Transaction
      • Get Status
    • TRANSFER OUT
      • Get Bank List
      • Get Bank List V2
      • Request a Transfer Out token
      • Init Transaction
      • Get Status
      • Void a transaction
      • Balance for Payouts
    • CASH-IN
      • Request a cash in token
      • Init Transaction
      • Update a cash in transaction
      • Delete a cash in transaction
      • Transaction Status
    • CASH-OUT
      • Request a cash out token
      • Init Transaction
      • Update a cash out transaction
      • Delete a cash out transaction
      • Transaction Status
    • COMMISSIONS
      • Get Commission Configuration
    • GATEWAY-STATUS
      • Get gateway status
      • Get platform status
    • ONE-CLICK & SCHEDULED PAYMENTS
      • Request a recurring charge token
      • Update recurring charge card data
      • Update a recurring charge
      • Add a temporary charge or discount
      • Get recurring charge Info
      • Create a recurring charge
      • Make an One-click payment
      • Cancel a recurring charge
      • Authorize payments
      • Capture an authorized payment
    • PAYMENT-BUTTON
      • Create a payment button
    • PAYMENT-CREDENTIALS
      • Advanced search
      • Delete credential
      • Regenerate a credential
      • Search credentials
      • Activate or deactivate
      • Update credential
      • Create a credential
    • SMARTLINKS-V2
      • Create a Smartlink
      • Get a Smartlink
      • Update a Smartlink
      • Delete a smartlink
    • TRANSFER-IN
      • Get Bank List
      • Request a Transfer In token
      • Init Transaction
      • Get Status
    • TRANSFER-OUT
      • Balance for Payouts
      • Get Bank List
      • Get Bank List V2
      • Request a Transfer Out token
      • Init Transaction
      • Get Status
      • Void a transaction
  • Chile 🇨🇱
    • Bienvenidos
    • CARD PRESENT PAYMENTS (API RAW) Copy
      • One-time payments
      • Two-step-payments
      • Voids & Refunds
      • Card information
      • Query Transactions
    • Online Payments
      • Card Async
        • Request a card async token
        • Authorize payments
        • Get Status
        • Capture an authorized payment
        • Init Transaction
      • Async Card Recurring Charges
        • Request an async card recurring charge token
        • Init an async card recurring charge
        • Capture an authorized payment
        • Authorize payments
        • Capture an authorized payment
        • Authorize payments
      • Card
        • Bin Info
        • Bin Info V2
        • Request deferred options
        • Request a card token
        • Make a charge or deferred charge
        • Create payment (tokenless)
        • Authorize payments
        • Capture an authorized payment
        • Reauthorize payments
        • Void a transaction
        • Refund a transaction
        • Voucher
        • Validate OTP
        • Verify Account
      • Chargebacks
        • Query chargebacks
        • Request chargeback export
      • Transfer In
      • Transfer Out
      • Cash In
      • Smartlinks V2
      • Analytics
        • Get transactions list v1
        • Get transactions list v2
      • Gateway Status
        • Get gateway status
      • Commissions
      • Payment Credentials
      • Payment Button
      • Platform Status
      • Subscription Transactions
      • Preauthorization (tokenless)
  1. kushki.js-hosted-fields

Guía de migración a Kushki.js 2.0

A continuación, los pasos y servicios que están disponibles en kushki.js para realizar la migración desde la versión 1.0 a la versión 2.0.
Para información más detallada visita documentación de Kushki.js 1.0 y Kushki.js 2.0.

Servicios disponibles para migrar#

Estos son los servicios actualmente disponibles en la versión 2.0 de la biblioteca Kushki.js. Más servicios se irán agregando con el tiempo.
NOTA: Antes de realizar una migración de la versión de la biblioteca asegúrate que los servicios integrados estén disponibles para mantener las funcionalidades implementadas.
SERVICIODISPONIBLE EN 2.0COMENTARIOS
Token pago único✅
Validación OTP pago único✅
Validación 3DS pago único✅
Validación Sift Science pago único?
Diferidos pago único✅
Bin info pago único❌
Cargos recurrentes❌Aún no disponible cargos recurrentes en la versión 2.0
Pagos ONE-CLICK❌No disponible método para esta operación
Web Pay (Chile)❌No disponible método para esta operación
Pagos con transferencia❌Aún no disponible pagos por transferencia
Pagos en efectivo❌Aún no disponible pagos en efectivo
Dispersiones en efectivo❌Aún no disponible dispersiones en efectivo
Gateway Status❌No disponible método para esta operación
Commissions❌No disponible método para esta operación
Validación de 3DS por API❌No disponible método para obtener el JWT
Cargos recurrentes por API❌No disponible método para obtener el JWT

Migración token pago único#

Para migrar tu integración de la versión 1.0 a la 2.0 de Kushki.js, sigue los siguientes pasos para obtener el token para pago único

Paso 1. Actualizar la fuente de importación de la biblioteca#

Actualiza la fuente desde donde importas la biblioteca de Kushki.js a tu aplicación.
NOTA: No empaques o alojes tú mismo la biblioteca.
Si realizas la importación desde CDN, actualiza el script de importación de
Por
Si realizas la importación desde NPM, instala la versión 2.0 con el siguiente comando:
Luego, actualiza la importación en tu aplicación de las funcionalidades de
Por

Paso 2. Inicialización de la biblioteca#

En la versión 2.0 cambia el objeto donde se inicializa la configuración del comercio así como sus atributos. A continuación los detalles entre versiones

KUSHKI.JS 1.0KUSHKI.JS 2.0COMENTARIOS
KushkiKushkiOptionsEl nombre del objeto a instanciar para la inicialización con la información del comercio ha cambiado de Kushki a KushkiOptions
merchantIdpublicCredentialIdEl nombre de la propiedad para colocar la llave pública del comercio ha cambiado de merchantId a publicCredentialId
inTestEnvironmentinTestEl nombre de la propiedad para especificar el ambiente de trabajo ha cambiado deinTestEnvironment a inTest
regionalNo disponibleLa propiedad regional ya no está disponible en Kushki.js 2.0

En tu aplicación, crea una instancia del objeto KushkiOptions la cuál reemplazará la instancia Kushki anterior.

Kushki.js 1.0#


Kushki.js 2.0#


Paso 3. Actualiza el formulario de pago#

Debido a que Kushki.js 2.0 implementa campos de lado del servidor, es necesario realizar las siguientes modificaciones en el formulario de pago.
Reemplazar los campos del formulario de tu aplicación por los siguientes
Revisa todos los campos disponibles aquí.
NOTA: Si utilizas estilos personalizados en tu formulario de pagos actual, revisa cómo darle estilos a los campos de lado del servidor.

Paso 4. Solicitud de token#

Para realizar la solicitud del token en Kushki.js 2.0, es necesario crear un objeto de CardOptions en donde se guardará la información de pago así como los datos de la transacción (monto, moneda, etc) en lugar de colocar estos datos directamente en el método requestToken() como en la versión 1.0. Después, es necesario crear una instancia de la tarjeta con el método initCardToken.
NOTA: Si utilizas diferidos en Chile…

Kushki.js 1.0#

Se manda a llamar el método requestToken() de la instancia Kushki creada anteriormente con la información de la tarjeta y los datos de la transacción (monto, moneda, etc).

Kushki.js 2.0#


Después, se manda a llamar el método requestToken() que está disponible en la instancia de tarjeta creada anteriormente.

Respuesta#

La información devuelta en la respuesta en Kushki.js 2.0 ha cambiado. A continuación. podrás ver la información devuelta entre versiones:
KUSHKI.JS 1.0KUSHKI.JS 2.0COMENTARIOS
tokentokenToken con información de la transacción
secureIdNo disponibleLas validaciones OTP y 3DS ahora se hacen internamente en el método requestToken()
secureServiceNo disponibleLas validaciones OTP y 3DS ahora se hacen internamente en el método requestToken()
securityNo disponibleLas validaciones OTP y 3DS ahora se hacen internamente en el método requestToken()
No disponibledeferredObjeto con información de diferidos devuelto en Kushki.js 2.0 (Si están disponibles para el comercio)

Paso 5. Certificación#

Una vez realizados los cambios en tu aplicación para migrar a Kushki.js 2.0, es necesario realizar una certificación para validar que todo funcione correctamente.
Sigue los siguientes pasos

Validación OTP pago único#

En Kushki.js 2.0 ya no es necesario que se realice la validación de OTP enviando información obtenida en el token. Ahora, esta validación se hace de manera automática al llamar al método requestToken() el cuál renderizará el modal para que el cliente ingrese el OTP. Puedes saber el estado de la validación de OTP con el método onOTPValidation(). Si tienes la validación OTP activada, sigue los siguientes pasos para realizar la migración hacía Kushki.js 2.0.
NOTA: La implementación anterior que se encontraba en Kushki.js 1.0 del método requestSecureServiceValidation() ya no es necesaria en la versión 2.0, por lo cuál ahora solo debes consultar el estado de la validación.
Para implementar OTP en Kushki.js sigue estos pasos:

Paso 1. Agrega el campo de lado del servidor para OTP#

Añade un <div> con el id id_otp en el formulario de pago para que el campo de OTP sea renderizado si es requerido.

Paso 2. Identifica el estatus de OTP#

Para validar el estatus de OTP de la transacción y ver si este es requerido, puedes llamar al método onOTPValidation() el cuál regresará tres callbacks (onSuccess, onError, onRequired) indicando si el campo OTP es requerido, si se completó con éxito o si hubo algún error. Si se regresa el callback onRequired, entonces será necesario desplegar el campo para ingresar el OTP en el formulario de pago al momento de llamar al método requestToken() para solicitar un token.

Paso 3. Enlazar el div de OTP en la instancia de CardOptions#

Si al momento de validar el status del OTP regresa un callback onRequired, será necesario enlazar el <div> del OTP al momento de crear una instancia de CardOptions. Para ello, en el objeto fields añade la propiedad otp como se muestra a continuación
A continuación, solicita un token.

Paso 4. Certificación#

Una vez realizados los cambios en tu aplicación para migrar a Kushki.js 2.0, es necesario realizar una certificación para validar que todo funcione correctamente.
Sigue los siguientes pasos

Validación 3DS pago único#

Paso 1. Solicitud de token#

En Kushki.js 2.0 la validación 3DS se hace automáticamente al momento de llamar el método requestToken() el cuál desplegará el modal 3DS y realizará las validaciones necesarias devolviendo una respuesta exitosa en caso de ingresar un código válido o un mensaje de error si hubo algún problema durante la validación, por lo cual no es necesario realizar alguna otra acción adicional.
NOTA: En Kushki.js 2.0 ya no se regresará información adicional sobre 3DS al momento de generar el token como se hacía en la versión 1.0 de Kushki.js (secureId, secureService, security)

Diferidos pago único#

Paso 1. Solicitud de token#

En Kushki.js 2.0 al momento de llamar al método requestToken() este regresará junto al token la información de diferidos disponibles al comercio (si aplica) como se muestra a continuación, por lo cual no es necesario realizar alguna otra acción adicional

NOTA: En Kushki.js 1.0 está disponible el método requestDeferred() el cuál ya no es necesario en la versión 2.0.
Modified at 2026-03-13 14:08:17
Previous
kushki.js Hosted Fields
Next
SecureInitRequest
Built with