Pop-up

El SDK web te permite abrir un formulario de pago en una ventana emergente para una experiencia de usuario más fluida.

Objetivo

Aprenderás a:

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

1. Creando el objeto de configuración

const iziConfig = {
 config: {
   ...,
   render: {
      typeForm: 'pop-up'
   },
   ...
 }
};

Nota

Puedes configurar los atributos correspondientes para personalizar su apariencia y comportamiento aquí.

2. Instanciando la clase

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

3. Mostrando el checkout

El método LoadForm, que se muestra en el siguiente ejemplo, se encarga de levantar 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);
}

Tip

En el ejemplo anterior, la función callbackResponsePayment se utiliza para recibir la respuesta de la transacción.

Información

Si necesitas hacer un redireccionamiento después de recibir la respuesta de la transacción te recomendamos utilizar el Modo Redirect.

Demo

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

Editor en vivo

const config = { render: { typeForm: 'pop-up' } } render ( <Izipay config={config} /> )

  const config = {
    render: {
      typeForm: 'pop-up'
    }
  }

  render (
    <Izipay
      config={config}
    />
  )

Resultado

Loading...