Content Security Policy (CSP)

Content Security Policy (CSP) is a crucial security feature that helps protect web applications against various types of attacks, such as cross-site scripting (XSS) and data injection. This guide explores the principles of CSP, its key directives, and provides examples to assist developers in implementing a robust security policy.

Understanding CSP

Definition: CSP is a security standard that mitigates the risk of XSS attacks by controlling which resources a web page is allowed to load. It defines a set of rules that browsers follow to determine which content is safe to execute.

Key Objectives:

Prevent inline script execution.
Restrict the loading of external resources.
Mitigate the risk of data injection attacks.

Implementing CSP

Setting the CSP Header: Include the CSP header in your web server's HTTP response to instruct the browser on the security policies to enforce.

Example CSP Header:

Content-Security-Policy: default-src 'self';

CSP Directives

default-src: Specifies the default source for content that is not explicitly specified by other directives.

Example:

Content-Security-Policy: default-src 'self' https://trusted-scripts.com;

script-src: Controls the sources from which scripts can be executed, mitigating XSS attacks.

Example:

Content-Security-Policy: script-src 'self' https://trusted-scripts.com;

style-src: Defines the allowed sources for stylesheets.

Example:

Content-Security-Policy: style-src 'self' https://trusted-styles.com;

Nonce and Hash

nonce: A cryptographic nonce (number used once) that associates a specific script or style tag with a specific CSP policy.

Example:

<script nonce="randomly_generated_nonce">
  // Inline script content
</script>

sha256: Allows specifying the SHA-256 hash of an inline script or style, ensuring that only scripts with a matching hash are executed.

Example:

Content-Security-Policy: script-src 'sha256-randomly_generated_sha256_hash';

Reporting CSP Violations

report-uri: Specifies a URI to which the browser sends reports about policy violations.

Example:

Content-Security-Policy: report-uri /csp-report-endpoint;

report-to: An alternative to report-uri, enabling the use of Reporting API. Reports are sent to an endpoint defined using the report-to directive.

Example:

Content-Security-Policy: report-to csp-endpoint;

CSP in Meta Tag

Setting CSP in HTML: CSP can also be set using a meta tag within the HTML document.

Example Meta Tag:

<meta http-equiv="Content-Security-Policy" content="default-src 'self'">

Strict-Dynamic and Unsafe Inline

strict-dynamic: Allows dynamic script execution for trusted scripts, helping to mitigate issues related to strict CSP policies.

unsafe-inline: Permits the use of inline scripts and styles. However, it is generally discouraged due to security risks.

Example:

Content-Security-Policy: script-src 'self' 'strict-dynamic';

Browser Compatibility

Vendor Prefixes: Some CSP features may require vendor prefixes for compatibility across browsers. For example, using both Content-Security-Policy and X-Content-Security-Policy.

Example:

Content-Security-Policy: script-src 'self'; X-Content-Security-Policy: script-src 'self';

Conclusion

CSP is a powerful tool for enhancing the security of web applications by controlling the sources from which content is loaded. By understanding and implementing CSP directives effectively, developers can create a robust security policy that significantly reduces the risk of XSS attacks and enhances the overall resilience of their web applications against various security threats.

Web Security Introduction