Inicio Rápido
Esta guía de inicio rápido muestra cómo usar los SDK principales de Izipay para agregar un formulario de pago a sus aplicaciones basadas en JavaScript.
Objetivo
Aprenderá a:
- Instalar el SDK Izipay
- Inicializar el formulario de pago.
- Mostrar el Checkout.
Paso 1: Instalar SDK
- Desarrollo
- Producción
HEAD
de su archivo HTML
.<script src="https://sandbox-checkout.izipay.pe/payments/v1/js/index.js"></script>
HEAD
de su archivo HTML
.<script src="https://checkout.izipay.pe/payments/v1/js/index.js"></script>
Paso 2: Inicializar el SDK
1. Configura los parámetros de entrada.
const iziConfig = {
config: {
transactionId: '{TRANSACTION_ID}',
action: 'pay',
merchantCode: '{MERCHANT_CODE}',
order: {
orderNumber: '{ORDER_NUMBER}',
currency: 'PEN',
amount: '1.50',
processType: 'AT',
merchantBuyerId: '{MERCHANT_CODE}',
dateTimeTransaction: '1670258741603000',
},
billing: {
firstName: 'Juan',
lastName: 'Wick Quispe',
email: 'jwickq@izi.com',
phoneNumber: '958745896',
street: 'Av. Jorge Chávez 275',
city: 'Lima',
state: 'Lima',
country: 'PE',
postalCode: '15038',
documentType: 'DNI',
document: '21458796',
}
},
};
2. Instancia la clase.
try {
const checkout = new Izipay({ config: iziConfig });
} catch ({Errors, message, date}) {
console.log({Errors, message, date});
}
Paso 3: Mostrar el Checkout.
Luego de crear la instancia, con los datos enviados correctamente en la configuración, podrás visualizar el formulario llamando al método LoadForm
el cual recibe los siguientes parámetros.
Parámetros | Descripción | Requerido |
---|---|---|
authorization | Valor usado para autenticar al sistema que desee consumir un servicio de PuntoWeb. Puede ser generado al consumir el servicio de generación de Token de sesión | SI |
Llave publica RSA | SI | |
callbackResponse | Valor usado para recibir las respuestas de la transacción. | NO |
Otra manera de leer la respuesta de la transacción es accediendo a la Clase global Izipay de la siguiente manera: Izipay.prototype.Response
const callbackResponsePayment = (response) => console.log(response);
try {
checkout &&
checkout.LoadForm({
authorization: 'TU_TOKEN_SESSION',
keyRSA: 'KEY_RSA',
callbackResponse: callbackResponsePayment,
});
} catch ({Errors, message, date}) {
console.log({Errors, message, date});
}
Importante
La Api de Token de sesión debe ser invocada desde tu Backend.
En el ejemplo proporcionado en el paso 1, se mostrará un Formulario de pago con valores por defecto. conoce todos los parámetros de configuración aquí.
Puedes apoyarte de los eventos de nuestro checkout para un flujo más personalizado.
Puedes visualizar los errores en el apartado del catch.
Descarga un ejemplo aquí