App

Security

Content Security Policy

A Content Security Policy (CSP) is a security standard that helps prevent cross-site scripting (XSS), clickjacking, and other code injection attacks by specifying which sources of content are allowed to load on your page. If your application uses a CSP, you will need to add the Monocle domains to your policy for the script to function correctly.

Required directives

Monocle requires the following CSP directives:

DirectiveValue
script-srchttps://*.mcl.io
connect-srchttps://*.mcl.io wss://*.mcl.io

Example

You can add CSP headers directly in your HTML using a <meta> tag. Merge the Monocle directives with any existing directives in your policy.

<meta
http-equiv="Content-Security-Policy"
content="script-src 'self' https://*.mcl.io; connect-src 'self' https://*.mcl.io wss://*.mcl.io;"
/>

Verifying your CSP

After updating your policy, verify that Monocle is loading correctly:

  1. Open your browser's developer tools and check the Console tab for any CSP violation errors.
  2. Look for errors mentioning mcl.io — these indicate that the directives have not been applied correctly.
  3. In the Network tab, confirm that requests to *.mcl.io are completing successfully.