Introduction

https://devco.re/blog/2014/04/08/security-issues-of-http-headers-2-content-security-policy/

PHP Example:

header("Content-Security-Policy: default-src *; img-src *; frame-src https:; script-src https: 'self' 'nonce-1234'; style-src https: 'self' 'nonce-1234'");

Test Results

• ‘unsafe-inline’
  This source doesn’t work anymore. Inline scripts will still be blocked.
• It seems ‘nonce’ is the best way to solve inline script issue

<!-- Global site tag (gtag.js) - Google Analytics -->
<script async src="https://www.googletagmanager.com/gtag/js?id=G-F1234"></script>
<script nonce="{{ $nonce }}">
  window.dataLayer = window.dataLayer || [];
  function gtag(){dataLayer.push(arguments);}
  gtag('js', new Date());

  gtag('config', 'G-F1234');
</script>

Reference

• https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Content-Security-Policy/script-src
• https://stackoverflow.com/questions/8502307/chrome-version-18-how-to-allow-inline-scripting-with-a-content-security-policy
• https://ithelp.ithome.com.tw/articles/10223568