Skip to main content

Pasarela de pagos (JavaScript)

Introducción

La librería Luka JS proporciona un objeto llamado luka que tiene tres métodos públicos:

  • init()
  • updateMonto()
  • updateEmail()

La autenticación se realiza a través del token que retorna el método de login con las credenciales proporcionadas por Lukapay.

La librería está integrada con múltiples métodos de pagos especificadas aquí.

init

Función que inicializa y renderiza el componente en el nodo HTML especificado en el parámetro de entrada.

Parámetros de entrada

NombreDescripciónTipoObligatorio
tokenToken de validación y autenticaciónString
containerId del nodo HTML en donde se van a mostrar los métodos de pagoString
montoObjObjeto que representa el monto que con se quiere hacer la operaciónObject
emailDirección de correo electrónico del usuario que está realizando el pago. Se puede inicializar con nullStringNo
idTrazaIdentificador único que proporciona el comercio para identificar la transacción en los sistemas de LukapayStringNo
configObjeto que le indica a la librería cómo va a mostrar el componenteObject
callbackFunción que la librería llama cuando se termina de procesar la transacción; debe recibir dos parámetrosFunction
preValidationCallFunción opcional que proporciona el comercio. Tiene que retornar true o falseFunctionNo
postLoadCallbackFunción opcional que se ejecuta cuando se termina de cargar el componente en la página WebFunctionNo
extraObjObjeto que permite agregar información adicional a la libreríaObjectNo

Propiedades de objetos

montoObj
NombreDescripciónTipoObligatorio
montoMonto que se quiere procesar en la transacciónNumber
numeroDecimalesNúmero de decimales con que se quiere que se muestre el montoNumberNo
separadorMilesIndica el separador de miles que se va a usar. Por default, se usará el punto (.)StringNo
separadorDecimalIndica el símbolo que se va a utilizar para separar la parte entera de la parte decimal. Por default, se usará la coma (,)StringNo
config
NombreDescripciónTipoObligatorio
monedaMoneda en que se va a realizar la transacciónStringNo
idiomaIdioma en que se va a mostrar la libreríaStringNo
metodosMétodos de pago a cargar en el componente. Es una cadena de texto separados por coma. Ej.: "tdc, paypal" Ver claves de métodos de pagoStringNo
terminosObjeto que representa la forma como se van a mostrar los términos y condicionesObjectNo
colorColor en hexadecimal con que se va a mostrar el componenteStringNo
seleccionIndicador si se va a mostrar los métodos de pagos como radio buttons o pestañas. Valores posibles: 1: Radio button, 2: PestañasNumberNo
paypalObjeto de configuración del botón de PaypalObjectNo
fuenteNombre de la fuente en la cual se va a cargar el componente (si es un webfont debe estar previamente cargado)StringNo
showSkeletonLoadingIndicador si se debe mostrar una animación antes de cargar los campos del formulario de pago. Valores posibles: true o false. Default: falseBooleanNo
fnValidacionEsAsyncIndicador si la función opcional de validación proporcionada por el comercio es asíncrona o síncrona: Valores posibles: true o false. Default: falseBooleanNo
guardarEnBovedaPropiedad que indica si se debe guardar la información de la tarjeta de crédito/débito en la bóveda de usuarios. Se aplica solo para tarjetas de crédito/débitoBooleanNo
horizontalPropiedad que indica si se debe mostrar las opciones de pago en horizontal. Valores posibles: true o false. Default: trueBooleanNo
estilosObjeto con estilos adicionalesObjectNo
terminos
NombreDescripciónTipoObligatorio
tipoIndicador del tipo de términos y condiciones que se va a mostrar. Puede tener los valores: "1": simple, "2": con checkboxStringNo
comportamientoPuede ser un string o una función. String: se asume que es un enlace y se abre un popup cuando se hace clic. Función: se ejecuta cuando se hace clic.String / FunctionNo
paypal
NombreDescripciónTipoObligatorio
colorIndicador del color que se va a mostrar en el botón de Paypal. Valores posibles: blue, gold, black, white, silver. Default: blackStringNo
ocultarMontoOcultar monto en el botón de PaypalBooleanNo
extraObj
NombreDescripciónTipoObligatorio
nombrePagadorNombre de la persona que está realizando el pagoStringNo
referenciaPagoIdentificador del pago de cara al cliente (Ejemplo: número de factura, identificación del contrato)StringNo
mostrarPoweredByMostrar “Powered by”BooleanNo
montoOriginalObjeto con información del monto original. Se utiliza cuando se debe aplicar una conversión de monedaObjectNo
lukapayIdIdentificación de registro del usuario en la bóveda de tarjetas. Se devuelve cuando se especifica true en guardarEnBovedaStringNo
mostrarCargosAdicionalesMostrar cargos adicionalesBooleanNo
cuotasConfigObjeto de configuración de cuotasObjectNo
montoOriginal
NombreDescripciónTipoObligatorio
MontoIndica el monto de la transacción antes del cambio de monedaNumber
MonedaIndica el código de la moneda de la transacción antes del cambio de monedaString
TasaConversionIndica la tasa de cambio utilizada durante la conversión de monedaNumber
cuotasConfig
NombreDescripciónTipoObligatorio
idConfigIdentificador único de la configuración de cuotasNumber

