Missing or weak Content-Security-Policy

What it is

CSP is a response header, for example Content-Security-Policy: default-src 'self'; script-src 'self'. The browser enforces it: scripts, styles, frames and connections from sources not on the list are blocked. It does not fix bugs in your code, but it limits what an attacker can do when one exists. Hosting platforms do not add a CSP for you, because only you know which services your app loads.

What can happen

Cross-site scripting is still one of the most common web bugs. With no CSP, a single injected script can read the session token from local storage, which is where many Supabase and Firebase apps keep it, and send it to another server. It can rewrite the page, show a fake login form or quietly make purchases. A strict CSP turns many of these attacks into a blocked request and an error in the console.

How Shypset checks it

This is a Public check: we read the response headers of your homepage, the same headers every visitor receives. We report:

• No Content-Security-Policy header at all.
• 'unsafe-inline' in script sources, which lets inline scripts run and removes most XSS protection.
• 'unsafe-eval', which allows eval() and similar functions.
• Wildcard sources such as * that allow scripts from any origin.
• Known bypasses: allowed hosts that serve user-controlled scripts or JSONP endpoints.

The same scan checks the rest of the security headers: HSTS, framing protection, X-Content-Type-Options, Referrer-Policy and Permissions-Policy.

How to fix it

Start with a policy in report-only mode (Content-Security-Policy-Report-Only) so nothing breaks while you see what it would block. List the third-party hosts you actually use: analytics, payment, fonts, your Supabase project. Replace inline scripts with files, or allow them by hash. When the console is quiet, switch the header to enforcing mode. Set it in vercel.json, netlify.toml, next.config or your server, then rescan.

Example finding

How the finding appears in a report, with its fix prompt.

Response headers of https://app.example.com/ contain no Content-Security-Policy

Our site sends no Content-Security-Policy. Add one in the hosting config (vercel.json headers) starting as Content-Security-Policy-Report-Only with default-src 'self', script-src 'self', and only the external hosts the app really uses (list them from the code). No unsafe-inline or unsafe-eval in script-src. Tell me how to switch it to enforcing mode once there are no violations.

Questions

Will a CSP break my app?

It can if you enforce it straight away. Use report-only mode first and add the sources you need.

Is a CSP with unsafe-inline better than none?

A little, for other resource types, but for scripts it removes most of the protection.