Skip to main content
Frameworks compatibles
Language

Integracion CLI

Usa la herramienta CLI de cside para agregar automaticamente cside a archivos HTML estaticos despues de tu proceso de compilacion.

El CLI es un metodo de integracion independiente para sitios estaticos. Inyecta automaticamente el script de monitoreo de cside en tus archivos HTML. No se necesita etiqueta de script manual.

No necesitas agregar el script manualmente

Al usar el CLI, no necesitas agregar el script de cside a tu sitio. El CLI lo agrega automaticamente. Usa el CLI o la instalacion manual del script, no ambos.

Solo HTML estatico

El CLI solo soporta archivos HTML estaticos. Para aplicaciones SSR, usa el script manual o el paquete Next.js en su lugar.

Frameworks compatibles

El CLI funciona con cualquier framework que genere archivos HTML estaticos:

  • Astro (modo estatico)
  • Next.js (exportacion estatica)
  • Gatsby
  • Nuxt (modo estatico)
  • SvelteKit (adaptador estatico)
  • Eleventy (11ty)
  • Hugo
  • VitePress / VuePress
  • Docusaurus

Cualquier otro framework que genere archivos HTML estaticos tambien funcionara. El CLI detecta automaticamente las carpetas de salida .next y dist, o especifica un directorio personalizado con --dir.

Instalacion

npm i @cside.dev/cli

O ejecuta directamente sin instalar:

npx @cside.dev/cli your-domain.com

Uso

Ejecuta el CLI despues de tu proceso de compilacion para inyectar el script de cside en tus archivos HTML:

// package.json
{
  "scripts": {
    "build": "next build && npx @cside.dev/cli your-domain.com"
  }
}
Reemplaza el dominio

Reemplaza your-domain.com con tu dominio real configurado en cside.

Opciones del CLI

Usage: @cside.dev/cli <domain> [options]

Positionals:
  domain  The domain to process                                         [string]

Options:
      --version                        Show version number             [boolean]
  -d, --dir                            Directory containing HTML files to
                                       process. Defaults to .next and dist.
                                                                        [string]
  -f                                   Process a single file instead of a
                                       directory.                       [string]
  -s, --silent                         Disable output logging.
                                                      [boolean] [default: false]
      --enable-first-party-proxy       Enable first party edge infrastructure.
                                                      [boolean] [default: false]
      --enable-script-tracking         Enable script tracking.
                                                       [boolean] [default: true]
      --enable-security-headers-check  Enable security headers check.
                                                       [boolean] [default: true]
      --excluded-scripts               Scripts to exclude.
                                                           [array] [default: []]
  -h, --help                           Show help                       [boolean]

Ejemplos

Procesar un directorio especifico:

npx @cside.dev/cli your-domain.com --dir ./out

Procesar un solo archivo:

npx @cside.dev/cli your-domain.com -f ./dist/index.html

Excluir scripts especificos:

npx @cside.dev/cli your-domain.com --excluded-scripts "https://example.com/script.js"

Cuando usar el CLI

Usa el CLI si:

  • Tienes un proceso de compilacion de sitio estatico (SSG)
  • Quieres una integracion sin codigo
  • No quieres modificar tu codigo fuente

El CLI automaticamente:

  1. Inyecta el script de cside en tu HTML
  2. Agrega los atributos referrerpolicy necesarios

Politica de Seguridad de Contenido (CSP)

Si tu sitio usa una Politica de Seguridad de Contenido, aun necesitas actualizarla al usar el CLI. Agrega *.csidetm.com a tus directivas script-src y connect-src. Esto solo es necesario si usas esas directivas. Si connect-src no esta presente, no necesitas agregar connect-src:

Content-Security-Policy: script-src 'self' *.csidetm.com; connect-src 'self' *.csidetm.com
Solo si usas estas directivas

Solo necesitas actualizar tu CSP si ya tienes directivas script-src o connect-src definidas. Si no usas CSP, o no usas estas directivas especificas, no se necesitan cambios.

Lo que permite cada directiva:

  • script-src: Si usas esta directiva, agrega *.csidetm.com para permitir que el script de cside y los scripts de terceros instrumentados se ejecuten
  • connect-src: Si usas esta directiva, agrega *.csidetm.com para permitir que el script de cside se comunique con la infraestructura edge

Para mas detalles sobre la configuracion de CSP, consulta Agregar cside a tu CSP y Configuracion de informes CSP.

Metodos de integracion alternativos

Was this page helpful?