Web Pixel not tracking conversion events due to incorrect CSP on checkout & status pages.

We’ve developed & deployed web pixels for our app https://apps.shopify.com/spur-automated-support-marketing

Web pixels are working well for events that occur when a user is browsing a website. But when they head over to checkout, the browser.sendBeacon() code fails because of the following error:


Refused to connect to '[https://api.meetspur.app/pixel?id=219&spcid=2904309](https://api.meetspur.app/pixel?id=219&spcid=2904309)' because it violates the following Content Security Policy directive: "connect-src 'self' *.shopifycs.com c1-stats.shopifysvc.com/performance c1-stats.shopifysvc.com/custom-metrics monorail-edge.shopifysvc.com monorail-edge-staging.shopifycloud.com ct.pinterest.com analytics.tiktok.com stats.g.doubleclick.net c1-stats.shopifysvc.com [www.google-analytics.com](http://www.google-analytics.com) [www.facebook.com](http://www.facebook.com) [www.instagram.com](http://www.instagram.com) *.snapchat.com atlas.shopifysvc.com atlas.shopifycloud.com saadaa-design.myshopify.com saadaa.in [www.saadaa.in](http://www.saadaa.in) saadaa-design.account.myshopify.com shop.app shopify-chat.shopifycloud.com shopify-chat.shopifyapps.com *.pusher.com *.bugsnag.com hcaptcha.com *.hcaptcha.com".

This is breaking all conversion tracking for Web Pixels since the Header response of a checkout page has mentioned these CSP headers & no requests are sent to our server because of that.

Steps to reproduce

  1. Click on any of these links
    https://www.kiayaaccessories.com/?spcid=2961179&utm_source=spur&utm_medium=spur_fb&utm_campaign=spur_automation&utm_content=2961179
    https://saadaa.in/?spcid=2904309&utm_source=spur&utm_medium=spur_fb&utm_campaign=spur_automation&utm_content=2904309

  2. Add any product to cart & head to checkout page

  3. Press F12 & open the console in dev tools

  4. You’ll see the error above & thats the reason we cant track conversion events via pixel :disappointed_face:

1 Like

I ideally would want it to allow access to *.meetspur.app, maybe Shopify should create a mutation to allow that or just take it from the app url set in the parteners admin dashboard?

1 Like

hello mate, i do have this issue with my website. The pixel track added to cart, page view but when it goes to the checkout page it does not track anymore. I do not know what i should do, i tried everything use google tags to set up the pixels, use manual code copy and paste pixel from facebook, like my facebook to my Shopify account but nothing is working. I tried everything nothing sorts my problem.

1 Like

Yeah its sad, because this almost renders shopify pixels as useless for us, had we known this earlier, we wouldnt have spent the efforts in making it.

2 Likes

@rohanrajpal Did you try sending pixel data through app proxy path to a server ? That should work right since origin will still be whitelisted in CSP directive.

1 Like