Content Security Policy (CSP) in Cybersecurity - Cheat Sheet & Quick Revision

Recall & Review

beginner

What is Content Security Policy (CSP)?

Content Security Policy (CSP) is a security feature that helps prevent attacks like cross-site scripting (XSS) by controlling which resources a web page can load and execute.

beginner

How does CSP improve website security?

CSP restricts the sources of scripts, styles, images, and other content, so only trusted sources are allowed. This reduces the chance of malicious code running on the site.

intermediate

What is a 'directive' in CSP?

A directive is a rule in CSP that specifies what types of content can be loaded and from where. For example, 'script-src' controls which scripts can run.

beginner

What happens if a resource violates the CSP rules?

The browser blocks the resource from loading or running, protecting the user from potential attacks like malicious scripts.

intermediate

Name two common CSP directives and their purpose.

1. script-src: Controls which JavaScript sources are allowed.
2. img-src: Controls which image sources are allowed.

What is the main purpose of Content Security Policy (CSP)?

A To control which resources a web page can load and execute

B To speed up website loading times

C To encrypt user data on websites

D To manage user passwords securely

CSP helps improve security by controlling which resources can be loaded and run on a web page.

Which CSP directive controls which JavaScript files can run on a page?

A style-src

B img-src

C script-src

D connect-src

'script-src' directive specifies allowed sources for JavaScript.

If a script tries to load from an untrusted source not allowed by CSP, what happens?

A The script loads normally

B The browser blocks the script from running

C The browser asks the user for permission

D The script runs but with limited access

CSP blocks resources that violate its rules to protect users.

Which of these is NOT a benefit of using CSP?

A Preventing cross-site scripting attacks

B Reducing the risk of data injection

C Controlling resource loading sources

D Automatically fixing website bugs

CSP improves security but does not fix bugs automatically.

How is CSP usually delivered to the browser?

A Via HTTP response headers

B Through a special HTML tag

C By JavaScript code on the page

D Through browser extensions

CSP is commonly sent as HTTP headers from the server to the browser.

Explain what Content Security Policy (CSP) is and why it is important for web security.

Think about how websites can block harmful scripts.

Describe how CSP directives work and give examples of at least two directives.

Directives tell the browser what is allowed.

Practice

1. What is the main purpose of Content Security Policy (CSP) on a website?

easy

A. To store user passwords securely

B. To speed up the website loading time

C. To change the website's layout and design

D. To control which content the website is allowed to load

Solution

1. Step 1: Understand CSP's role in security

   CSP is designed to restrict what content (like scripts, images) a website can load to prevent harmful content.

2. Step 2: Compare options with CSP purpose

   Only controlling content loading matches CSP's main goal; speeding up or design changes are unrelated.

3. Final Answer:

   To control which content the website is allowed to load -> Option D

4. Quick Check:

   CSP controls content loading = A [OK]

Hint: CSP controls content loading to block harmful scripts [OK]

Common Mistakes:

• Confusing CSP with website speed optimization
• Thinking CSP manages website design
• Assuming CSP stores user data

2. Which HTTP header is used to set a Content Security Policy?

easy

A. X-Content-Type-Options

B. Content-Security-Policy

C. Strict-Transport-Security

D. Cache-Control

Solution

1. Step 1: Identify CSP header name

   The official header to set CSP rules is named Content-Security-Policy.

2. Step 2: Eliminate unrelated headers

   X-Content-Type-Options controls MIME sniffing, Strict-Transport-Security enforces HTTPS, and Cache-Control manages caching, none set CSP.

3. Final Answer:

   Content-Security-Policy -> Option B

4. Quick Check:

   CSP header = Content-Security-Policy [OK]

Hint: CSP header is exactly 'Content-Security-Policy' [OK]

Common Mistakes:

• Confusing CSP header with security headers like HSTS
• Using Cache-Control as CSP header
• Mixing up header names with similar security headers

3. Given this CSP directive:
Content-Security-Policy: script-src 'self' https://trusted.com;
Which script source is allowed to run on the website?

medium

A. Scripts only from https://trusted.com

B. Scripts from any website

C. Only scripts from the website itself and https://trusted.com

D. No scripts are allowed

Solution

1. Step 1: Understand the directive meaning

   The directive script-src 'self' https://trusted.com; means scripts can load from the same origin ('self') and from https://trusted.com.

2. Step 2: Analyze options against directive

   Only scripts from the website itself and https://trusted.com correctly states scripts allowed from the website itself and trusted.com; others are incorrect or too broad.

3. Final Answer:

   Only scripts from the website itself and https://trusted.com -> Option C

4. Quick Check:

   script-src 'self' + trusted.com = A [OK]

Hint: 'self' means own site; listed URLs are allowed too [OK]

Common Mistakes:

• Assuming all external scripts are allowed
• Ignoring the 'self' keyword meaning
• Thinking no scripts are allowed due to strictness

4. A website sets this CSP header:
Content-Security-Policy: default-src 'none'; img-src https://images.com;
Why might images from the website itself not load?

medium

A. Because default-src 'none' blocks all sources except those explicitly allowed

B. Because img-src allows images from all sources

C. Because the header syntax is incorrect

D. Because images are blocked by browser settings

Solution

1. Step 1: Understand default-src 'none'

   The directive default-src 'none' blocks all content sources unless specifically allowed.

2. Step 2: Analyze img-src directive

   Only images from https://images.com are allowed; images from the website itself are not allowed because 'self' is not included.

3. Final Answer:

   Because default-src 'none' blocks all sources except those explicitly allowed -> Option A

4. Quick Check:

   default-src 'none' blocks all except allowed = D [OK]

Hint: default-src 'none' blocks all except listed sources [OK]

Common Mistakes:

• Assuming img-src allows all images by default
• Thinking header syntax is wrong without checking directives
• Blaming browser settings instead of CSP rules

5. You want to allow scripts only from your own site and block inline scripts to prevent XSS attacks. Which CSP directive correctly achieves this?

hard

A. Content-Security-Policy: script-src 'self';

B. Content-Security-Policy: script-src 'self' 'unsafe-inline';

C. Content-Security-Policy: script-src *;

D. Content-Security-Policy: default-src 'none'; script-src 'unsafe-inline';

Solution

1. Step 1: Understand blocking inline scripts

   To block inline scripts, do not include 'unsafe-inline' in the script-src directive.

2. Step 2: Analyze options for script sources

   Content-Security-Policy: script-src 'self'; allows scripts only from the website itself ('self') and blocks inline scripts by omission of 'unsafe-inline'. Content-Security-Policy: script-src 'self' 'unsafe-inline'; allows inline scripts, C allows all scripts, and D allows inline scripts but blocks others.

3. Final Answer:

   Content-Security-Policy: script-src 'self'; -> Option A

4. Quick Check:

   Allow 'self' only, no 'unsafe-inline' = B [OK]

Hint: Exclude 'unsafe-inline' to block inline scripts [OK]

Common Mistakes:

• Including 'unsafe-inline' which allows inline scripts
• Using wildcard * which allows all scripts
• Misunderstanding default-src vs script-src directives