AAPDWidget
Eventos postMessage
WIDGET_PAYMENT_SUCCESS y el resto del vocabulario de eventos.
El widget AAPD se comunica con la página padre vía postMessage estándar. Suscríbete una vez y despacha por tipo de evento.
Vocabulario
| Evento | Disparado cuando | Qué haces típicamente |
|---|---|---|
WIDGET_FORM_READY | Widget montado, listo para renderizar | Mostrar tu container del iframe |
WIDGET_FORM_MOUNT | Form renderizado por primera vez | Tag de analytics opcional |
WIDGET_PAYMENT_SUCCESS | Pago capturado (flujo AAPD) | Cerrar el modal, mostrar tu confirmación |
WIDGET_FORM_SUCCESS | Registro estándar completado (no AAPD) | Igual — cerrar, confirmar |
WIDGET_FORM_CLOSE | Paciente cerró el widget | Cerrar el modal, opcionalmente loggear abandono |
Suscribirse
window.addEventListener("message", (event) => {
if (event.origin !== "https://spot.getskip.ai") return;
switch (event.data) {
case "WIDGET_PAYMENT_SUCCESS":
closeIframeModal();
showCnplConfirmation();
break;
case "WIDGET_FORM_CLOSE":
closeIframeModal();
break;
}
});Verifica siempre event.origin — esto es higiene estándar de postMessage. Sin ella, cualquier página embebida puede falsificar estos eventos.
Cuándo confiar en el evento
WIDGET_PAYMENT_SUCCESS es la señal frontend de que el paciente terminó. La confirmación autoritativa es tu webhook server-side (order.paid). Si tu lógica de negocio requiere "la orden está pagada con seguridad", espera el webhook antes de cumplir.
Para UX (cerrar el modal, redirigir, mostrar "¡listo!"), el postMessage está perfecto.