Getting railroaded by Shopify Support on fixing this issue. I need a developer to look at it. I know shopify devs are here and I know this isn't the place to post these types of issues.....but there really needs to be a place where devs can submit issues to Shopify and actually get devs to look at it, instead of random support people, which are generally useless.
Shopify's Google Analytics 4 Javascript implementation via Google Channel is being blocked by Shopify's CSP Headers on the checkout pages. Because of this begin_checkout and add_payment_info events are not getting tracked. You can confirm this by checking out any Shopify Google Analytics 4 website and you'll notice the discrepancy between "purchase" and "begin_checkout" events.
Google Analytics 4 loads javascript via many URLs, the most common being analytics.google.com, which is not added to CSP headers, so it's being explicitly blocked by browsers which enforce this.
To use the Google Analytics 4 (Google Analytics) tag, the CSP must include the following directives:script-src: https://*.googletagmanager.com img-src: https://*.google-analytics.com https://*.googletagmanager.com connect-src: https://*.google-analytics.com https://*.analytics.google.com https://*.googletagmanager.com
For Google Analytics 4 (Google Analytics) deployments using Google Signals, the CSP must include the following directives:script-src: https://*.googletagmanager.com img-src: https://*.google-analytics.com https://*.analytics.google.com https://*.googletagmanager.com https://*.g.doubleclick.net https://*.google.com https://*.google.<TLD> connect-src: https://*.google-analytics.com https://*.analytics.google.com https://*.googletagmanager.com https://*.g.doubleclick.net https://*.google.com https://*.google.<TLD>
Shopify while looking at this (or whom ever implements this channel/implementation) should also add the event "add_shipping_info" and should also include the required field "items" field in "begin_checkout" and "add_payment_info" events.
Also I'd recommend Shopify makes a more generic github project for developers who want to report bugs. Unfortunately this will be the 3rd time I've used this hack to fix thing on Shopify, which are being ignored otherwise.
I have other issues with Facebook Channel and Custom/App Pixels I'd like resolved as well, but I know talking with Support will get me no where.
Getting railroaded by Shopify Support on fixing this issue. I need a developer to look at it. I know shopify devs are here and I know this isn't the place to post these types of issues.....but there really needs to be a place where devs can submit issues to Shopify and actually get devs to look at it, instead of random support people, which are generally useless.
Shopify's Google Analytics 4 Javascript implementation via Google Channel is being blocked by Shopify's CSP Headers on the checkout pages. Because of this begin_checkout and add_payment_info events are not getting tracked. You can confirm this by checking out any Shopify Google Analytics 4 website and you'll notice the discrepancy between "purchase" and "begin_checkout" events.
Google Analytics 4 loads javascript via many URLs, the most common being analytics.google.com, which is not added to CSP headers, so it's being explicitly blocked by browsers which enforce this.
Shopify needs to implement the CSP headers which are outlined in Google's Analytics 4 documentation here: https://developers.google.com/tag-platform/tag-manager/web/csp#google_analytics_4_google_analytics
To use the Google Analytics 4 (Google Analytics) tag, the CSP must include the following directives:
script-src: https://*.googletagmanager.com img-src: https://*.google-analytics.com https://*.googletagmanager.com connect-src: https://*.google-analytics.com https://*.analytics.google.com https://*.googletagmanager.comFor Google Analytics 4 (Google Analytics) deployments using Google Signals, the CSP must include the following directives:
script-src: https://*.googletagmanager.com img-src: https://*.google-analytics.com https://*.analytics.google.com https://*.googletagmanager.com https://*.g.doubleclick.net https://*.google.com https://*.google.<TLD> connect-src: https://*.google-analytics.com https://*.analytics.google.com https://*.googletagmanager.com https://*.g.doubleclick.net https://*.google.com https://*.google.<TLD>Full details of this issues are documented here: https://community.shopify.com/c/shopify-apps/ga4-pixel-issues/m-p/1995798/highlight/true#M60995
Shopify while looking at this (or whom ever implements this channel/implementation) should also add the event "add_shipping_info" and should also include the required field "items" field in "begin_checkout" and "add_payment_info" events.
Also I'd recommend Shopify makes a more generic github project for developers who want to report bugs. Unfortunately this will be the 3rd time I've used this hack to fix thing on Shopify, which are being ignored otherwise.
I have other issues with Facebook Channel and Custom/App Pixels I'd like resolved as well, but I know talking with Support will get me no where.