CMP 的沙盒 JavaScript(同意模式 v2)无法写入数据层

问题描述 投票:0回答:1

我已经使用 CMP 提供商的代码设置了一个自定义模板,该模板非常适合同意设置。我们必须对所提供的 CMP 进行一些添加和编辑。我想在同意更新时发送自定义事件以用作某些标签的触发器,但我不断收到“'dataLayer'未定义”错误。看来我根本无法让沙盒 JavaScript 与我的 dataLayer 对话,因为对它或窗口的任何引用都会产生问题。

我认为这是自定义模板限制的问题。我想了解为什么它不起作用以及如何能够将自定义事件发送到沙盒 JavaScript 中的数据层。

我尝试了不同的方法来尝试完成这项工作,但我尝试的所有方法都会导致“窗口未定义”或“数据层”未定义错误。我的提供商不愿意提供帮助,因为他们认为这是 Google 问题。注意:如果我删除对窗口和数据层的引用,并且按应有的方式更新同意,则脚本可以正常工作。但是,我也需要发送自定义事件作为“updateConsentState”的一部分来触发其他标签。

请参阅下面我的代码:

// Initialize dataLayer
window.dataLayer = window.dataLayer || [];

// Enter your template code here.
const log = require('logToConsole');
const setDefaultConsentState = require('setDefaultConsentState');
const updateConsentState = require('updateConsentState');
const injectScript = require('injectScript');
const queryPermission = require('queryPermission');
const copyFromWindow = require('copyFromWindow');
log('data =', data);

// set default consent
setDefaultConsentState({
    'ad_storage': 'denied',
    'analytics_storage': 'denied',
    'ad_user_data': 'denied',
    'ad_personalization':'denied',
    'functionality_storage': data.functional,
    'personalization_storage': data.functional,
    'security_storage': 'granted'
});

// start of config
var config = {
    apiKey: data.apiKey,
    logConsent: true,
    product: data.product,
    optionalCookies: [
        {
            name : 'Analytics',
            label: "<strong>Analytics cookies</strong>",
            description: "<p>Analytics cookies help us to improve our website by collecting data about how you use it.</p>",
            cookies: ['_gid', '_ga*', 'nmstat', '__utma', '__utmc', '__utmz', '__utmt', '__utmb', '_hj*', 'CLID', 'SRM_B', 'uid', '_vwo*', '_gat',],
            onAccept : function(){
                updateConsentState({
                    'analytics_storage': 'granted',
                });
                // Push event to dataLayer
                window.dataLayer.push({
                    'event': 'analytics_granted',
                    'category': 'Analytics',
                    'action': 'Granted'
                });
            },
            onRevoke: function(){
                updateConsentState({
                    'analytics_storage': 'denied',
                });
            }
        },
        {
            name : 'marketing',
            label: "<strong>Marketing cookies</strong>",
            description: "<p>Marketing cookies help us show you adverts that are more relevant to you.</p>",
            cookies: ['X-AB', '_gcl*', 'uid', 'test_cookie', 'YSC', 'VISITOR_INFO1*', '_ttp', '_scid', '_scid_r', '_scid*', '_uet*', 'muc_ads', 'li_sugr', 'bcookie', 'lidc', 'personaliza*', 'MUID', 'UserMatch*', 'AnalyticsSync*', '_fbp*', '_tt_enable*', 'bscookie', 'li_gc', 'MR', 'SM', 'ANONCHK', 'MSPTC', 'IDE', 'suid', 'uid*', 'TapAd*', 'XANDR*', 'receive-cookie*', 'uuid2', '_rxuuid', 'ab', 'anHistory', 'anj', 'anProfile', 'u', 'bku', 'bkpa', '__141_cid', '__io_cid', 'A3', 'utm_*', 'NID', 'cf_clearance', '_cfuvid', '_fbc'],
            onAccept : function(){
                updateConsentState({
                    'ad_storage': 'granted',
                    'ad_user_data': 'granted',
                    'ad_personalization':'granted',
                });
                // Push event to dataLayer
                window.dataLayer.push({
                    'event': 'marketing_granted',
                    'category': 'Marketing',
                    'action': 'Granted'
                });
            },
            onRevoke: function(){
                updateConsentState({
                    'ad_storage': 'denied',
                    'ad_user_data': 'denied',
                    'ad_personalization': 'denied',
                });
            }
        }
    ],
    text: {
        title: "<div class='u-text-h4 u-font-bold u-font-serif u-mb-1'>Control your cookies</div>",
        notifyTitle: "<div class='u-text-h4 u-font-bold u-font-serif u-mb-1'>Control your cookies</div>",
        notifyText: "<p>We need some essential cookies to make this website work. We want to set other cookies to understand how you use the site and give you the best experience. If you change your mind, you can change your settings.</p>",
        acceptSettings: "Accept all",
        rejectSettings: "Reject non-essential",
        accept: "Accept all",
        reject: "Reject non-essential",
        settings: "More options",
        necessaryTitle:"<strong>Essential cookies</strong>",
        necessaryDescription:"<p>We need some essential cookies to make this website work. They help you move between pages, interact with the website and access secure areas. You can only reject essential cookies in your browser settings. Some parts of the site may not work if you do.</p>",
        closeLabel: "<span>Save and close cookie control</span>",
        notifyDescription : "<p>We need some essential cookies to make this website work. We want to set other cookies to understand how you use the site and give you the best experience.</p>",
    },
    consentCookieExpiry: 365,
    theme: 'light',
    subDomains: true,
    statement: {
        description: 'For more detailed information, please check our',
        name: 'Cookie Policy',
        url: 'https://www.mmu.ac.uk/cookie-policy',
        updated: '04/03/2024',
    },
    excludedCountries: 'all',
    position: 'left',
    layout: 'popup',
    toggleType: 'slider',
    branding: {
        'backgroundColor': '#ffffff',
        'fontColor': '#000000',
        'acceptBackground':'#ffcd00',
        'rejectBackground':'#ffffff',
        'acceptText':'#000000',
        'rejectText':'#000000',
        'removeAbout': true,
        'removeIcon': true,
        'toggleBackground':'#A9A3AD',
        'toggleText':'#ffffff',
    }
};

// end of config

const onSuccess = () => {
    const CookieControl = copyFromWindow('CookieControl');
    log(config);
    CookieControl.load(config);
    data.gtmOnSuccess();
};

const onFailure = () => {
    log("fail");
    data.gtmOnFailure();
};

injectScript('https://cc.cdn.civiccomputing.com/9/cookieControl-9.x.min.js', onSuccess, onFailure);

// Call data.gtmOnSuccess when the tag is finished.
data.gtmOnSuccess();
javascript google-tag-manager cmp
1个回答
0
投票

要推送到数据层,您可以使用 createQueue API(如果您使用现有窗口变量的名称,它将重用该变量而不是覆盖它)。

这是文档中提到的

const dataLayerPush = createQueue('dataLayer');
dataLayerPush({'currency': 'USD'}, {'event': 'myConversion'});

如果您想使用它,您需要检查您的 access_global 权限并确保您已允许访问 dataLayer 全局变量(或您的变量的名称)。

© www.soinside.com 2019 - 2024. All rights reserved.