Google跟踪代码管理器-是否可以将CSP随机数添加到自定义HTML代码段中?脚本属性被剥离 [英] Google Tag Manager - Any possible way of adding CSP nonce to Custom HTML snippets? Script attributes get stripped

问题描述

我正在现有网站上实施CSP，并且一直遵循

I'm implementing CSP on an existing website and have been following along with this article on passing a CSP nonce to GTM and using it as a Custom Variable in GTM.

<script nonce="9CZ9vGge7C9At2iwrPtSNG7Ev10=" id="gtmScript">
<!-- Google Tag Manager -->
(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
'https://www.googletagmanager.com/gtm.js?id='+i+dl;var n=d.querySelector('[nonce]');
n&&j.setAttribute('nonce',n.nonce||n.getAttribute('nonce'));f.parentNode.insertBefore(j,f);
})(window,document,'script','dataLayer','GTM-MYID');
<!-- End Google Tag Manager -->
</script>

Variable gets added as a DOM Element Variable. Then I add the variable value to my custom script. Here is a demo script. It is the entirety of a Custom HTML tag in GTM.

<script nonce="{{nonce}}">
  console.log("CSP-allowed script with nonce:", "{{nonce}}");
</script>

The issue is, CSP still blocks this. And it has nothing to do with the {{nonce}} variable - proven by changing CSP to 'unsafe-inline' and seeing the correct value output in console.

I have since been reading that GTM strips attributes out of the tags it injects inline. Which would be odd, as it would mean the linked article above actually never would have worked (it's only a 3 month old article). But does this mean that it's physically impossible to get scripts in Custom HTML GTM tags to function with CSP? The solution in the above link is impossible because the script will always be blocked by CSP.

UPDATE: Here is my CSP

<meta http-equiv="Content-Security-Policy" content="
            default-src 'none' ;frame-src 'self';
            script-src 'self' 'nonce-$CSPNonce' *.googletagmanager.com;
            style-src 'self' 'nonce-$CSPNonce';
            font-src 'self';
            img-src 'self' 'nonce-$CSPNonce' data:;
            connect-src 'self'">

And the console error

gtm.js?id=GTM-MYID:782 Refused to execute inline script because it violates the following Content Security Policy directive: "script-src 'self' 'nonce-mQoPSCSszFQ8loJF5jii6quCHeY=' *.googletagmanager.com". Either the 'unsafe-inline' keyword, a hash ('sha256-3kt898DvY8z+SqQyfz8g06pUzzBokMjvzcQ5uN50wTs='), or a nonce ('nonce-...') is required to enable inline execution.

解决方案

OK I found the cause here. I'm leaving the question up in case someone stumbles across this in future.

When you create a Custom HTML tag in GTM, under the code window is a tickbox called "Support document.write". The tooltip beside it doesn't mention much other than allowing you to use document.write() in your scripts via a "new rendering engine".

For whatever reason, if this is not ticked, the nonce attribute is stripped. With it ticked (using the new rendering method I guess), it is not stripped.

这篇关于Google跟踪代码管理器-是否可以将CSP随机数添加到自定义HTML代码段中?脚本属性被剥离的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！