Saltar al contenido principal

Pago

Esta casuística permite a los usuarios realizar un pago utilizando los datos de su tarjeta de crédito o débito. El usuario proporciona la información de la tarjeta, como el número, la fecha de vencimiento y el código de seguridad, para completar la transacción y procesar el pago.

Objetivo​

Aprenderás a:

  • Crear el objeto de configuración
  • Inicializar el formulario de pago.
  • Mostrar el Checkout.
  • Ejemplo de respuesta.

1. Creando el objeto de configuración​

A continuación se muestra un ejemplo de configuración para el caso de uso de pago.

const iziConfig = {
  config: {
    transactionId: '{TRANSACTION_ID}',
    action: 'pay',
    merchantCode: '{MERCHANT_CODE}',
    order: {
      orderNumber: '{ORDER_NUMBER}',
      currency: 'PEN',
      amount: '149.00',
      processType: 'AT',
      merchantBuyerId: '{MERCHANT_CODE}',
      dateTimeTransaction: '1747759374068000'
    },
    billing: {
      firstName: 'Lucho',
      lastName: 'Torres',
      email: 'luchotorres@gmail.com',
      phoneNumber: '989897960',
      street: 'Av. Jorge Chávez 275',
      city: 'Lima',
      state: 'Lima',
      country: 'PE',
      postalCode: '15000',
      documentType: 'DNI',
      document: '12345678'
    },
    shipping:{
      firstName: 'Juan',
      lastName: 'Pérez',
      email: 'juanperez@gmail.com',
      phoneNumber: '989897960',
      street: 'Av. Jorge Chávez 275',
      city: 'Lima',
      state: 'Lima',
      country: 'PE',
      postalCode: '15000',
      documentType: 'DNI',
      document: '12345679'
    }
  }
};

2. Instanciando la clase​

const checkout = new Izipay({ config: iziConfig });

3. Mostrando el checkout​

const callbackResponsePayment = {
  (response) => console.log(response);
};

try {
  checkout &&
    checkout.LoadForm({
      authorization: 'TU_TOKEN_SESSION',
      keyRSA: 'TU_KEY_RSA',
      callbackResponse: callbackResponsePayment,
    });
} catch (error) {
  console.log(error.message, error.Errors, error.date);
};

4. Respuesta​

Cada método de pago cuenta con su propia respuesta y aquí te mostramos un ejemplo de cada uno, los cuales se enviarán al comercio después de completar el flujo.

{
    "code": "00",
    "message": "Operación exitosa",
    "messageUser": "Operación exitosa",
    "messageUserEng": "Successful",
    "response": {
      "payMethod": "CARD",
      "order": [
        {
          "payMethodAuthorization": "CARD",
          "codeAuth": "831000",
          "currency": "PEN",
          "amount": "149.00",
          "installment": "00",
          "deferred": "0",
          "orderNumber": "1737067728",
          "stateMessage": "Autorizado",
          "dateTransaction": "20250116",
          "timeTransaction": "174837",
          "uniqueId": "1429383",
          "referenceNumber": "6330602"
        }
      ],
      "card": {
        "brand": "MC",
        "pan": "511842******6017",
        "save": "false"
      },
      "billing": {
        "firstName": "Lucho",
        "lastName": "Torres",
        "email": "luchotorres@gmail.com",
        "phoneNumber": "989897960",
        "street": "Av. Jorge Chávez 275",
        "city": "Lima",
        "state": "Lima",
        "country": "PE",
        "postalCode": "15000",
        "documentType": "DNI",
        "document": "12345678",
        "companyName": ""
      },
      "merchant": {
        "merchantCode": "4001061",
        "facilitatorCode": ""
      },
      "token": {
        "merchantBuyerId": "MC20250101",
        "cardToken": "",
        "alias": ""
      },
      "authentication": {
        "result": ""
      },
      "customFields": [
        {
          "name": "field1",
          "value": ""
        },
        {
          "name": "field2",
          "value": ""
        },
        {
          "name": "field3",
          "value": ""
        },
        {
          "name": "field4",
          "value": ""
        },
        {
          "name": "field5",
          "value": ""
        },
        {
          "name": "field6",
          "value": ""
        },
        {
          "name": "field7",
          "value": ""
        },
        {
          "name": "field8",
          "value": ""
        },
        {
          "name": "field9",
          "value": ""
        },
        {
          "name": "field10",
          "value": ""
        }
      ]
    },
    "payloadHttp": "{\"code\":\"00\",\"message\":\"Operación exitosa\",\"messageUser\":\"Operación exitosa\",\"messageUserEng\":\"Successful\",\"transactionId\":\"17370677285350\",\"response\":{\"payMethod\":\"CARD\",\"order\":[{\"payMethodAuthorization\":\"CARD\",\"codeAuth\":\"831000\",\"currency\":\"PEN\",\"amount\":\"149.00\",\"installment\":\"00\",\"deferred\":\"0\",\"orderNumber\":\"1737067728\",\"stateMessage\":\"Autorizado\",\"dateTransaction\":\"20250116\",\"timeTransaction\":\"174837\",\"uniqueId\":\"1429383\",\"referenceNumber\":\"6330602\"}],\"card\":{\"brand\":\"MC\",\"pan\":\"511842******6017\",\"save\":\"false\"},\"billing\":{\"firstName\":\"Lucho\",\"lastName\":\"Torres\",\"email\":\"luchotorres@gmail.com\",\"phoneNumber\":\"989897960\",\"street\":\"Av. Jorge Chávez 275\",\"city\":\"Lima\",\"state\":\"Lima\",\"country\":\"PE\",\"postalCode\":\"15000\",\"documentType\":\"DNI\",\"document\":\"12345678\",\"companyName\":\"\"},\"merchant\":{\"merchantCode\":\"4001061\",\"facilitatorCode\":\"\"},\"token\":{\"merchantBuyerId\":\"MC20250101\",\"cardToken\":\"\",\"alias\":\"\"},\"authentication\":{\"result\":\"\"},\"customFields\":[{\"name\":\"field1\",\"value\":\"\"},{\"name\":\"field2\",\"value\":\"a\"},{\"name\":\"field3\",\"value\":\"\"},{\"name\":\"field4\",\"value\":\"\"},{\"name\":\"field5\",\"value\":\"\"},{\"name\":\"field6\",\"value\":\"\"},{\"name\":\"field7\",\"value\":\"\"},{\"name\":\"field8\",\"value\":\"\"},{\"name\":\"field9\",\"value\":\"\"},{\"name\":\"field10\",\"value\":\"\"}]}}",
    "signature": "ddAlW9dl2/t5D3LwG3DpiWZPLmnowunw2XLo5MkxV9s=",
    "transactionId": "17370677285350"
  }
Importante

Yape​

  • El monto máximo de las operaciones con Yape debe ser menor o igual a S/ 2000.

  • Conoce más detalles de la integración aquí

Plin Interbank​

  • El monto máximo de las operaciones con Plin Interbank debe ser menor o igual a S/ 5000 o $ 1500.

  • Conoce más detalles de la integración aquí

Demo​

A continuación, te invitamos a explorar nuestra demo interactiva.

Editor en vivo
Resultado
Loading...