Ondersteunde frameworks
Language

CLI-integratie

Gebruik de cside CLI-tool om cside automatisch toe te voegen aan statische HTML-bestanden na uw bouwproces.

De CLI is een zelfstandige integratiemethode voor statische sites. Het injecteert automatisch het cside script en voorziet uw bestaande script-URL’s van een prefix. Geen handmatige script-tag nodig.

Geen handmatige scripttoevoeging nodig

Bij gebruik van de CLI hoeft u het cside script niet handmatig aan uw site toe te voegen. De CLI doet dit automatisch voor u. Gebruik de CLI of handmatige scriptinstallatie, niet beide.

Alleen statische HTML

De CLI ondersteunt alleen statische HTML-bestanden. Gebruik voor SSR-applicaties het handmatige script of het Next.js-pakket.

Ondersteunde frameworks

De CLI werkt met elk framework dat statische HTML-bestanden genereert:

  • Astro (statische modus)
  • Next.js (statische export)
  • Gatsby
  • Nuxt (statische modus)
  • SvelteKit (statische adapter)
  • Eleventy (11ty)
  • Hugo
  • VitePress / VuePress
  • Docusaurus

Elk ander framework dat statische HTML-bestanden genereert, werkt ook. De CLI detecteert automatisch .next en dist uitvoermappen, of specificeer een aangepaste map met --dir.

Installatie

npm i @cside.dev/cli

Of direct uitvoeren zonder installatie:

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

Gebruik

Voer de CLI uit na uw bouwproces om alle script-URL’s in uw HTML-bestanden van een prefix te voorzien:

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

Vervang your-domain.com door uw daadwerkelijke domein dat in cside is geconfigureerd.

CLI-opties

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 from prefixing.
                                                           [array] [default: []]
  -h, --help                           Show help                       [boolean]

Voorbeelden

Een specifieke map verwerken:

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

Een enkel bestand verwerken:

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

Specifieke scripts uitsluiten:

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

Wanneer de CLI gebruiken

Gebruik de CLI als:

  • U een statisch site (SSG) bouwproces heeft
  • U een zero-code integratie wilt
  • U uw broncode niet wilt wijzigen

De CLI doet automatisch het volgende:

  1. Injecteert het cside script in uw HTML
  2. Voorziet alle third-party script-URL’s van een prefix met de cside edge-infrastructuur
  3. Voegt de vereiste referrerpolicy-attributen toe

Content Security Policy (CSP)

Als uw site een Content Security Policy gebruikt, moet u deze nog steeds bijwerken bij gebruik van de CLI. Voeg proxy.csidetm.com toe aan uw script-src en connect-src richtlijnen. Dit is alleen vereist als u die richtlijnen gebruikt. Als connect-src niet aanwezig is, hoeft u connect-src niet toe te voegen:

Content-Security-Policy: script-src 'self' proxy.csidetm.com; connect-src 'self' proxy.csidetm.com
Alleen als u deze richtlijnen gebruikt

U hoeft uw CSP alleen bij te werken als u al script-src of connect-src richtlijnen heeft gedefinieerd. Als u geen CSP gebruikt, of deze specifieke richtlijnen niet gebruikt, zijn er geen wijzigingen nodig.

Wat elke richtlijn toestaat:

  • script-src: Als u deze richtlijn gebruikt, voeg proxy.csidetm.com toe om het cside script en scripts die via Gatekeeper worden gerouteerd uit te laten voeren
  • connect-src: Als u deze richtlijn gebruikt, voeg proxy.csidetm.com toe om het cside script te laten communiceren met de edge-infrastructuur

Voor meer details over CSP-configuratie, zie cside toevoegen aan uw CSP en CSP-rapportageconfiguratie.

Alternatieve integratiemethoden