Vue y Vercel

Separación de responsabilidades

El navegador consume rutas del propio sitio. El backend valida las peticiones, aplica límites, conserva los intentos y usa la credencial dedicada. No asumir Next.js o Nuxt: adaptar los handlers al framework real del proyecto.

Vue → backend del propio sitio en Vercel → API Istmo Commerce por HTTPS

Configuración de servidor

Estas variables no llevan prefijo VITE_. No registrar sus valores ni cabeceras de autenticación. El cliente Node descargable requiere Node 20+, usa timeout de 10 segundos y no sigue redirecciones ni reintenta escrituras automáticamente.

ISTMO_COMMERCE_BASE_URL=https://TU-SERVIDOR-POS/api/v1/commerce
ISTMO_COMMERCE_KEY=SECRETO-ENTREGADO-AL-CREAR-LA-INTEGRACION

Llamadas internas del backend

savedAttempt representa un intento persistido previamente con externalId y cuerpo estables. El fragmento no es un handler público completo. Almacenar esa información de forma durable; no depender de la memoria de una función serverless.

Comprobar la propiedad de cada pedido por sesión/comprador antes de consultar su estado. Nunca permitir que el navegador seleccione URL remota, credencial, empresa o un endpoint administrativo.

import { createCommerceClient } from './istmo-commerce.mjs';

const commerce = createCommerceClient({
  baseUrl: process.env.ISTMO_COMMERCE_BASE_URL,
  key: process.env.ISTMO_COMMERCE_KEY,
});

const catalog = await commerce.catalog({ limit: 50 });
const receipt = await commerce.createOrder(savedAttempt);
// Tras una respuesta perdida, conservar savedAttempt:
const recovered = await commerce.order(savedAttempt.externalId);

Interfaz del comprador

• Mostrar “Solicitar pedido” y “Solicitud recibida, pendiente de confirmación”.
• checkoutEnabled=false deshabilita cobros automáticos. ACH manual requiere quote vigente, action=payment e instrucciones habilitadas por administración.
• Tras timeout, conservar el intento y mostrar que su estado está por comprobar.
• No guardar datos personales innecesarios en el navegador. No simular conexión local o una compra pagada.