What does connect-src control?

connect-src controls which URLs your page can make network requests to using fetch, XHR, WebSocket, and EventSource. If an API call or WebSocket connection is blocked by CSP, connect-src is the directive to update.

Why does my API call work in development but fail in production?

Your development environment may not have a CSP header, or may have a more permissive one. Production CSP is often stricter. Check the browser console for the exact blocked URL and add it to connect-src.

CSP Error

CSP: Refused to Connect

Last updated: April 2026

Browser Console Error

Refused to connect to 'https://api.yoursite.com/data' because it violates the following Content Security Policy directive: "connect-src 'self'".

Your Content Security Policy's connect-src directive is blocking a network request. This affects fetch(), XMLHttpRequest, WebSocket, EventSource, and navigator.sendBeacon() calls.

Scan your live CSP →

Fix — add the API URL to connect-src

# Before
Content-Security-Policy: default-src 'self'

# After — add your API domain
Content-Security-Policy: default-src 'self'; connect-src 'self' https://api.yoursite.com

Common connect-src fixes

External API calls

connect-src 'self' https://api.yoursite.com https://api.stripe.com;

WebSocket connections

# Use wss:// for secure WebSocket (not https://)
connect-src 'self' wss://ws.yoursite.com;

Google Analytics and Tag Manager

connect-src 'self' https://www.google-analytics.com https://analytics.google.com https://region1.google-analytics.com;

Sentry error reporting

connect-src 'self' https://*.sentry.io;

Hotjar / analytics tools

connect-src 'self' https://*.hotjar.com wss://*.hotjar.com;

Wildcard subdomains

# Allow all subdomains of yoursite.com
connect-src 'self' https://*.yoursite.com;

# Note: wildcards only match one level
# https://*.yoursite.com matches api.yoursite.com
# but NOT api.v2.yoursite.com

Development vs production

# Development — allow localhost
connect-src 'self' http://localhost:8000 ws://localhost:8000;

# Production
connect-src 'self' https://api.yoursite.com wss://ws.yoursite.com;