Content Security Policy (CSP) Implementation

Introduction

Content Security Policy (CSP) is a security feature that helps to prevent a variety of attacks such as Cross-Site Scripting (XSS) and data injection attacks. By defining a set of rules for what content can be loaded and executed on a web page, CSP enhances the security posture of web applications.

Benefits of CSP

  • Mitigation of XSS Attacks: CSP reduces the risk of XSS attacks by controlling which resources can be loaded and executed.
  • Prevention of Data Injection Attacks: By restricting the sources of scripts and styles, CSP helps to prevent attackers from injecting malicious code.
  • Improved Security Headers: CSP can work alongside other security headers (like X-Frame-Options and X-XSS-Protection) to create a layered security strategy.

Key Components of CSP

  1. Directives: These are the rules that specify which sources of content are allowed. Common directives include:
  2. default-src: The default policy for fetching resources such as scripts, images, and styles.
  3. script-src: Specifies valid sources for JavaScript.
  4. style-src: Specifies valid sources for stylesheets.
  5. img-src: Specifies valid sources for images.

  6. frame-src: Specifies valid sources for nested browsing contexts (iframes).

  7. Sources: Each directive can specify a list of sources, which can include:

  8. 'self': Allow content from the same origin.
  9. 'none': Disallow all content from loading.
  10. https://example.com: Allow content from a specific external source.

  11. data:: Allow inline data URLs.

  12. Policies: CSP can be implemented in two ways:

  13. Report Only Mode: This allows you to test your CSP without enforcing it. Violations will be reported but not blocked.
  14. Enforcing Mode: This actively blocks any content that violates the specified CSP.

Implementation Steps

  1. Define Your Policy: Analyze your application and determine what sources of content are necessary. Start with a restrictive policy and gradually allow more sources as needed.

  2. Add CSP Header: Implement the CSP by adding a Content-Security-Policy header in your HTTP response. For example: Content-Security-Policy: default-src 'self'; script-src 'self' https://trusted-scripts.com; img-src 'self' data:;

  3. Test Your Policy: Use the Report Only mode to test your policy without blocking resources. Monitor the reports to identify any legitimate content that may be blocked.

  4. Refine Your Policy: Based on the reports, adjust your policy to allow necessary content while maintaining security.

  5. Monitor and Update: Regularly review and update your CSP as your application evolves and new content sources are added.

Best Practices

  • Start with a Report-Only Policy: This allows you to identify potential issues without breaking functionality.
  • Avoid unsafe-inline and unsafe-eval: These allow inline scripts and evaluations, which can open the door to XSS attacks.

  • Use Nonce or Hashes for Inline Scripts: If you must use inline scripts, consider using nonces (random tokens) or hashes to allow specific scripts while blocking others.