Parámetros de salida

La librería devuelve el objeto de la respuesta a través de la función que se indica en la propiedad callback proporcionada en el método init.

NombreDescripciónTipo
CanalIndica el canal que se está utilizando para aplicar el pago en LukapayNumber
CargosAdicionalesObjeto que contiene cargos adicionales.Object
CuotasObjeto que contiene información sobre cuotas.Object
DescripciónContiene la respuesta de la aplicación del pago, como estatus de la transacción y cualquier información adicionalString
ExitosoIndica si la transacción fue exitosa o no. Se utiliza para validar la respuestaBoolean
FechaOperacionFecha que ocurrió la transacciónString
InfoProcesoObjeto que contiene información más detallada del estatus de la transacciónObject
InfoTarjetaObjeto que contiene información de la tarjeta de crédito utilizada para realizar el pago. Solo aplica para pagos con tarjetaObject
InfoUsuarioPagadorObjeto que devuelve información básica del usuario que realiza el pagoObject
MedioDePagoIndica el método de pago que se utilizóString
MerchantIdReferencia de la transacción del merchant utilizado para aplicar el pagoString
MonedaCódigo de la moneda utilizada para realizar el pagoString
MontoIndica el monto del pago realizadoNumber
MontoOriginalObjeto con información del monto original. Se utiliza cuando se debe aplicar una conversión de monedaObject
MontoUsdValor del monto en dólar estadounidense. Se utiliza cuando se especifica el MontoOriginalNumber
TarjetaHabienteObjeto que contiene información del pagador (en caso de haber sido especificado)Object
TransaccionIdReferencia de la transacción en LukapayNumber
TransaccionMerchantIdReferencia de la transacción del merchant utilizado para aplicar el pagoNumber
TrazaIdIdentificador interno del comercio. En caso de que el comercio no lo proporcione se genera un código aleatorioString

Propiedades de objetos

CargosAdicionales
NombreDescripciónTipo
ComisionComisión del método de pago seleccionadoNumber
OtrosCargosOtros cargos y comisiones que se agregan a la transacciónArray
TotalCargosSuma total de la comisión y otros cargosNumber
MonedaCargosMoneda en la que se expresan la comisión y cargosString
Cuotas
NombreDescripciónTipo
CuotasArray de objetos que contienen detalles de cada cuota.Array
ContratoCódigo asociado con las cuotas de pagoString
MontoMonto total de las cuotas de pagoString
MonedaCódigo de la moneda utilizada para realizar el pagoString
UrlLinkUrl del link del pago de cuotasString
Propiedades del objeto contenido en el array Cuotas del objeto Cuotas
NombreDescripciónTipo
NumCuotaNúmero de la cuota de pagoNumber
MontoMonto de la cuota de pagoString
FechaCorteFecha límite para el pago de la cuotaString
FechaExpiracionFecha que expira el pago de la cuotaString
InfoProceso
NombreDescripciónTipo
EstatusProcesamientoEstatus del procesamientoString
CodigoRespuestaCvvCódigo de respuesta CVVString
InfoTarjeta
NombreDescripciónTipo
BinEl número de identificación bancaria (BIN). Estos son los primeros 4 a 6 dígitos del número de la tarjeta de crédito.String
CategoriaTarjetaIndica si la tarjeta es de tipo comercial o personalString
FechaVencimientoFecha de expiración de la tarjeta de crédito con formato MM/YYYYString
PaisCódigo ISO del país de emisión de la tarjeta de créditoString
SubTipoTarjetaIndica si la tarjeta es de crédito o débitoString
TipoTarjetaIndica el tipo de la tarjeta de crédito. Ejemplo: VISA, MASTERString
UltimosCuatroDigitosValor que indica los 4 últimos dígitos de la tarjeta.String
InfoUsuarioPagador
NombreDescripciónTipo
ApellidoApellido del usuario que realiza la operaciónString
NombreNombre del usuario que realiza la operaciónString
EmailCorreo electrónico del usuarioString
NumeroIdentidadCédula o número de identidad del usuarioString
NumeroTelefonoNúmero de teléfono del usuarioString
TarjetaHabiente
NombreDescripciónTipo
ApellidoApellido del usuario que realiza la operaciónString
NombreNombre del usuario que realiza la operaciónString
NúmeroIdentificacionPersonalCédula o número de identidad del usuarioString
NumeroTelefonoNúmero de teléfono del usuarioString
LukapayIdIdentificación de registro del usuario en la bóveda de tarjetas. ste valor se devuelve sólo cuando se especifica el valor TRUE en la propiedad guardarEnBoveda en el método Init. El comercio debe guardar este valor en su propia base de datos de clientes.String

