CSP Blocked Inline Script — Content Security Policy Script Execution Error
About CSP Blocked Inline Script
Fix Content-Security-Policy blocking inline scripts and event handlers with 'Refused to execute inline script' errors in the browser console. This guide covers everything you need to know about this topic, including common causes, step-by-step solutions, and answers to frequently asked questions.
Here are the key things to understand: Content-Security-Policy (CSP) script-src directive controls which scripts can execute on the page. A strict CSP blocks inline scripts (script tags without src, onclick handlers, javascript: URLs). CSP prevents Cross-Site Scripting (XSS) by blocking script injection into the page. Nonces (per-request random values) or hashes allow specific inline scripts through the CSP. The error appears in the browser console: 'Refused to execute inline script because it violates CSP'. Understanding these fundamentals will help you diagnose and resolve this issue more effectively.
The most common reasons this occurs include: CSP script-src does not include 'unsafe-inline' and page uses inline scripts. Dynamic script injection (document.write, innerHTML with scripts) blocked by CSP. Third-party widget or analytics snippet using inline scripts blocked by the CSP policy. CSP nonce not matching the nonce attribute on the inline script tag. Identifying the root cause is the first step toward finding the right solution.
To resolve this, follow these recommended steps: Move inline scripts to external .js files and include them via script src (best practice). Use nonces: add 'nonce-randomValue' to CSP script-src and nonce='randomValue' to the script tag. Use hashes: compute SHA-256 of the inline script content and add 'sha256-hash' to CSP script-src. For inline event handlers (onclick, onload): move to addEventListener in an external JS file. As last resort: add 'unsafe-inline' to script-src (reduces CSP security significantly). If these steps do not resolve the issue, consider consulting additional resources or a qualified professional.
This article is part of our Browser Errors collection on Error Codes Wiki. We provide comprehensive, up-to-date information to help you find solutions quickly.
Quick Answer
Should I use unsafe-inline?
Avoid it if possible. 'unsafe-inline' allows any inline script to execute, which defeats CSP's XSS protection. Use nonces (generated per request) or hashes (computed from script content) to allow only specific inline scripts.
Overview
Fix Content-Security-Policy blocking inline scripts and event handlers with 'Refused to execute inline script' errors in the browser console.
Key Details
- Content-Security-Policy (CSP) script-src directive controls which scripts can execute on the page
- A strict CSP blocks inline scripts (script tags without src, onclick handlers, javascript: URLs)
- CSP prevents Cross-Site Scripting (XSS) by blocking script injection into the page
- Nonces (per-request random values) or hashes allow specific inline scripts through the CSP
- The error appears in the browser console: 'Refused to execute inline script because it violates CSP'
Common Causes
- CSP script-src does not include 'unsafe-inline' and page uses inline scripts
- Dynamic script injection (document.write, innerHTML with scripts) blocked by CSP
- Third-party widget or analytics snippet using inline scripts blocked by the CSP policy
- CSP nonce not matching the nonce attribute on the inline script tag
Steps
- 1Move inline scripts to external .js files and include them via script src (best practice)
- 2Use nonces: add 'nonce-randomValue' to CSP script-src and nonce='randomValue' to the script tag
- 3Use hashes: compute SHA-256 of the inline script content and add 'sha256-hash' to CSP script-src
- 4For inline event handlers (onclick, onload): move to addEventListener in an external JS file
- 5As last resort: add 'unsafe-inline' to script-src (reduces CSP security significantly)