El cliente se distribuye desde la CDN de Entase como un único archivo. No hay paquete de npm, ningún paquete que compilar ni dependencias que mantener actualizadas – siempre obtienes la versión actual.
<script src="https://js.entase.com/client.js"></script>Al cargar el script se define una clase global Entase. Por sí sola no hace nada más: no realiza solicitudes de red, no modifica el DOM ni renderiza nada. Todo comienza cuando creas una instancia.
Creación de una instancia
const entase = new Entase({ pk: 'YOUR_PUBLISHABLE_KEY' });Crea una instancia por página y reutilízala para cada evento. El constructor registra un listener de message en la ventana y comienza a detectar qué modo de checkout puede usar tu dominio, por lo que crear varias instancias implica listeners duplicados y llamadas de detección duplicadas sin ningún beneficio.
Todas las opciones tienen un valor predeterminado, por lo que new Entase() sin argumentos es válido – pero, sin pk, el cliente no puede verificar que tu dominio pueda usar el checkout integrado y siempre recurrirá a una ventana emergente. Consulta Modos de checkout.
Carga asíncrona del script
Si cargas client.js con async o defer, la clase aún no existirá cuando se ejecute tu script integrado. La biblioteca emite un evento entase:ready en window una vez que se ha cargado, así que espera a que ocurra:
<script src="https://js.entase.com/client.js" async></script>
<script>
let entase = null;
const init = () => { entase = new Entase({ pk: 'YOUR_PUBLISHABLE_KEY' }); };
if (typeof Entase !== 'undefined') init();
else window.addEventListener('entase:ready', init);
</script>Es importante comprobar primero typeof: si el script ya terminó de cargarse, entase:ready ya se habrá emitido y escuchar dicho evento haría que esperaras indefinidamente.
Limpieza
En una aplicación de página única, llama a destroy() cuando se desmonte la vista propietaria de la instancia:
entase.destroy();Esto elimina los listeners de ventana registrados por el cliente. Una instancia destruida no se puede reutilizar – llamar a book() en ella registra un error y no hace nada. Crea una instancia nueva en su lugar.
Política de seguridad de contenido
Si tu sitio envía un encabezado Content-Security-Policy, el checkout necesita lo siguiente:
script-src https://js.entase.com– para cargar la biblioteca.frame-src https://www.entase.com– el checkout se renderiza en un iframe en modo panel.connect-src https://www.entase.com– el cliente llama a la API de Entase para determinar el modo de checkout permitido.
Sin frame-src, el modo panel genera un panel vacío. Sin connect-src, la detección de modo falla y todos los checkouts se abren como ventanas emergentes.