Content Security Policy

If your application sends a Content-Security-Policy header, the browser will block the ShieldLabs snippet unless you add its hosts to your allowlists. The snippet loads a module from a CDN, pulls in a dependency, and POSTs the collected signals to a few shieldlabs.ai endpoints. Each of those needs a directive. If you have not added the snippet yet, start with Add the snippet and come back here once it loads.

Required directives

Add these two directives to your existing policy. Merge the hosts into directives you already have rather than duplicating them.

script-src  'self' https://cdn.shieldlabs.ai https://cdn.jsdelivr.net;
connect-src 'self' https://rest.shieldlabs.ai https://webrtc.shieldlabs.ai stun:ice.shieldlabs.ai:3478;

What each host is for

script-src covers the code that runs. connect-src covers where the snippet sends data.

Directive	Host	Why it is needed
`script-src`	`https://cdn.shieldlabs.ai`	Serves the ShieldLabs snippet module (`snippet.js`) and its supporting modules.
`script-src`	`https://cdn.jsdelivr.net`	A required runtime dependency the snippet imports from jsDelivr. Omit this host and the snippet cannot finish loading.
`connect-src`	`https://rest.shieldlabs.ai`	The snippet POSTs the collected signal snapshot here. This is the main data endpoint.
`connect-src`	`https://webrtc.shieldlabs.ai`	A ShieldLabs data endpoint the snippet connects to.
`connect-src`	`stun:ice.shieldlabs.ai:3478`	A ShieldLabs data endpoint the snippet connects to.

https://cdn.jsdelivr.net belongs in script-src because that dependency is fetched as a module, not in connect-src. The three shieldlabs.ai data endpoints belong in connect-src because the snippet connects to them to send data.

The snippet uses no eval and no new Function. It loads code by dynamic import() only, so 'unsafe-eval' is never required, even under a strict policy.

Inline scripts: HTML method vs framework method

The two install methods from Add the snippet have different inline-script requirements.

HTML script tag (needs inline)
Framework component (no inline)

The HTML method runs an inline <script type="module"> that calls import():

<script type="module">
  const mod = await import('https://cdn.shieldlabs.ai/snippet.js?publicKey=YOUR_PUBLIC_KEY');
  mod.checkAnonymous();
</script>

Because the bootstrap code is inline, a policy that forbids inline scripts will block it. You have two options:

Move the bootstrap into an external module file you serve from 'self' (no inline code), or
Use the framework component method instead (next tab), which has no inline script at all.

Avoid 'unsafe-inline' if you can. The framework method removes the need for it entirely.

In React, Vue, Angular, Svelte, or Preact the import() lives inside a component or service in your application code, which is already covered by script-src 'self' (or your bundler host). There is no inline script, so you do not need 'unsafe-inline':

import { useEffect } from "react";

export function ShieldlabsTracker({ publicKey }) {
  useEffect(() => {
    let cancelled = false;
    (async () => {
      const mod = await import(
        `https://cdn.shieldlabs.ai/snippet.js?publicKey=${publicKey}`
      );
      if (!cancelled) mod.checkAnonymous();
    })();
    return () => { cancelled = true; };
  }, [publicKey]);

  return null;
}

This is the cleanest fit for a strict CSP. The full set of framework examples is on Add the snippet.

Full-header examples

Drop these into your stack and adjust the surrounding directives to match your app. Only the two ShieldLabs directives are required.

add_header Content-Security-Policy "
  default-src 'self';
  script-src  'self' https://cdn.shieldlabs.ai https://cdn.jsdelivr.net;
  connect-src 'self' https://rest.shieldlabs.ai https://webrtc.shieldlabs.ai stun:ice.shieldlabs.ai:3478;
  style-src   'self' 'unsafe-inline';
  base-uri    'self';
  frame-ancestors 'none'
" always;

const csp = `
  default-src 'self';
  script-src  'self' https://cdn.shieldlabs.ai https://cdn.jsdelivr.net;
  connect-src 'self' https://rest.shieldlabs.ai https://webrtc.shieldlabs.ai stun:ice.shieldlabs.ai:3478;
`;

module.exports = {
  async headers() {
    return [
      {
        source: "/(.*)",
        headers: [
          { key: "Content-Security-Policy", value: csp.replace(/\n/g, " ").trim() },
        ],
      },
    ];
  },
};

<meta
  http-equiv="Content-Security-Policy"
  content="
    default-src 'self';
    script-src  'self' https://cdn.shieldlabs.ai https://cdn.jsdelivr.net;
    connect-src 'self' https://rest.shieldlabs.ai https://webrtc.shieldlabs.ai stun:ice.shieldlabs.ai:3478;
  "
/>

A very strict CSP can skip the local-network check

The snippet also runs a local-network check that feeds the Risk Score. A very strict connect-src that blocks the local-network connection stops this one check from running.

This is acceptable degradation. The main snapshot still posts, identification still works, and the visitor is still scored. When the local-network check cannot run, it is recorded as “not checked”, which carries a small penalty, so the Score can shift slightly upward rather than down. It does not lower the Score. ShieldLabs only surfaces the anonymity signals and the Risk Score. Your own code still owns whether to allow, challenge, review, or block.

Verify it works

After deploying your policy:

Load a page with the snippet

Open a page where the snippet runs and open your browser dev tools Console.

Check for CSP violations

A blocked host shows a Refused to load or Refused to connect error naming the directive and the host. If you see one, add that host to the directive it names.

Confirm the snapshot posted

In the Network tab, confirm a request to rest.shieldlabs.ai succeeded. Once it does, the server scores the visit and delivers your webhook.

Add the snippet: the HTML and framework install methods these directives support.
API keys: the public key that goes in the snippet URL.
Webhooks: where the score and signals arrive after the snapshot posts.

Getting started

Features

Frontend

Backend

Billing and usage

Security and privacy

Troubleshooting

Resources

Support

Legal

Content Security Policy

Required directives

What each host is for

Inline scripts: HTML method vs framework method

Full-header examples

A very strict CSP can skip the local-network check

Verify it works

​Required directives

​What each host is for

​Inline scripts: HTML method vs framework method

​Full-header examples

​A very strict CSP can skip the local-network check

​Verify it works

​Related

Required directives

What each host is for

Inline scripts: HTML method vs framework method

Full-header examples

A very strict CSP can skip the local-network check

Verify it works

Related