title: Content Security Policy “Refused to execute inline event handler” error
body: <p>I'm trying to mitigate XSS attacks by setting the Content-Security-Policy header but Chrome keeps throwing an error:</p>
  
  <blockquote>
    <p>Refused to execute inline event handler because it violates the following Content Security Policy directive: "script-src 'self' 'nonce-Njg3MGUxNzkyMjViNDZkN2I3YTM3MDAzY2M0MjUxZGEzZmFhNDU0OGZjNDExMWU5OTVmMmMwMTg4NTA3ZmY4OQ=='". Either the 'unsafe-inline' keyword, a hash ('sha256-...'), or a nonce ('nonce-...') is required to enable inline execution.</p>
  </blockquote>
  
  <p>I tried setting the nonce in <code>&lt;script nonce="Njg3MGUxNzkyMjViNDZkN2I3YTM3MDAzY2M0MjUxZGEzZmFhNDU0OGZjNDExMWU5OTVmMmMwMTg4NTA3ZmY4OQ==" href="main.js"&gt;&lt;/script&gt;</code> but it does not worked.</p>
  
  <p>Here's my <code>Content-Security-Policy</code> header:</p>
  
  <pre><code>default-src 'none'; 
  script-src 'self' 'nonce-NjJjN2E5YjA0ZDJhNDlhZjlhMDFmZjQzMjE4YzhmMTAzOWNjZjVjMGZjNDIxMWU5YWIyNGMwMTg4NTA3ZmY4OQ=='; 
  connect-src 'self' https://vimeo.com; 
  img-src 'self'; 
  style-src 'self' 'unsafe-inline' https://fonts.googleapis.com; 
  font-src 'self' https://fonts.gstatic.com; 
  media-src 'self' http://player.vimeo.com; 
  frame-src 'self' http://player.vimeo.com;
  </code></pre>
  
  <p>I don't like setting the <code>script-src</code> as <code>unsafe-inline</code>, as it voids the used of Content-Security-Policy</p>