child-src
Thechild-src directive defines the valid sources for web workers and nested browsing contexts loaded using elements such as <frame> and <iframe>. It's a crucial CSP directive that helps prevent malicious code execution through workers and frames.
Recommended Values
'self' Allows the resource to be loaded and executed
https://subdomain.domain.com/path Allows the resource to be loaded and executed
'none' No sources are allowed
Recommended child-src configuration
Content-Security-Policy: child-src 'none';Tips & Tricks
If child-src is not defined, the default-src directive will be used as fallback.
Use 'self' as a baseline and add specific trusted domains as needed.
Consider using frame-src for frame-specific controls and worker-src for worker-specific controls in modern browsers.
Avoid using broad permissions like '*' as it can expose your application to security risks.
Possible Values
'none': No sources are allowed'self': Only resources from the same origin are allowed- URLs: Specific domains or paths (e.g.,
https://trusted-domain.com) - Schemes: Protocol schemes (e.g.,
https:,http:,wss:,ws:) - Wildcards:
*for subdomains (e.g.,*.example.com) - ⚠️
*: Allows all origins - ⚠️
blob:: Allow blob: URIs - ⚠️
filesystem:Allow filesystem: URIs
Example Configurations
Example policy with multiple sources
CSP Header allowing same-origin and specific domain
Content-Security-Policy: child-src 'self' https://example.com;Allowed
<!-- allowed by 'self' -->
<iframe src="/local-frame.html"></iframe>
<!-- allowed by https://example.com -->
<iframe src="https://example.com/external-frame.html"></iframe>
<!-- allowed by 'self' -->
<script>
var worker = new Worker('/js/worker.js');
</script>Blocked
<!-- blocked as https://malicious.website.com is not in the allowed sources -->
<iframe src="https://malicious.website.com"></iframe>
<!-- blocked as data: URI is not allowed -->
<script>
var blockedWorker = new Worker("data:application/JavaScript, ...");
</script>Additional Information
- The
child-srcdirective is being replaced by more specific directives in modern browsers - Use
frame-srcfor controlling frame sources - Use
worker-srcfor controlling worker sources - If neither
frame-srcnorworker-srcis specified,child-srcacts as a fallback - Consider implementing additional security measures like sandbox attributes for iframes
Related Resources
External Articles
- MDN Web Docs: child-src
- OWASP: Content Security Policy Cheat Sheet
- Google Web Fundamentals: Content Security Policy