Re: Why is Google Tag Manager causing errors on my checkout page?

Why is Google Tag Manager causing errors on my checkout page?

juanpfc
Shopify Partner
2 0 7

Hello everyone. We are trying to set up some web pixels using Google Tag Manager using the new "Customer Events" functionality of Shopify on a store already in the new checkout. However, we are getting an error only happening on the checkout page. As soon as the script is executed, it returns this: Uncaught DOMException: Blocked a frame with origin "null" from accessing a cross-origin frame. I'm attaching a screenshot of the error for full context.

 

Any idea of why this might be happening? If I remove the GTM script, everything works fine. So it must be something related to the external script. I'll appreciate any help, thanks in advance!

 

juanpfc_1-1698684191988.png

 

Replies 10 (10)

lov2code
Shopify Partner
5 0 3

I am having the same issue. Has anyone found a solution to this yet? I have attempted to move the GTM tag outside of the pixel section and it doesn't read the datalayers. Very frustrating.

akashgarg
Visitor
1 0 1

I am facing same issue, did any found any solution?

Very frustrating. Please help 

00coder
Shopify Partner
2 0 2

Receiving the same error. I have seen in some non-Shopify forums that window.postMessage() may be a solution, but I am not sure if or how that can be implemented here. Is anyone able to assist?

R-Daneel
Shopify Partner
15 0 19

I'm having a similar issue. I followed these instructions to set up my tracking pixel using Customer Events:
https://help.shopify.com/en/manual/promoting-marketing/pixels/custom-pixels/gtm-tutorial

but when I try to preview in GTM, I see an error in the browser console and preview tells me it can't find the pixel. When I view source, I see the pixel code is there. I'm surprised we'd be shown an implementation that doesn't quite work.

Uncaught DOMException: Failed to set a named property 'debugBadgeApi' on 'Window': Blocked a frame with origin "null" from accessing a cross-origin frame.

RDaneel_0-1713206338838.png

 

keligijus
Shopify Partner
4 0 2

Hey, it seems that the article suggests using a Chrome extension https://help.shopify.com/en/manual/promoting-marketing/pixels/custom-pixels/gtm-tutorial#:~:text=Add... , rather than GTM preview tool. I've managed to confirm the correct datalayer info using the Legacy Chrome extension.

 

The error seems to be related to the preview tool itself.

MosAli
Visitor
1 0 0

I spent so long trying to work out what was wrong with my implementation and it was this all along. 

DEVIZ
Shopify Partner
2 0 0

Nobody is in a hurry to fix the topic 🙂

Growth_Society
Visitor
1 0 2

Same problem here. It seem to be a serious topic pleas Shopify Team give us an answer ! 

a6589932
New Member
6 0 0

Has anyone solved this problem

DEVIZ
Shopify Partner
2 0 0

It's a simple 😉 There is a forced CORS policy error. The reasons for this error can be varied, and here are the most common ones: No local server, Trying to access frames from different domains, CORS policy on the server. Everything is based on the correct configuration of the server. The cors rules respond correctly but I have to have exceptions for google they use the iframe solution.The best thing is that you probably don't have to use an iframe so you won't have any mistakes...