Objective

Content Security Policy (CSP) is a HTTP security header to prevent cross-site scripting, clickjacking, and code injection attack.

CSP instruct browsers to load content only from allowed sources. It helps you to restrict the sources and types of content that may be loaded and processed by visitor browsers.

Solution

Edit your Apache configuration file/etc/apache2/httpd.conf and add the following to your VirtualHost.

Below is a good starter policy for a site. It allows images, scripts, AJAX, and CSS from the same origin, and does not allow any other resources to load (i.e., object, frame, media, etc).

# Load the headers module
LoadModule headers_module modules/mod_headers.so

<VirtualHost *:443>
    # Content-Security-Policy Header
    Header always set Content-Security-Policy "default-src 'self'; script-src 'self'; connect-src 'self'; img-src 'self'; style-src 'self';"

</VirtualHost>

However, you will need to customize this to meet your specific needs. Use the Chrome browser developer tools console to display blocks encountered by your browser. You may also want to disable browser extensions during your testing to avoid issues.

Below is a good starter policy for a WordPress site. It allows images, scripts, AJAX, and CSS from the same origin, and other resources to load only from specifically named sites.

# Load the headers module
LoadModule headers_module modules/mod_headers.so

<VirtualHost *:443>
    # Content-Security-Policy Header
    Header always set Content-Security-Policy "default-src 'self'; img-src 'self' data: http: https: *.gravatar.com *.wp.com *.wordpress.com; script-src 'self' 'unsafe-inline' 'unsafe-eval' http: https: *.wp.com *.wordpress.com; style-src 'self' 'unsafe-inline' http: https: fonts.googleapis.com *.wp.com *.wordpress.com; font-src 'self' data: http: https: fonts.googleapis.com themes.googleusercontent.com *.wp.com *.wordpress.com; frame-src 'self' 'unsafe-inline' 'unsafe-eval' http: https: *.wp.com *.wordpress.com"
</VirtualHost>

Reload Apache

[root@nowherelan]# systemctl reload httpd.service

Go to Geek Flare’s Test Site and test your site . The output will tell you if you have everything correct.

My System Configuration

• CentOS 7
• Apache 2.4
• WordPress version 5.0

References

• https://www.w3.org/TR/CSP1/
• https://content-security-policy.com/
• https://geekflare.com/http-header-implementation/#Content-Security-Policy
• https://icontrolwp.freshdesk.com/support/solutions/articles/3000071688-secure-your-wordpress-sites-with-the-content-security-policy-http-header
• https://blog.cloudpassage.com/2018/02/15/xss-risk-with-apache-content/
• https://walterebert.com/blog/using-csp-wordpress/
• https://tools.geekflare.com/tools/csp-test
• https://content-security-policy.com/browser-test/