Si tienes un emprendimiento o un pequeño negocio en Colombia, seguro ya te diste cuenta de que aceptar pagos por internet dejó de ser un lujo para convertirse en una necesidad. Ya sea que vendas artesanías, ofrezcas servicios o tengas una tienda de barrio, tus clientes quieren pagar con PSE, Nequi, Daviplata o tarjetas de crédito.
Integrar una pasarela de pago puede sonar intimidante, pero la verdad es que con las herramientas adecuadas es un proceso súper manejable. En este tutorial vamos a poner manos a la obra y te mostraré cómo integrar Wompi (una de las pasarelas más populares en el país) en el backend de tu aplicación usando Node.js. ¡Vamos a ello!
¿Por qué elegir Wompi para tu negocio en Colombia?
Wompi se ha convertido en una de las favoritas de los emprendedores colombianos por varias razones:
- Múltiples métodos de pago: Permite recibir pagos con tarjetas de crédito y débito, PSE, Nequi y Daviplata.
- Fácil integración: Su API es clara y tienen un modo de pruebas (sandbox) excelente para desarrollar sin riesgo.
- Sin comisiones ocultas: Sabes de antemano qué porcentaje te van a cobrar por cada transacción exitosa.
Requisitos previos
Antes de empezar, asegúrate de tener lo siguiente:
- Node.js instalado en tu computador (versión 14 o superior).
- Conocimientos básicos de JavaScript y Express.
- Una cuenta en Wompi (puedes crearla gratis y usar el entorno de pruebas).
Paso 1: Configurar el entorno de desarrollo
Vamos a crear un servidor básico con Express para manejar nuestras rutas. Abre tu terminal y ejecuta los siguientes comandos para iniciar el proyecto e instalar las dependencias necesarias:
mkdir pagos-wompi && cd pagos-wompi
npm init -y
npm install express axios cors dotenv
Express será nuestro framework web, Axios lo usaremos para hacer las peticiones HTTP a la API de Wompi, Cors para permitir peticiones desde el frontend y Dotenv para manejar nuestras variables de entorno de forma segura.
Paso 2: Obtener tus llaves de API
Ingresa a tu panel de Wompi y dirígete a la sección de configuración o desarrolladores. Allí encontrarás dos llaves importantes:
- Llave pública (Public Key): Se usa en el frontend.
- Llave privada (Secret Key): Se usa en el backend. ¡Nunca la compartas ni la subas a repositorios públicos!
Crea un archivo llamado .env en la raíz de tu proyecto y agrega tus llaves de prueba (sandbox):
PORT=3000
WOMPI_PRIVATE_KEY="tu_llave_privada_de_prueba"
WOMPI_PUBLIC_KEY="tu_llave_publica_de_prueba"
Paso 3: Crear el backend para generar el link de pago
La forma más sencilla y segura de empezar a cobrar es usando los "Links de Pago" de Wompi desde tu backend. Esto evita que tengas que manejar datos sensibles de tarjetas en tu servidor (lo que simplifica enormemente la certificación de seguridad).
Crea un archivo llamado index.js y añade el siguiente código:
require('dotenv').config();
const express = require('express');
const axios = require('axios');
const cors = require('cors');
const app = express();
app.use(cors());
app.use(express.json());
// Ruta para crear un link de pago
app.post('/crear-pago', async (req, res) => {
try {
const { monto, referencia, nombreProducto } = req.body;
const response = await axios.post('https://sandbox.wompi.co/v1/transactions/links', {
amount_in_cents: monto * 100, // Wompi maneja los montos en centavos
currency: 'COP',
reference: referencia,
name: nombreProducto,
description: 'Compra en mi tienda colombiana',
redirect_url: 'https://mitienda.com/gracias' // URL a la que vuelve el usuario después de pagar
}, {
headers: {
'Authorization': `Bearer ${process.env.WOMPI_PRIVATE_KEY}`
}
});
res.json({
url_pago: response.data.data.url
});
} catch (error) {
console.error(error.response ? error.response.data : error.message);
res.status(500).json({ error: 'Error al crear el pago' });
}
});
app.listen(process.env.PORT, () => {
console.log(`Servidor corriendo en el puerto ${process.env.PORT}`);
});
En este código, recibimos el monto y la referencia desde el frontend de nuestra app (o móvil), creamos el link de pago en Wompi y le devolvemos la URL al cliente para que sea redirigido y complete la transacción de forma segura.
Paso 4: Manejar el Webhook (Confirmación del pago)
Un error muy común es asumir que si el usuario vuelve a la página de "gracias", el pago fue exitoso. La realidad es que las transacciones con PSE o Nequi pueden tardar minutos o incluso horas en confirmarse. Para saber con seguridad si te pagaron, debes configurar un Webhook.
Un webhook es una URL en tu servidor a la que Wompi enviará una notificación cuando el estado de la transacción cambie. Añade esta ruta a tu index.js:
app.post('/webhook-wompi', async (req, res) => {
try {
const { event, data } = req.body;
// Verificamos que el evento sea de una transacción actualizada
if (event === 'transaction.updated') {
const transactionId = data.transaction.id;
// Consultamos el estado real de la transacción a la API de Wompi por seguridad
const response = await axios.get(`https://sandbox.wompi.co/v1/transactions/${transactionId}`, {
headers: { 'Authorization': `Bearer ${process.env.WOMPI_PRIVATE_KEY}` }
});
const estado = response.data.data.status;
if (estado === 'APPROVED') {
console.log(`¡Pago aprobado para la referencia ${response.data.data.reference}!`);
// Aquí actualizas tu base de datos, envías un correo, etc.
} else {
console.log(`El pago quedó en estado: ${estado}`);
}
}
// Siempre debemos responder 200 a Wompi para que sepan que recibimos la notificación
res.status(200).send('OK');
} catch (error) {
res.status(500).send('Error interno');
}
});
Nota que siempre consultamos el estado de la transacción a la API de Wompi usando el ID que nos llega en el webhook. Esto es una buena práctica de seguridad para evitar que alguien haga una petición falsa a tu webhook para engañarte.
Consejos prácticos para emprendedores y desarrolladores
- Trabaja en centavos: Wompi requiere que el monto se envíe en centavos. Si quieres cobrar $50.000 COP, debes enviar
5000000. - Usa Ngrok para pruebas locales: Si estás desarrollando en tu computador, Wompi no podrá llegar a tu
localhost. Usa Ngrok para exponer tu puerto local a internet y configura esa URL en el panel de Wompi para los webhooks. - Pasa a producción con cuidado: Una vez que todo funcione en el sandbox (entorno de pruebas), cambia las llaves en tu archivo
.envpor las de producción y cambia la URL de la API desandbox.wompi.coaproduction.wompi.co.
Conclusión
Integrar una pasarela de pago como Wompi en Colombia no tiene por qué ser un dolor de cabeza. Con un poco de Node.js y siguiendo las buenas prácticas de seguridad, puedes empezar a recibir pagos en tu web o app móvil en cuestión de horas. Recuerda siempre probar en el entorno sandbox antes de lanzarte a producción.
Si en medio de tu camino sientes que integrar pagos, armar tu aplicación web o desarrollar tu app móvil se vuelve un hueso duro de roer, no tienes que hacerlo solo. En Camilincanins Company nos apasiona ayudar a emprendedores y pequeños negocios a llevar sus ideas al mundo digital. Ya sea que necesites un software a medida, una app móvil o asesoría para tu proyecto, estamos listos para echarle una mano. ¡Éxitos con tu emprendimiento y a programar se ha dicho!