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.

init

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

Parámetros de entrada

Nombre	Descripción	Tipo	Obligatorio
token	Token de validación y autenticación	String	Sí
container	Id del nodo HTML en donde se van a mostrar los métodos de pago	String	Sí
montoObj	Objeto que representa el monto que con se quiere hacer la operación	Object	Sí
email	Dirección de correo electrónico del usuario que está realizando el pago. Se puede inicializar con null	String	No
idTraza	Identificador único que proporciona el comercio para identificar la transacción en los sistemas de Lukapay	String	No
config	Objeto que le indica a la librería cómo va a mostrar el componente	Object	Sí
callback	Función que la librería llama cuando se termina de procesar la transacción; debe recibir dos parámetros	Function	Sí
preValidationCall	Función opcional que proporciona el comercio. Tiene que retornar true o false	Function	No
postLoadCallback	Función opcional que se ejecuta cuando se termina de cargar el componente en la página Web	Function	No
extraObj	Objeto que permite agregar información adicional a la librería	Object	No

Propiedades de objetos

montoObj

Nombre	Descripción	Tipo	Obligatorio
monto	Monto que se quiere procesar en la transacción	Number	Sí
numeroDecimales	Número de decimales con que se quiere que se muestre el monto	Number	No
separadorMiles	Indica el separador de miles que se va a usar. Por default, se usará el punto (.)	String	No
separadorDecimal	Indica el símbolo que se va a utilizar para separar la parte entera de la parte decimal. Por default, se usará la coma (,)	String	No

config

Nombre	Descripción	Tipo	Obligatorio
moneda	Moneda en que se va a realizar la transacción	String	No
idioma	Idioma en que se va a mostrar la librería	String	No
metodos	Métodos de pago a cargar en el componente. Es una cadena de texto separados por coma. Ej.: "tdc, paypal".	String	No
terminos	Objeto que representa la forma como se van a mostrar los términos y condiciones	Object	No
color	Color en hexadecimal con que se va a mostrar el componente	String	No
seleccion	Indicador si se va a mostrar los métodos de pagos como radio buttons o pestañas. Valores posibles: 1: Radio button, 2: Pestañas	Number	No
paypal	Objeto de configuración del botón de Paypal	Object	No
fuente	Nombre de la fuente en la cual se va a cargar el componente (si es un webfont debe estar previamente cargado)	String	No
showSkeletonLoading	Indicador si se debe mostrar una animación antes de cargar los campos del formulario de pago. Valores posibles: true o false. Default: false	Boolean	No
fnValidacionEsAsync	Indicador si la función opcional de validación proporcionada por el comercio es asíncrona o síncrona: Valores posibles: true o false. Default: false	Boolean	No
guardarEnBoveda	Propiedad 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ébito	Boolean	No
horizontal	Propiedad que indica si se debe mostrar las opciones de pago en horizontal. Valores posibles: true o false. Default: true	Boolean	No
estilos	Objeto con estilos adicionales	Object	No

terminos

Nombre	Descripción	Tipo	Obligatorio
tipo	Indicador del tipo de términos y condiciones que se va a mostrar. Puede tener los valores: "1": simple, "2": con checkbox	String	No
comportamiento	Puede 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 / Function	No

paypal

Nombre	Descripción	Tipo	Obligatorio
color	Indicador del color que se va a mostrar en el botón de Paypal. Valores posibles: blue, gold, black, white, silver. Default: black	String	No
ocultarMonto	Ocultar monto en el botón de Paypal	Boolean	No

extraObj

Nombre	Descripción	Tipo	Obligatorio
nombrePagador	Nombre de la persona que está realizando el pago	String	No
referenciaPago	Identificador del pago de cara al cliente (Ejemplo: número de factura, identificación del contrato)	String	No
mostrarPoweredBy	Mostrar “Powered by”	Boolean	No
montoOriginal	Objeto con información del monto original. Se utiliza cuando se debe aplicar una conversión de moneda	Object	No
lukapayId	Identificación de registro del usuario en la bóveda de tarjetas. Se devuelve cuando se especifica true en guardarEnBoveda	String	No
mostrarCargosAdicionales	Mostrar cargos adicionales	Boolean	No
cuotasConfig	Objeto de configuración de cuotas	Object	No

montoOriginal

Nombre	Descripción	Tipo	Obligatorio
Monto	Indica el monto de la transacción antes del cambio de moneda	Number	Sí
Moneda	Indica el código de la moneda de la transacción antes del cambio de moneda	String	Sí
TasaConversion	Indica la tasa de cambio utilizada durante la conversión de moneda	Number	Sí

cuotasConfig

Nombre	Descripción	Tipo	Obligatorio
idConfig	Identificador único de la configuración de cuotas	Number	Sí

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.

