How to add analytics and pixel scripts avoiding Content Security Policy (XSS)

data & reporting
1

Good day,

I’ve tried to add the Facebook Pixel script and Posthog analytics to my site with a custom component and editing the html from the default theme.

These are not working because of Content Security Policy. I even tried hashing the script with sha256, but I get this error when adding it to “content security policy script src”:

image
image724×284 37.2 KB

I’ve also read this topic: Mitigate XSS Attacks with Content Security Policy

How can I avoid CSP on specific scripts?

Thank you!

1 Like
2

I’ve even disabled the Content Security Policy and added “unsafe-eval” con scripts src, but it’s still not working.

image
image809×302 37.2 KB

Here is my custom component (in the head):

image
image1036×723 94.6 KB

3

I recently added PostHog to several sites and didn’t need to change any CSP settings. (I haven’t tried Facebook Pixel. It might help to add one thing at a time.) My technique was to use a Theme Component:

That’s a strong signal CSP isn’t the problem.

Try starting with just PostHog in the beginning and see if that works. If it does, try just Meta Pixel.

For what it’s worth, the PostHog toolbar doesn’t work out of the box with Discourse. See:

1 Like