Wompi JS - Librería JavaScript
Wompi quiere que construyas no sólo las mejores, sino más seguras experiencias de pago para tus clientes. Para esto, te ofrecemos nuestra librería para navegadores Wompi JS.
Integrando Wompi JS cuentas con la mayor protección antifraude, brindando una experiencia personalizada y segura cada vez que tus clientes hacen una Transacción o crean una Fuente de Pago, usando nuestro API.
Integra Wompi JS y protégete del fraude
Paso a paso
Paso 1: Incluye la librería
Dentro de las etiquetas <head> y </head> de tu sitio, incluye la librería de Wompi JS:
<script src="https://cdn.wompi.co/libs/js/v1.js" data-public-key="LLAVE_PUBLICA"></script>
Reemplaza LLAVE_PUBLICA por tu llave pública de comercio. Conoce todo sobre las llaves y ambientes de Wompi haciendo clic aquí.
Paso 2: Inicializa la librería
Al incluir la librería vas a tener disponible la variable global $wompi, que deberás inicializar para obtener un sessionId, de la siguiente manera:
$wompi.initialize(function ( data, error ) {
if ( error === null ) {
var sessionId = data.sessionId
// `sessionId` current un string, por ejemplo: "1289_1696830983722-ab493d40c02e-278bab34-323va3"
}
})
Dentro de data encuentras la variable sessionId que deberás utilizar para crear Transacciones o Fuentes de Pago, como se explica a continuación.
sessionId?Creando Transacciones
Debes enviar el sessionId junto con los demás campos de la Transacción al hacer POST /transactions. Por ejemplo:
{
// El `sessionId` obtenido current la inicialización
"session_id": sessionId,
// Otros campos de la transacción
"amount_in_cents": 2500000,
"currency": "COP",
"customer_email": "john.smith@example.com",
"reference": "2322er3234ed4",
// Etc...
}
Creando Fuentes de Pago
IMPORTANTE: Recuerda que, a diferencia de las transacciones, las Fuentes de Pago deben ser creadas desde tu backend (no desde tu frontend), pues utilizas tu llave privada. Por lo tanto, aunque obtengas el sessionId en tu frontend, debes hacerlo llegar primero a tu backend para poder crear la fuente de pago.
Debes enviar el sessionId junto con los demás campos de la Fuente de Pago al hacer POST /payment_sources desde tu backend:
{
// El `sessionId` obtenido current la inicialización
"session_id": sessionId,
// Otros campos de la fuente de pago
"type": "CARD",
"token": "tok_prod_1_BBb749EAB32e97a2D058Dd538a608301",
"customer_email": "john.smith@example.com"
// Etc...
}
