Missing content security policy

Moderate effort

Add a Content-Security-Policy (CSP) HTTP response header to every page to block unauthorized scripts, styles, and resources from loading in your visitors' browsers.

What it is

A Content Security Policy (CSP) is an instruction you send to your visitors' web browsers, embedded in a special HTTP header, that tells the browser exactly which sources of scripts, images, styles, fonts, and other content it is allowed to load on your site. Think of it as a strict guest list at a nightclub door: anything not on the list gets turned away. Without a CSP header, the browser will happily load resources from anywhere — including malicious scripts injected by attackers. Your site currently sends no CSP header at all, which means that protection layer is completely absent.

Why it matters

Without a CSP, your store is significantly more vulnerable to Cross-Site Scripting (XSS) attacks — one of the most common ways attackers steal customer data, hijack sessions, or install payment-skimming code (like Magecart) directly in your shoppers' browsers. A successful XSS attack can expose customers' credit card numbers, passwords, and personal information, leading to chargebacks, fines under GDPR/CCPA, PCI-DSS violations, and severe reputational damage. Google also considers site security as a ranking signal, so a visibly compromised site can lose organic search rankings fast. Adding a CSP is recognized by OWASP as a critical defense-in-depth control against injection attacks (A03:2021).

How to fix it

  1. Audit your site to inventory every external domain your pages legitimately load resources from (scripts, styles, fonts, images, frames, analytics, payment widgets, CDNs, etc.) — browser DevTools Network tab is ideal for this.
  2. Start in report-only mode: deploy the header as Content-Security-Policy-Report-Only with a permissive policy plus a report-uri endpoint so you can see violations without breaking anything for real users.
  3. Review violation reports, identify any legitimate sources that were blocked, and add them to your allowlist directives (e.g., script-src, style-src, img-src, font-src, connect-src, frame-src).
  4. Harden the policy: at minimum set default-src 'self'; script-src 'self' [your-trusted-cdn]; object-src 'none'; base-uri 'self'; — avoid 'unsafe-inline' and 'unsafe-eval' in script-src whenever possible by moving inline scripts to external files or using nonces/hashes.
  5. Switch the header from Content-Security-Policy-Report-Only to Content-Security-Policy once you are confident no legitimate resources are being blocked.
  6. Verify the header is present and correct using browser DevTools (Network tab → select any page response → Headers), or a tool like securityheaders.com.

Fix it on your platform

Pick your platform for the exact steps.

How to fix missing content security policy on Shopify
  1. Shopify does not allow arbitrary HTTP response headers to be set from the admin UI for storefront pages.
  2. Install a Shopify app such as 'EasyCSP' or 'CSP Manager' from the Shopify App Store, which injects the CSP header via a Shopify Proxy or middleware layer.
  3. Alternatively, if you use Shopify with a custom Oxygen / Hydrogen (headless) front-end, set the CSP header inside your Remix/Next.js server response headers in the loader or server entry file.
  4. For theme-level partial mitigation (not a true HTTP header), you can add a <meta http-equiv='Content-Security-Policy'> tag inside the <head> of your theme.liquid file (Online Store → Themes → Edit Code → layout/theme.liquid), but note that meta-tag CSPs do not cover all directives (e.g., frame-ancestors is ignored) and are weaker than HTTP headers.
  5. The most robust Shopify approach is to route traffic through Cloudflare (free plan available) and set the CSP as a Cloudflare Transform Rule (see Cloudflare entry below).
Full Shopify guide →Official Shopify docs ↗
How to fix missing content security policy on Shopify Plus
  1. Same options as Shopify above apply.
  2. Shopify Plus merchants using Cloudflare for Enterprise or a custom reverse proxy have full control: configure the CSP header at the CDN/proxy layer.
  3. For Hydrogen/Oxygen storefronts: open your server.ts (or entry.server.tsx) file, locate the handleRequest function, and add the Content-Security-Policy header to the Response object before returning it.