Nombre	Descripción	Tipo
Canal	Indica el canal que se está utilizando para aplicar el pago en Lukapay	Number
CargosAdicionales	Objeto que contiene cargos adicionales.	Object
Cuotas	Objeto que contiene información sobre cuotas.	Object
Descripción	Contiene la respuesta de la aplicación del pago, como estatus de la transacción y cualquier información adicional	String
Exitoso	Indica si la transacción fue exitosa o no. Se utiliza para validar la respuesta	Boolean
FechaOperacion	Fecha que ocurrió la transacción	String
InfoProceso	Objeto que contiene información más detallada del estatus de la transacción	Object
InfoTarjeta	Objeto que contiene información de la tarjeta de crédito utilizada para realizar el pago. Solo aplica para pagos con tarjeta	Object
InfoUsuarioPagador	Objeto que devuelve información básica del usuario que realiza el pago	Object
MedioDePago	Indica el método de pago que se utilizó	String
MerchantId	Referencia de la transacción del merchant utilizado para aplicar el pago	String
Moneda	Código de la moneda utilizada para realizar el pago	String
Monto	Indica el monto del pago realizado	Number
MontoOriginal	Objeto con información del monto original. Se utiliza cuando se debe aplicar una conversión de moneda	Object
MontoUsd	Valor del monto en dólar estadounidense. Se utiliza cuando se especifica el MontoOriginal	Number
TarjetaHabiente	Objeto que contiene información del pagador (en caso de haber sido especificado)	Object
TransaccionId	Referencia de la transacción en Lukapay	Number
TransaccionMerchantId	Referencia de la transacción del merchant utilizado para aplicar el pago	Number
TrazaId	Identificador interno del comercio. En caso de que el comercio no lo proporcione se genera un código aleatorio	String

Propiedades de objetos

CargosAdicionales

Nombre	Descripción	Tipo
Comision	Comisión del método de pago seleccionado	Number
OtrosCargos	Otros cargos y comisiones que se agregan a la transacción	Array
TotalCargos	Suma total de la comisión y otros cargos	Number
MonedaCargos	Moneda en la que se expresan la comisión y cargos	String

Cuotas

Nombre	Descripción	Tipo
Cuotas	Array de objetos que contienen detalles de cada cuota.	Array
Contrato	Código asociado con las cuotas de pago	String
Monto	Monto total de las cuotas de pago	String
Moneda	Código de la moneda utilizada para realizar el pago	String
UrlLink	Url del link del pago de cuotas	String

Propiedades del objeto contenido en el array Cuotas del objeto Cuotas

Nombre	Descripción	Tipo
NumCuota	Número de la cuota de pago	Number
Monto	Monto de la cuota de pago	String
FechaCorte	Fecha límite para el pago de la cuota	String
FechaExpiracion	Fecha que expira el pago de la cuota	String

InfoProceso

Nombre	Descripción	Tipo
EstatusProcesamiento	Estatus del procesamiento	String
CodigoRespuestaCvv	Código de respuesta CVV	String

InfoTarjeta

Nombre	Descripción	Tipo
Bin	El 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
CategoriaTarjeta	Indica si la tarjeta es de tipo comercial o personal	String
FechaVencimiento	Fecha de expiración de la tarjeta de crédito con formato MM/YYYY	String
Pais	Código ISO del país de emisión de la tarjeta de crédito	String
SubTipoTarjeta	Indica si la tarjeta es de crédito o débito	String
TipoTarjeta	Indica el tipo de la tarjeta de crédito. Ejemplo: VISA, MASTER	String
UltimosCuatroDigitos	Valor que indica los 4 últimos dígitos de la tarjeta.	String

InfoUsuarioPagador

Nombre	Descripción	Tipo
Apellido	Apellido del usuario que realiza la operación	String
Nombre	Nombre del usuario que realiza la operación	String
Email	Correo electrónico del usuario	String
NumeroIdentidad	Cédula o número de identidad del usuario	String
NumeroTelefono	Número de teléfono del usuario	String

TarjetaHabiente

Nombre	Descripción	Tipo
Apellido	Apellido del usuario que realiza la operación	String
Nombre	Nombre del usuario que realiza la operación	String
NúmeroIdentificacionPersonal	Cédula o número de identidad del usuario	String
NumeroTelefono	Número de teléfono del usuario	String
LukapayId	Identificació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

Nombre	Descripción	Tipo	Obligatorio
monto	Monto al cual se quiere actualizar en la transacción	Number	Sí
token	Token de validación y autenticación	String	Sí

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

Nombre	Descripción	Tipo	Obligatorio
email	Email al cual se quiere actualizar en la transacción	Number	Sí
token	Token de validación y autenticación	String	Sí

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