> ## Documentation Index
> Fetch the complete documentation index at: https://docs.fingerprint.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Configure Content Security Policy (CSP)

If you have a [Content Security Policy](https://developer.mozilla.org/en-US/docs/Web/HTTP/CSP) on your website, it can block the JavaScript agent. JavaScript agent will throw a special error in this case:

```javascript JavaScript theme={"theme":"github-dark-dimmed"}
const fpPromise = FingerprintJS.load({ apiKey: 'PUBLIC_API_KEY' })

try {
  const fp = await fpPromise
  await fp.get()
} catch (error) {
  if (error.message === FingerprintJS.ERROR_CSP_BLOCK) {
    // Your CSP blocks the JavaScript agent
    // Can be thrown by both "load" and "get"
  }
}
```

Add the following directives to your policy to unblock the JavaScript agent:

<CodeGroup>
  ```text CDN installation theme={"theme":"github-dark-dimmed"}
  script-src https://fpjscdn.net;
  connect-src https://api.fpjs.io https://*.api.fpjs.io;
  ```

  ```text NPM installation theme={"theme":"github-dark-dimmed"}
  script-src https://fpnpmcdn.net;
  connect-src https://api.fpjs.io https://*.api.fpjs.io;
  ```
</CodeGroup>

If you already have such directives in your policy, add the given addresses to the directives. An example of combining a couple of policies:

<CodeGroup>
  ```text Current policy theme={"theme":"github-dark-dimmed"}
  default-src 'self';
  connect-src 'self' example.com;
  style-src 'self' 'unsafe-inline';
  ```

  ```text JavaScript agent policy theme={"theme":"github-dark-dimmed"}
  connect-src https://api.fpjs.io https://*.api.fpjs.io;
  ```

  ```text Combined policy theme={"theme":"github-dark-dimmed"}
  default-src 'self';
  connect-src 'self' example.com https://api.fpjs.io https://*.api.fpjs.io;
  style-src 'self' 'unsafe-inline';
  ```
</CodeGroup>

An example of an HTML code with a Content Security Policy that lets JavaScript agent work:

<CodeGroup>
  ```html HTML theme={"theme":"github-dark-dimmed"}
  <!DOCTYPE html>
  <html>
    <head>
      <meta http-equiv="Content-Security-Policy" content="
        default-src 'self';
        script-src 'self' https://fpjscdn.net;
        connect-src 'self' https://api.fpjs.io https://*.api.fpjs.io;
      ">
    </head>
    ...
  </html>
  ```
</CodeGroup>

## Automatic updates

The default endpoints used by JavaScript agent may change with automatic updates. JavaScript agent uses fallback endpoints to evade ad blockers that block JavaScript agent. The fallback endpoints are changed when they get to ad blocker lists. So you should check this guide from time to time for up-to-date CSP recommendations to ensure your CSP doesn't block the fallback endpoints.

The primary endpoint (`https://api.fpjs.io` or `https://*.api.fpjs.io`) is never changed automatically to prevent JavaScript agent from being blocked by your CSP.

## Subdomain setup

If you've set up JavaScript agent to use [a custom endpoint](/docs/v3/custom-subdomain-setup), add the endpoint to the policy instead of the built-in endpoint. For example, if your custom endpoint is `https://fp.yourdomain.com`, your policy is:

<CodeGroup>
  ```text Text theme={"theme":"github-dark-dimmed"}
  script-src https://fpjscdn.net;
  connect-src https://fp.yourdomain.com;
  ```
</CodeGroup>
