title: CSP - allowing my own scripts from given directory
body: <p>I have read several articles about implementing Content-Security-Policy for website, but I still can't figure out how to put it together correctly for my site. Sorry if there is another thread about this, but so far I haven't found one that would help me solving my situation.</p>
  
  <p>I have plain HTML file and I use my own JavaScript to do some rendering on HTML canvas based on user's inpupt.</p>
  
  <p>I have .js files in "js" directory. Currently I am running my website in sub-directory, so I use relative and not absolute path to include them:</p>
  
  <pre><code>&lt;script type="text/javascript" src="js/wbsc-eval.js"&gt;&lt;/script&gt;
  &lt;script type="text/javascript" src="js/wbsc-global.js"&gt;&lt;/script&gt;
  &lt;script type="text/javascript" src="js/wbsc-input.js"&gt;&lt;/script&gt;
  &lt;script type="text/javascript" src="js/wbsc-output.js"&gt;&lt;/script&gt;
  </code></pre>
  
  <p>This is my CSP header:</p>
  
  <pre><code>&lt;meta http-equiv="Content-Security-Policy" content="default-src 'none'; child-src 'none'; object-src 'none'; style-src 'self' https://stackpath.bootstrapcdn.com; script-src 'self';"&gt;
  </code></pre>
  
  <p>It allows my own CSS + the Bootstrap one, but my JS is blocked:</p>
  
  <pre><code>Refused to execute inline event handler because it violates the following Content Security Policy directive: "script-src 'self'". Either the 'unsafe-inline' keyword, a hash ('sha256-...'), or a nonce ('nonce-...') is required to enable inline execution.
  </code></pre>
  
  <p>From what I have read, I thought <code>script-src 'self'</code> should allow scripts from the same site, but apparently it is not.</p>
  
  <p>I also tried to set an explicit URL, where my site is currently hosted, but I don't think this is the correct way, as it should be portable + it doesn't seem to work anyway.</p>
  
  <p>Is there some easy and straightforward way to do this? To allow an explicit set of my own scripts and ban everything else?</p>
  
  <p>Adding <code>'unsafe-inline'</code> worked, but I have heard it is quite like not having CSP at all and I also encountered some JS operations I was still disallowed to do in my scripts. I think I could count the SHA hash of my JS everytime and pass it to HTML header. But I am constantly changing the scripts during developing, so it doesn't look very convenient. And finally - if there is some easy mechanism for dynamic creating of nonces, I may think of using it. But for my purpose I don't think I need some robust framework, I am doing fine with one HTML + several JS files...</p>