Ejemplo de uso

luka.init("eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJzdWIiOiIxMjM0NTY3ODkwIiwibmFtZSI6IkpvaG4gRG9lIiwiaWF0IjoxNTE2MjM5MDIyfQ.SflKxwRJSMeKKF2QT4fwpMeJf36POk6yJV_ adQssw5c",
'container',
{
"monto": 16.03,
"numeroDecimales": null,
"separadorMiles": "",
"separadorDecimal": ""
},
"demo@example.com",
"xxxxxxxxxxxxxx",
{
formBorde: false,
moneda: "USD",
terminos: {
"tipo": "1"
},
idioma: "esp",
color: "c41616",
metodos: "zelle,paypal",
paypal: {
color: "gold"
},
fuente: "Montserrat",
seleccion: 2,
showSkeletonLoading: true,
fnValidacionEsAsync: true,
guardarEnBoveda: false,
horizontal: false,
estilos: {
"color": "#0516b1"
}
},
function (result, error) {
if (error) {
//código para manejar el error
} else {
if (result.Exitoso) {
//código para transacción exitosa
} else {
//código para transacción fallida
}
}
},
function () {
//código de validación interna
return true;
},
function () {
//código con componente cargado
},
{
"nombrePagador": "John Doe",
"referenciaPago": "151515",
"lukapayId": "548791",
"cuotasConfig": {
"idConfig": "4"
}
}
);

updateMonto

Permite actualizar el monto a pagar en el componente. Esta función puede ser utilizada cuando se desea cambiar el monto de la transacción después de que el componente ha sido inicializado.

Parámetros de entrada

NombreDescripciónTipoObligatorio
montoMonto al cual se quiere actualizar en la transacciónNumber
tokenToken de validación y autenticaciónString

Parámetros de salida

La función devuelve true o false para indicar si se actualizó o no el monto.

Ejemplo de uso

luka.updateMonto(28.14, 
"eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJzdWIiOiIxMjM0NTY3ODkwIiwibmFtZSI6IkpvaG4gRG9lIiwiaWF0IjoxNTE2MjM5MDIyfQ.SflKxwRJSMeKKF2QT4fwpMeJf36POk6yJV_ adQssw5c"
);

updateEmail

Permite actualizar el monto a pagar en el componente. Esta función puede ser utilizada cuando se desea cambiar el monto de la transacción después de que el componente ha sido inicializado.

Parámetros de entrada

NombreDescripciónTipoObligatorio
emailEmail al cual se quiere actualizar en la transacciónNumber
tokenToken de validación y autenticaciónString

Parámetros de salida

La función devuelve true o false para indicar si se actualizó o no el monto.

Ejemplo de uso

luka.updateEmail("demo@payco.net.ve", 
"eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJzdWIiOiIxMjM0NTY3ODkwIiwibmFtZSI6IkpvaG4gRG9lIiwiaWF0IjoxNTE2MjM5MDIyfQ.SflKxwRJSMeKKF2QT4fwpMeJf36POk6yJV_ adQssw5c"
);

Webhooks para pagos diferidos

Nuestra plataforma valida en línea la referencia de pago registrada por el usuario. Si no se encuentra automáticamente, la transacción se marca como "Pendiente por revisión" y se reintenta hasta 5 veces cada 2 minutos. Si aún no se encuentra, se revisa manualmente. En estos casos, el usuario es notificado por correo. En la integración, el campo Exitoso será true, pero se debe verificar InfoProceso.EstatusProcesamiento para conocer el estatus real del pago: success (exitoso) o pending (pendiente). El estatus final se envía a través de un webhook.

Ver más sobre webhooks.

Demo

El demo de la implementación de la librería está disponible en:

https://qa.lukapay.io/demo.luka.v2