Seguridad (CSP)

Protege a tus clientes garantizando que tus cotizaciones solo se puedan abrir donde tú lo autorizas.

La Amenaza de Clickjacking

Si cualquier página web en Internet pudiera simplemente crear un <iframe> apuntando a las cotizaciones privadas de tus clientes, un atacante podría construir una página falsa superpuesta (UI Redressing o Clickjacking) y engañar a un cliente para que haga clic en un botón de pago falso que en realidad hace clic en el botón de aceptar dentro de tu cotización invisible.

Por ello, la seguridad de Cord Elements es estricta desde el primer día.

Frame Ancestors y la Allowlist

Cord mitiga esta vulnerabilidad mediante encabezados HTTP nativos conocidos como Política de Seguridad de Contenido (CSP). Específicamente, usamos la directiva frame-ancestors.

Para que el snippet de instalación de Elements funcione en tu sitio web corporativo, primero debes registrar tus orígenes en el panel de control.

  1. Dirígete a Ajustes > Desarrolladores > Elements.
  2. Busca la sección de Dominios autorizados.
  3. Añade los dominios separados por saltos de línea.

Ejemplos válidos

El sistema de dominios permite orígenes estrictos o el uso de comodines (wildcards):

  • tu-empresa.com (Autoriza solo la raíz).
  • *.tu-empresa.com (Autoriza la raíz y cualquier subdominio, como app.tu-empresa.com).
  • https://portal.tu-empresa.com (Altamente específico).

Atención: Si la lista de dominios está completamente vacía, Cord operará en un “Modo Abierto”, lo que significa que el iframe puede ser embebido en cualquier parte. Recomendamos este modo únicamente durante la etapa de pruebas locales (localhost) y exigir dominios antes de salir a producción.

Origin Validation en Eventos

La seguridad no se detiene en prevenir quién puede ver el iframe. Cuando Cord Elements dispara eventos hacia afuera (como cord:approved), la comunicación podría ser interceptada por otra pestaña maliciosa.

El SDK adjunta automáticamente el parámetro parentOrigin (el window.location.origin de tu página) a la URL del iframe. Cord lo cruza contra tu Allowlist de dominios: si tienes al menos un dominio registrado y ese parentOrigin matchea alguno de ellos, el canal window.postMessage dirige la comunicación únicamente a ese origen específico.

Importante: si NO hay match (o si no configuraste ninguna Allowlist todavía), Cord no descarta el evento — lo emite con el target * de postMessage, el mismo comportamiento histórico del SDK, para no romper integraciones antiguas o un <iframe> de terceros embebido sin pasar por embed.js. Esto significa que, sin una Allowlist configurada, cualquier ventana en la cadena de frames puede leer los eventos. El endurecimiento a un origen específico es una mejora que solo se activa cuando registras tus dominios — no un rechazo automático de lo no autorizado. Configura tu Allowlist en producción; no dependas de que un origen no listado “falle silenciosamente”, porque no es así como se comporta hoy.