Full Shopify Plus guide →Official Shopify Plus docs ↗
How to fix missing content security policy on WooCommerce
  1. Install the free 'HTTP Headers' plugin by BTC (available on WordPress.org plugin repository) or the 'Headers Security Advanced & HSTS WP' plugin.
  2. In WordPress admin, go to Settings → HTTP Headers (or the plugin's menu item), find the Content-Security-Policy field, and enter your policy string.
  3. Alternatively, add the header via your theme's functions.php or a custom plugin using the send_headers action hook: add_action('send_headers', function(){ header("Content-Security-Policy: default-src 'self'; script-src 'self'; object-src 'none'; base-uri 'self';"); });
  4. If your host gives you access to Apache, add the header in .htaccess: Header set Content-Security-Policy "default-src 'self'; script-src 'self'; object-src 'none';"
  5. If your host uses Nginx, add add_header Content-Security-Policy "default-src 'self'; script-src 'self'; object-src 'none';" always; inside the relevant server {} block in your Nginx config.
  6. Verify in browser DevTools → Network → select a page → Response Headers.
Full WooCommerce guide →Official WooCommerce docs ↗
How to fix missing content security policy on BigCommerce
  1. BigCommerce does not expose arbitrary HTTP response header settings in the merchant admin.
  2. The recommended approach is to place BigCommerce behind Cloudflare (free or paid) and configure the CSP as a Cloudflare HTTP Response Headers Transform Rule: Cloudflare Dashboard → your domain → Rules → Transform Rules → Modify Response Headers → Add header → Name: Content-Security-Policy → Value: your policy string.
  3. For headless BigCommerce storefronts (Next.js, Gatsby, etc.), set the header in next.config.js (headers() function) or your server middleware.
  4. As a partial fallback, add a <meta http-equiv='Content-Security-Policy' content='...'> tag inside your Stencil theme's base.html template (Storefront → My Themes → Edit Theme Files → templates/layout/base.html), understanding that this is weaker than an HTTP header.
Full BigCommerce guide →Official BigCommerce docs ↗
How to fix missing content security policy on Adobe Commerce (Magento)
  1. Adobe Commerce has native CSP support (introduced in Magento 2.3.5+).
  2. In the Admin panel go to Stores → Configuration → Security → Content Security Policy.
  3. Set 'CSP Mode' to 'Restrict Mode' (enforced) — start with 'Report Only Mode' to gather violations first.
  4. Add your trusted domains for each directive (script-src, style-src, img-src, etc.) in the respective fields.
  5. To add additional directives or fine-tune, edit app/etc/config.php or create a csp_whitelist.xml file inside your custom module's etc/ directory following the Magento CSP whitelist XML schema.
  6. Deploy the changes and verify the header appears in browser DevTools.
Full Adobe Commerce (Magento) guide →Official Adobe Commerce (Magento) docs ↗
How to fix missing content security policy on Magento Open Source
  1. Same as Adobe Commerce above — native CSP configuration is available from version 2.3.5+.
  2. Go to Stores → Configuration → Security → Content Security Policy in the Admin panel.
  3. Use Report Only mode first, then switch to Restrict (enforce) mode after reviewing violation logs.
  4. Add trusted domains per directive in the UI, or use a module-level csp_whitelist.xml for programmatic control.
Full Magento Open Source guide →Official Magento Open Source docs ↗
How to fix missing content security policy on Wix
  1. Wix does not currently allow custom HTTP response headers on standard Wix sites.
  2. For Wix Studio / custom domains using a reverse proxy or Cloudflare, add the CSP header at the proxy/CDN layer (see Cloudflare approach).
  3. As a partial measure, Wix Velo (developer mode) lets you inject a <meta http-equiv='Content-Security-Policy'> tag into the page <head> via the 'Custom Code' feature: go to Settings → Custom Code → Add Code to Head, and paste the meta tag. Note this is weaker than an HTTP header.
  4. Raise this requirement with Wix Support or vote on Wix Feature Requests, as custom HTTP header support is a frequently requested feature.
Full Wix guide →Official Wix docs ↗
How to fix missing content security policy on Wix Studio
  1. Wix Studio has the same HTTP header limitations as standard Wix.
  2. Use the Head Custom Code area (site Settings → Custom Code → Head) to add a <meta http-equiv='Content-Security-Policy'> tag as a partial measure.
  3. Route traffic through Cloudflare to set the real HTTP header at the CDN layer.
Full Wix Studio guide →Official Wix Studio docs ↗
How to fix missing content security policy on Squarespace
  1. Squarespace does not allow custom HTTP response headers.
  2. Add a partial CSP via Settings → Advanced → Code Injection → Header field: paste a <meta http-equiv='Content-Security-Policy' content='default-src self; object-src none;'> tag. This only covers HTML pages, not all resource types, and some directives are ignored in meta-tag mode.
  3. For stronger enforcement, route your Squarespace site through Cloudflare and add the CSP as a Cloudflare Transform Rule on HTTP responses.
Full Squarespace guide →Official Squarespace docs ↗
How to fix missing content security policy on Webflow
  1. Webflow does not support custom HTTP response headers on its hosting.
  2. Go to Project Settings → Custom Code → Head Code and add a <meta http-equiv='Content-Security-Policy' content='default-src self; object-src none;'> tag as a partial measure.
  3. For full header support, export your Webflow site and host it on a server you control (Netlify, Vercel, AWS), or route Webflow through Cloudflare and set the header via a Transform Rule.
  4. On Netlify: add a netlify.toml file with [[headers]] for /* and add Content-Security-Policy to the [headers.values] block.
Full Webflow guide →Official Webflow docs ↗
How to fix missing content security policy on WordPress.org
  1. Install the 'HTTP Headers' plugin or 'Headers Security Advanced & HSTS WP' from the WordPress plugin repository.
  2. Configure the Content-Security-Policy header value in the plugin's settings page.
  3. Alternatively, add directly via functions.php: add_action('send_headers', function(){ header("Content-Security-Policy: default-src 'self'; script-src 'self'; object-src 'none'; base-uri 'self';"); });
  4. Or set in .htaccess (Apache): Header always set Content-Security-Policy "default-src 'self'; script-src 'self'; object-src 'none';"
  5. Or in Nginx config: add_header Content-Security-Policy "default-src 'self'; script-src 'self'; object-src 'none';" always;
Full WordPress.org guide →Official WordPress.org docs ↗
How to fix missing content security policy on Headless / Custom (I build in code)
  1. Set the Content-Security-Policy header in your server's HTTP response for every route.
  2. Express.js: use the 'helmet' npm package — app.use(helmet.contentSecurityPolicy({ directives: { defaultSrc: ["'self'"], scriptSrc: ["'self'"], objectSrc: ["'none'"], baseUri: ["'self'"] } }));
  3. Next.js: add the header in next.config.js inside the headers() async function, or set it in middleware.ts using the NextResponse API.
  4. Nginx: add_header Content-Security-Policy "default-src 'self'; script-src 'self'; object-src 'none'; base-uri 'self';" always; in your server {} block.
  5. Apache: Header always set Content-Security-Policy "default-src 'self'; script-src 'self'; object-src 'none'; base-uri 'self';" in .htaccess or VirtualHost config.
  6. Cloudflare Workers / Pages: set the header inside the fetch handler Response constructor or via _headers file.
Full Headless / Custom (I build in code) guide →Official Headless / Custom (I build in code) docs ↗
How to fix missing content security policy on PrestaShop
  1. Add the CSP header in your .htaccess file (Apache): Header always set Content-Security-Policy "default-src 'self'; script-src 'self'; object-src 'none'; base-uri 'self';"
  2. For Nginx servers, add add_header Content-Security-Policy "..." always; in the server block.
  3. Alternatively, install a PrestaShop security module such as 'Security Headers' from the PrestaShop Marketplace.
  4. Start in Report-Only mode first to avoid breaking legitimate third-party scripts loaded by PrestaShop modules.
Full PrestaShop guide →Official PrestaShop docs ↗
How to fix missing content security policy on OpenCart
  1. Edit your .htaccess file (Apache) and add: Header always set Content-Security-Policy "default-src 'self'; script-src 'self'; object-src 'none'; base-uri 'self';"
  2. For Nginx, add the add_header directive in your OpenCart server block.
  3. Alternatively, modify system/startup.php or a custom controller to call header() before any output is sent.
  4. Use Report-Only mode initially, since OpenCart admin and extensions commonly use inline scripts.
Full OpenCart guide →Official OpenCart docs ↗
How to fix missing content security policy on Drupal
  1. Install the 'Security Kit' (seckit) Drupal module from drupal.org.
  2. Go to Admin → Configuration → Security → Security Kit.
  3. Enable Content Security Policy and fill in the directive fields (default-src, script-src, object-src, etc.).
  4. Enable 'Report Only' mode first, review Drupal's watchdog logs for violations, then switch to enforce mode.
Full Drupal guide →Official Drupal docs ↗
How to fix missing content security policy on Joomla
  1. Go to System → Global Configuration → Server tab → Content Security Policy (Joomla 4+ has a built-in CSP field).
  2. Enter your policy string in the Content Security Policy field and set the mode to 'Enforce'.
  3. Alternatively, use the .htaccess file: Header always set Content-Security-Policy "default-src 'self'; script-src 'self'; object-src 'none';"
  4. Install a Joomla security extension such as 'RSFirewall!' or 'Akeeba Admin Tools' for a UI-driven approach.
Full Joomla guide →Official Joomla docs ↗

Does your site have this issue?

Run a free SEOLZ scan to find missing content security policy — and every other issue — across your whole site in minutes.

Scan my site free

Frequently asked questions

What is Missing content security policy?

A Content Security Policy (CSP) is an instruction you send to your visitors' web browsers, embedded in a special HTTP header, that tells the browser exactly which sources of scripts, images, styles, fonts, and other content it is allowed to load on your site. Think of it as a strict guest list at a nightclub door: anything not on the list gets turned away. Without a CSP header, the browser will happily load resources from anywhere — including malicious scripts injected by attackers. Your site currently sends no CSP header at all, which means that protection layer is completely absent.

Why does missing content security policy matter?

Without a CSP, your store is significantly more vulnerable to Cross-Site Scripting (XSS) attacks — one of the most common ways attackers steal customer data, hijack sessions, or install payment-skimming code (like Magecart) directly in your shoppers' browsers. A successful XSS attack can expose customers' credit card numbers, passwords, and personal information, leading to chargebacks, fines under GDPR/CCPA, PCI-DSS violations, and severe reputational damage. Google also considers site security as a ranking signal, so a visibly compromised site can lose organic search rankings fast. Adding a CSP is recognized by OWASP as a critical defense-in-depth control against injection attacks (A03:2021).

How do I fix missing content security policy?

Add a Content-Security-Policy (CSP) HTTP response header to every page to block unauthorized scripts, styles, and resources from loading in your visitors' browsers.

Related Security (OWASP) issues