Content Security Policy – Protect your Web Applications!

CSP(Content Security Policy) is the security policy that helps to detect and prevent certain types of attacks, such as Cross-Site Scripting (XSS) and data injection attacks. The Content-Security-Policy header allows you to limit how the browser loads resources, such as JavaScript, CSS, or almost anything else.

Need for Content Security Policy

• The browser is aware and able to protect the user from dynamic calls that load content into the page currently being visited by injecting the Content-Security-Policy (CSP) headers from a server.
• It provides an efficient second layer of security against different kinds of vulnerabilities, like XSS.
• By default, for extra protection, CSP also enforces modern script coding styles.

Content Security Policy Directives

There are several types of directives that allow the developer to monitor the flow of policies in a granular way –

1. default-src : The default-src directive specifies the default resource fetch policy, such as JavaScript, Images, CSS, Fonts, etc.
2. script-src : This directive defines valid sources of JavaScript.
3. object-src : This directive defines from where the protected resource can load plugins.
4. style-src : Define the stylesheets (CSS) that the user applies to the resource.
5. img-src : It defines the URLs from which images can be loaded.
6. media-src : It Specifies the URLs from which to load the video, audio, and text track content.
7. frame-src : It defines from where the resource can get the embed frames.
8. font-src : It defines from which URLs to load fonts.
9. connect-src : This directive define from which URIs the protected resource can load using script interfaces.
10. form-action : This defines which URIs can be used as the action for HTML form elements.
11. sandbox : The sandbox uses the same-origin policy, prevents popups, blocks plugins, and blocks execution of scripts.
12. plugin-types: It defines the collection of plugins that the protected resource will invoke by restricting the types of resources that can be embedded.
13. report-uri : It instructs a browser to POST a policy failure notification to this URI.

Examples

Let us see some examples using some of the above-mentioned directives –

Example 1 :- default-src

The default-src directive specifies the default resource fetch policy, such as JavaScript, Images, CSS, Fonts, etc.

default-src ‘self’ default.example.com;

Example 2 :- script-src

This directive defines valid sources of JavaScript.

script-src ‘self’ script.example.com;

Example 3 :- object-src

This directive defines from where the protected resource can load plugins.

object-src ‘self’;

Example 4 :- style-src

Define the stylesheets (CSS) that the user applies to the resource.

style-src ‘self’ style.example.com;

Example 5 :- img-src

It defines the URLs from which images can be loaded.

img-src ‘self’ image.example.com;

Conclusion

Content Security Policy provides an efficient second layer of security against different kinds of vulnerabilities. In addition, it’s also important to note that a CSP will not protect against the exploitation of vulnerabilities on your website by attackers. But it prevents the execution of injected malicious scripts by modern browsers if they are ever injected into your pages.

Need Support?

Thank You for reading this Blog!

For further more interesting blogs, keep in touch with us. Also if you need any kind of support, simply raise a ticket at https://webkul.uvdesk.com/en/.

For further help or query, please contact us or raise a ticket.