> For the complete documentation index, see [llms.txt](/llms.txt)

# Entrust Identity Verification Web SDK: common Content Security Policy (CSP) issues

## Start here

## Content Security Policy

In order to mitigate potential cross-site scripting issues, all modern browsers support a Content Security Policy (CSP). An incorrectly configured CSP can lead to the Web SDK not being able to render, incorrectly displaying the images captured during the flow or incorrectly loading styles. If the CSP is blocking some of the SDK functionalities, make sure you add the following snippet inside the `<head>` tag of your application.

The preferred way to define the CSP is to include it in the HTTP Response Header that delivers the document.

The `meta` tag recommendation is a fallback option to ensure that the appropriate directives are whitelisted, the minimum requirement to work with the Web SDK.

```html
<meta
  http-equiv="Content-Security-Policy"
  content="
  default-src 'self' https://sdk.onfido.com https://assets.onfido.com;
  connect-src 'self' https://api.onfido.com https://api.eu.onfido.com https://api.us.onfido.com https://api.ca.onfido.com wss://*.onfido.com;
"
/>
```

- `connect-src` restricts the URLs that can be loaded using script interfaces (for example, the Onfido ones).
- `default-src` serves as a fallback for the other fetch directives.

If `default-src` is not preferred, you must set each required directive as shown below:

```html
<meta
  http-equiv="Content-Security-Policy"
  content="
  script-src https://sdk.onfido.com https://assets.onfido.com;
  style-src https://sdk.onfido.com ;
  font-src https://sdk.onfido.com;
  connect-src https://api.onfido.com https://api.eu.onfido.com https://api.us.onfido.com https://api.ca.onfido.com wss://*.onfido.com;
  frame-src https://sdk.onfido.com;
"
/>
```

### Correct source values

If you are bootstrapping the SDK using inline javascript (for example, bootstrapping the Web SDK in native app using a webview component), you must add the `unsafe-inline` keyword value as well as `self` to the directives.

- `self`: `script-src 'self'` allows loading resources from the same origin (same scheme and domain name).
- `unsafe-inline`: `script-src 'unsafe-inline'` allows use of inline source elements such as the `style` attribute, `onclick`, or `script` tag bodies and javascript: URIs

```html
<meta
  http-equiv="Content-Security-Policy"
  content="
  default-src  https://sdk.onfido.com https://assets.onfido.com;
  connect-src  https://api.onfido.com https://api.eu.onfido.com https://api.us.onfido.com https://api.ca.onfido.com wss://*.onfido.com;
  script-src 'self' 'unsafe-inline' https://sdk.onfido.com https://assets.onfido.com;
"
/>
```

In general, CSP policies are varied across different organizations with some apps having more restrictions. This guide provides an overall insight into the most common CSP-related issues.
We recommend reading the Mozilla [Content-Security-Policy](https://developer.mozilla.org/en-US/docs/Web/HTTP/Reference/Headers/Content-Security-Policy) for more information and guidelines on how to implement your CSP directives and keywords in safe and clean way.