Content security policy (CSP) (fetch directives) is a https://www.w3.org/TR/CSP3/[W3C standard ] which is used by a server to specify, via a http header, the origins from where the browser is allowed to load resources. It can help to mitigate the risk of cross site scripting (XSS) attacks and reduce privileges used by an application. If the website doesn't define CSP header the browser will apply https://developer.mozilla.org/en-US/docs/Web/Security/Same-origin_policy[same-origin policy] by default.
In the above example, all resources are allowed from the website where this header is set and script resources fetched from example.com are also authorized:
<img src="selfhostedimage.png></script> <!-- will be loaded because default-src 'self'; directive is applied -->
<img src="http://www.example.com/image.png></script> <!-- will NOT be loaded because default-src 'self'; directive is applied -->
<script src="http://www.example.com/library.js></script> <!-- will be loaded because script-src ‘self ‘ http://www.example.comdirective is applied -->
<script src="selfhostedscript.js></script> <!-- will be loaded because script-src ‘self ‘ http://www.example.com directive is applied -->
<script src="http://www.otherexample.com/library.js></script> <!-- will NOT be loaded because script-src ‘self ‘ http://www.example.comdirective is applied -->
