# Instalación del cliente

> Carga client.js desde la CDN de Entase y, a continuación, crea una instancia. No hay ningún paquete que instalar ni ningún paso de compilación.

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.

```html
<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

```js
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](/developers/js-client/checkout-modes.md).

## 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:

```html
<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:

```js
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.