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

# Setting up your CSP for daily-js

> What CSP directives are required to work with `daily-js`.

## What is a Content Security Policy (CSP)?

A [Content Security Policy (CSP)](https://developer.mozilla.org/en-US/docs/Web/HTTP/CSP) contains data about what origins can be used to load and execute various resources inside your web application.

A CSP essentially serves as an allowlist. Developers can define a CSP in their web applications to minimize the vector of attack against the app and its visitors.

For example, you can specify a [`script-src`](https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Content-Security-Policy/script-src) directive to dictate which sources the user agent is allowed to execute JavaScript from while using your app.

If you make use of a CSP in your web application, this guide will summarize the adjustments you might need to make to have it work with `daily-js`.

## Enabling the CSP

The CSP is enabled in one of two ways:

* By adding a `Content-Security-Policy` [HTTP response header](https://developer.mozilla.org/en-US/docs/Glossary/Response_header)
* By adding a `Content-Security-Policy` [`meta`](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/meta) element to the site header

## Daily Prebuilt

If using [Daily Prebuilt](/docs/prebuilt), a minimal functional CSP can look like this:

```html theme={null}
<meta
  http-equiv="Content-Security-Policy"
  content="default-src 'self'; frame-src 'self' https://*.daily.co; script-src 'self' https://unpkg.com/@daily-co/daily-js blob:; worker-src 'self';"
/>
```

The above policy contains two Daily-specific directives:

* It allows the user agent to create an iframe with the Daily domain as the source, via the [`frame-src`](https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Content-Security-Policy/frame-src) directive.
* It allows `daily-js` to be loaded and executed from [Unpkg](https://unpkg.com/@daily-co/daily-js) via the [`script-src`](https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Content-Security-Policy/script-src) directive.

<Note>
  If you are loading `daily-js` from a local source or somewhere other than Unpkg, you'll need to adjust the origin in `script-src` accordingly. For example, if you are using npm and bundling the library into your app, only the `'self'` origin should be needed.
</Note>

## Custom call object

If using [call object mode](/docs/daily-js), the CSP will require some different allowances. A minimal call object CSP can be defined as follows:

```html theme={null}
<meta
  http-equiv="Content-Security-Policy"
  content="
    default-src 'self';
    frame-src 'self';
    script-src 'self' https://unpkg.com/@daily-co/daily-js 'unsafe-eval' blob:;
    connect-src https://*.daily.co https://*.pluot.blue https://*.banuba.cloud wss:;
    worker-src 'self' blob:;
  "
/>
```

The above policy allows:

* Loading `daily-js` from UNPKG (only needed if you're loading `daily-js` via a script tag)
* Loading relevant resources from Daily domains
* Connecting to Daily calls
* Connecting to Banuba, Daily's video processing provider (only needed if you're using [virtual backgrounds or background blur](/reference/daily-js/instance-methods/update-input-settings#video-processor))

### Avoiding the `'unsafe-eval'` requirement

Call object mode in `daily-js` uses a code path that loads the call object bundle from Daily's CDN and makes a `Function()` call to execute it, which results in an `eval`.

You can create the call object via a code path that does *not* require `'unsafe-eval'`:

1. Enable this alternative with the `avoidEval` property:

```javascript theme={null}
const call = Daily.createCallObject({
  dailyConfig: {
    avoidEval: true,
  },
});
```

2. Replace `'unsafe-eval'` in your `script-src` directive with:

* `https://*.daily.co`
* `'wasm-unsafe-eval'` (only needed if you're using [virtual backgrounds or background blur](/reference/daily-js/instance-methods/update-input-settings#video-processor))

## CSP changes for noise cancellation

When using Krisp noise cancellation with Daily, your CSP must include `blob:` in the `script-src` directive. Krisp creates a worker using a blob: URL, and this ensures the browser permits loading such scripts. The CSP examples above already include this.

## Wrapping up

Please [contact us](https://www.daily.co/contact) if you have any questions.
