Skip to main content
Wat heb je nodig
Language

Snelstart in 5 minuten

Ga van nul naar het monitoren van third-party scripts op je website in minder dan 5 minuten.

Zet cside in 5 minuten op je website. Aan het einde van deze handleiding heb je realtime inzicht in elk third-party script dat in de browsers van je bezoekers wordt geladen.

Wat heb je nodig

  • Een website die je wilt beschermen
  • Toegang tot de HTML of het buildproces van je site

Snelstart

Maak je account aan

Ga naar dash.cside.com/auth/signup en registreer je. Verifieer je e-mailadres met de 6-cijferige code die naar je inbox is gestuurd.

Kies je plan:

PlanPrijsGeschikt voor
Free$0/mndTesten en kleine sites (tot 2.500 paginaweergaven/mnd)
BusinessVanaf $99/mndProductiesites die threat blocking en rollbacks nodig hebben
EnterpriseOp maatSites met veel verkeer, SSO, dedicated support

Voeg je domein toe

Klik in het dashboard op Add Domain en voer je domein in (bijv. example.com). Domeinen worden standaard met wildcard behandeld, dus www.example.com en shop.example.com worden automatisch meegenomen.

Kies je beveiligingsmodus:

  • Direct Mode (Makkelijkst): Monitort scripts in de browser en haalt ze server-side op ter verificatie. Geen extra latentie.
  • Scan Mode (Geen codewijzigingen): Crawler-gebaseerde analyse. Alleen voor Enterprise.
Niet zeker welke modus?

Begin met Direct Mode. Zie Onboarding voor details over elke modus.

Voeg het cside script toe

Kies de methode die bij je stack past:

Voeg dit toe als het eerste script in je <head>:

<script src="https://[your-team-id].csidetm.com/client.js" referrerpolicy="origin"></script>
npm install @cside.dev/next

App Router (layout.tsx):

import { CSideScript } from '@cside.dev/next';

export default function Layout({ children }) {
  return (
    <>
      <CSideScript />
      {children}
    </>
  );
}

Pages Router (_document.tsx):

import { CSideScript } from '@cside.dev/next';

export default function Document() {
  return (
    <Html>
      <Head>
        <CSideScript />
      </Head>
      <body>
        <Main />
        <NextScript />
      </body>
    </Html>
  );
}

Voeg dit toe aan je buildscript in package.json:

{
  "scripts": {
    "build": "your-build-command && npx @cside.dev/cli@latest example.com"
  }
}

De CLI injecteert automatisch het cside monitoring script in uw HTML-bestanden. Werkt met Astro, Gatsby, Hugo, Eleventy, Docusaurus en elk framework dat statische HTML genereert.

npm install @cside.dev/vite
// vite.config.ts
import cside from '@cside.dev/vite';

export default defineConfig({
  plugins: [cside()],
});
GTM-installatie is alleen voor testen

GTM garandeert de laadvolgorde van scripts niet, waardoor andere scripts kunnen worden uitgevoerd voordat cside ze kan onderscheppen. Gebruik voor productie directe scriptinstallatie om ervoor te zorgen dat cside als eerste wordt geladen.

  1. Ga in Google Tag Manager naar Tags > Nieuw, klik op Tagconfiguratie en selecteer Custom HTML
  2. Plak het onderstaande fragment in het HTML-veld (vervang [your-team-id] door je team-ID)
  3. Selecteer onder Triggering de optie All Pages
  4. Sla de tag op en publiceer je GTM-container
<script type="text/javascript" src="https://[your-team-id].csidetm.com/client.js" referrerpolicy="origin"></script>

Als je Claude Code, Cursor of een andere AI-coderingsassistent gebruikt, kan deze cside voor je toevoegen. Bekijk de volledige prompt op de AI-assistentpagina, of plak dit in je terminal:

Add cside client-side security monitoring to this project. Install the
right package for the framework (@cside.dev/next for Next.js,
@cside.dev/vite for Vite, @cside.dev/cli for static sites) or add
<script src="https://[your-team-id].csidetm.com/client.js" referrerpolicy="origin"></script>
as the first script in the <head> for any other setup. Then check if the
project has a Content Security Policy (in HTTP headers, meta tags,
helmet.js, next.config.js, or hosting config). If the CSP has explicit
script-src or connect-src directives listing specific domains, add
*.csidetm.com to both. If the CSP uses broad rules like
"default-src https:", no changes are needed.

Activeren en verifiëren

  1. Ga in het dashboard naar Domains in de linkerzijbalk
  2. Klik op Activate naast je domein
  3. Bezoek je website - je zou binnen enkele seconden scriptverkeer in het dashboard moeten zien verschijnen

Je bent beschermd

Na activering zal cside:

  • Monitoren: elk third-party script dat in de browsers van je bezoekers wordt geladen
  • Detecteren: kwaadaardig of verdacht scriptgedrag in realtime
  • Waarschuwen: wanneer er bedreigingen worden gevonden (configureer notificaties voor e-mail, Slack, Jira, Linear of webhooks)
  • Blokkeren: bedreigingen automatisch blokkeren (Business-plan en hoger)

Volgende stappen

Was this page helpful?