Troubleshooting Load Analytics on Content Security Policy via .htaccess

Troubleshooting Analytics on Content Security Policy

Troubleshooting Load Analytics on Content Security Policy via .htaccess

How to overcome the problem analytics on Content Security Policy via .htaccess is very easy, here I am doing it to wordpress and the results are satisfactory, for other CMS application may be different. Before running the tutorial, I will give the review.

What is the Content Security Policy?

CSP helps us to prevent exploitation xss and some types of malware other external scripts execution, such as js overlay etc. This is very useful for the company’s website or the website to buy and sell online, for more detail, please see the official website here.

(See also: Prototype.js for increase website speed)

Steps Configuration for WordPress:

  • Open Your WordPress Self-host.
  • Go to the “Appearance” select “Editor”
  • Select “header.php” Change your Analytics code to asynchronous code from Google. You can see here, for example asynchronous code like this:
<!– Google Analytics –>
<script>
window.ga=window.ga||function(){(ga.q=ga.q||[]).push(arguments)};ga.l=+new Date;
ga(‘create’, ‘UA-XXXXX-Y’, ‘auto’);
ga(‘send’, ‘pageview’);
</script>
<script async src=’https://www.google-analytics.com/analytics.js’></script>
<!– End Google Analytics –>
  • The code is usually on top of the code </head>
  • Change the code, “UA-XXXXX-Y” with Your Analytics Tracking ID.
  • Update or Save Theme.
  • Then go to your cPanel account.
  • Go to the “.htaccess” click Edit.
  • There are several configurations that must be considered before editing, you can see at the website from developers google.
  • By default, if you would like to recommend the CSP will look like this:
Header set Content-Security-Policy: script-src ‘self’
  • And this problem on my site, some configurations will turn off analytics tracking, google tag manager, CSS, Javascript or plug in it, like this.
Troubleshooting Analytics on Content Security Policy
Trouble Analytics on CSP
  • Here I do with the method “SSL Only” and adding async code analytics, tag manager, or sync to wordpress.com.
  • Place this code on above wordpress basic code in .htaccess, code like the following:
Header set Content-Security-Policy: script-src https: ‘unsafe-inline’ ‘unsafe-eval’; style-src https: ‘unsafe-inline’
  • Example Basic WordPress code on .htaccess
# BEGIN WordPress
<IfModule mod_rewrite.c>
RewriteEngine On
RewriteBase /
RewriteRule ^index\.php$ – [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . /index.php [L]
</IfModule>
# END WordPress
  • Then click Save.
  • Test your site here, this is the result of my website, not bad.
Troubleshooting Analytics on Content Security Policy
Test Website on securityheaders.io
  • Code ‘unsafe-inline’ is to allow the use of such resources element inline style attribute, onclick, or a script tag body (depending on the context of the resources applied to the need) for more details, please refer to the official website again.
  • Problems on the website is gone.
Troubleshooting Analytics on Content Security Policy
Trouble is gone
  • Cookies Analytics/Tag Manager detected Again.
Troubleshooting Analytics on Content Security Policy
Cooikes GTM detected
  • An Amazing Speed..!!
Troubleshooting Analytics on Content Security Policy
Test on Google Pagespeed Insights

Conclusion

Content Security Policy also useful lighten your website loading and prevent the exploitation of the type xss, shell of defacer, js, overlay or malware from malicious plugins. I recommend to install the plugin CSP to be simple for those who do not want to edit the .htaccess. Any question? please comment below or join in the forum asepms.com, it might help.

Troubleshooting Load Analytics on Content Security Policy via .htaccess
4.7 (93.55%) 62 votes

Follow Me

Asep Ulchre

This website written by single admin, he's like coffee, like the python programming language and art lovers.
Follow Me
%d bloggers like this: