Troubleshooting 4 min read Updated 24 April 2026

My embed is blocked by a Content Security Policy (CSP)

A Content Security Policy can block your Emberhop embed from loading if emberhop.com is not on the allowlist. This guide explains what to add and where to add it for the most common server setups.

My embed is blocked by a Content Security Policy (CSP)

A Content Security Policy is a security header that tells browsers which sources of scripts, images, and iframes are allowed to load on your page. If emberhop.com is not on your CSP allowlist, the browser will block the embed from loading and you will see a "Refused to load" error in the browser console.

This is not a bug in Emberhop. It is your CSP working as intended. The fix is to add emberhop.com to the relevant CSP directives.

What to add to your CSP

The Emberhop embed loads content from emberhop.com. You need to allow two directives:

  • script-src: allows the embed script to load and execute
  • frame-src: allows the viewer iframe to render inside your page

Add https://emberhop.com to both directives in your CSP header.

Nginx configuration

In your Nginx configuration file, update the Content-Security-Policy header in the relevant server block:

add_header Content-Security-Policy "
  default-src 'self';
  script-src 'self' https://emberhop.com;
  frame-src 'self' https://emberhop.com;
" always;

After editing the config, reload Nginx with nginx -s reload and test the page again.

Apache configuration

In your Apache configuration or .htaccess file:

Header set Content-Security-Policy "
  default-src 'self';
  script-src 'self' https://emberhop.com;
  frame-src 'self' https://emberhop.com;
"

Cloudflare

If you are using Cloudflare and have a Cloudflare Page Rule or Managed Transform that injects CSP headers, update that rule through the Cloudflare dashboard under the Security or Transform Rules sections. Add https://emberhop.com to your script-src and frame-src directives in that rule.

Good to know

If you are not sure whether your site has a CSP, open the page with the embed in Chrome, open developer tools (F12), go to the Network tab, and click on the main page request. Look at the Response Headers section for a "Content-Security-Policy" header.

Verifying the fix

After updating your CSP, open the page in a private browsing window to ensure your browser is not using a cached version of the old headers. Open the browser console. If the embed loads without any "Refused to load" errors, the CSP change worked. If you still see errors, check that the header change has been applied to all server instances and that your CDN or reverse proxy is not caching the old header values.

← All articles