Início Rápido em 5 Minutos

Coloque o cside em funcionamento no seu site em 5 minutos. Ao final deste guia, você terá visibilidade em tempo real de todos os scripts de terceiros carregados nos navegadores dos seus visitantes.

O que você vai precisar

Um site que você deseja proteger
Acesso ao HTML ou ao processo de build do seu site

Início rápido

Crie sua conta

Acesse dash.cside.com/auth/signup e cadastre-se. Verifique seu e-mail com o código de 6 dígitos enviado para sua caixa de entrada.

Escolha seu plano:

Plano	Preço	Ideal para
Free	$0/mês	Testes e sites pequenos (até 2.500 visualizações de página/mês)
Business	A partir de $99/mês	Sites em produção que precisam de bloqueio de ameaças e rollbacks
Enterprise	Personalizado	Sites de alto tráfego, SSO, suporte dedicado

Adicione seu domínio

No painel, clique em Add Domain e insira seu domínio (ex.: example.com). Os domínios são tratados com wildcard por padrão, então www.example.com e shop.example.com são incluídos automaticamente.

Escolha seu modo de proteção:

Direct Mode (Mais fácil) — Monitora scripts no navegador e os busca no servidor para verificação. Nenhuma latência adicionada.
Scan Mode (Sem alterações no código) — Análise baseada em crawler. Apenas Enterprise.

Não tem certeza de qual modo escolher?

Comece com o Direct Mode. Consulte Onboarding para detalhes sobre cada modo.

Adicione o script do cside

Escolha o método que corresponde à sua stack:

Adicione isso como o primeiro script no seu <head>:

<script src="https://proxy.csidetm.com/script.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>
  );
}

Adicione ao seu script de build no package.json:

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

O CLI injeta automaticamente o script de monitoramento do cside nos seus arquivos HTML. Funciona com Astro, Gatsby, Hugo, Eleventy, Docusaurus e qualquer framework que gere HTML estático.

npm install @cside.dev/vite

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

export default defineConfig({
  plugins: [cside()],
});

Ative e verifique

No painel, vá até Domains na barra lateral esquerda
Clique em Activate ao lado do seu domínio
Acesse seu site — você deverá ver o tráfego de scripts aparecer no painel em segundos

Você está protegido

Uma vez ativado, o cside irá:

Monitorar todos os scripts de terceiros carregados nos navegadores dos seus visitantes
Detectar comportamentos maliciosos ou suspeitos de scripts em tempo real
Alertar você quando ameaças forem encontradas (configure endpoints de notificação para Slack, Jira, Linear ou webhooks)
Bloquear ameaças automaticamente (plano Business e superiores)

Próximos passos

Ajuste seu CSP — Configure a Content Security Policy para funcionar com o cside
Configure notificações — Receba alertas no Slack, Jira, Linear ou via webhooks
Conformidade PCI DSS — Veja como o cside ajuda a atender os Requisitos 6.4.3 e 11.6.1 do PCI DSS 4.0
Teste em staging primeiro — Experimente o cside em um ambiente de staging antes de ir para produção