CookieConsent + Tealium iQ 同意統合

// 1.0.0-beta4
// base: cookieconsentv3


;(function cookieConsentV3Integration (window) {
  // CMP specific functionality and labels
  window.tealiumCmpIntegration = window.tealiumCmpIntegration || {}
  window.tealiumCmpIntegration.cmpName = 'CookieConsentV3'
  window.tealiumCmpIntegration.cmpIntegrationVersion = 'v1.0.0-beta4'
  window.tealiumCmpIntegration.cmpFetchCurrentConsentDecision = cmpFetchCurrentConsentDecision
  window.tealiumCmpIntegration.cmpFetchCurrentLookupKey = cmpFetchCurrentLookupKey
  window.tealiumCmpIntegration.cmpCheckIfOptInModel = cmpCheckIfOptInModel
  window.tealiumCmpIntegration.cmpCheckForWellFormedDecision = cmpCheckForWellFormedDecision
  window.tealiumCmpIntegration.cmpCheckForExplicitConsentDecision = cmpCheckForExplicitConsentDecision
  window.tealiumCmpIntegration.cmpCheckForTiqConsent = cmpCheckForTiqConsent
  window.tealiumCmpIntegration.cmpConvertResponseToGroupList = cmpConvertResponseToGroupList
  // Add the new callback function to the CMP integration object
  window.tealiumCmpIntegration.cmpAddCallbackToTriggerRecheck = cmpAddCallbackToTriggerRecheck
  // Should return a boolean, true if the CMP is running the 'Opt-in' model (GDPR style)
  function cmpCheckIfOptInModel () {
    var cmpRawOutput = cmpFetchCurrentConsentDecision() || {};
    return cmpRawOutput.config && cmpRawOutput.config.mode !== 'opt-out'; // default to opt-in mode for safety
  }

  // Should return some CMP-specific raw object (must be an object) that contains the needed information about the decision.
  // This output is used as the cmpRawOutput argument in functions below.
  function cmpFetchCurrentConsentDecision () {
    if (typeof CookieConsent !== 'object') return false;
    var output = {};
    output.userPreferences = CookieConsent.getUserPreferences();
    output.config = CookieConsent.getConfig();
    return output;
  }

  function cmpFetchCurrentLookupKey () {
    // just return whatever Vendor ID is expected be active to short-circuit the ID-based double check - we don't want or need it in this case
    return (window.tealiumCmpIntegration && window.tealiumCmpIntegration.map && Object.keys(window.tealiumCmpIntegration.map)[0]) || '(Vendor ID check disabled)';
  }

  // Should return a boolean - true if the raw decision meets our expectations for the CMP
  function cmpCheckForWellFormedDecision (cmpRawOutput) {
    return typeof cmpRawOutput === 'object' && typeof cmpRawOutput.config === 'object' && 
           typeof cmpRawOutput.config.categories === 'object' && typeof cmpRawOutput.userPreferences === 'object';
  }

```---
title: "プライバシーを尊重します"
linktitle: "プライバシーを尊重します"
description: "ブラウザの保存を使用して、ウェブサイトの使用方法を理解し、関連する情報やオファーを表示したいと考えています。"
---

/**
 * CookieConsent - CMPを注入
 * スコープ       : プリローダー
 * 発生          : n/a
 * 条件          : n/a
 * 説明          : 特定のCookieConsent構成を読み込み、CMPをレンダリングするためのCSSとJSを注入します。条件によっては複数必要になる場合があります。
 */

// CookieConsent変数
var cmpDomain = 'tags.tiqcdn.com';
var cmpVersion = 'v3.0.1';

// CookieConsentモーダル構成
// すべての構成オプション: https://cookieconsent.orestbida.com/reference/configuration-reference.html
var cmpConfig = {
  mode: 'opt-in',
  disablePageInteraction: true,
  guiOptions: {
    consentModal: {
      layout: 'cloud',
      position: 'bottom center',
      flipButtons: false,
      equalWeightButtons: true
    },
    preferencesModal: {
      layout: 'bar wide',
      position: 'right',
      flipButtons: false,
      equalWeightButtons: true
    }
  },
  categories: {
    necessary: {
      enabled: true,
      readOnly: true
    },
    analytics: {},
    marketing: {}
  },
  language: {
    default: 'en',
    translations: {
      en: {
        consentModal: {
          title: 'プライバシーを尊重します',
          description: 'ブラウザの保存を使用して、ウェブサイトの使用方法を理解し、関連する情報やオファーを表示したいと考えています。',
          acceptAllBtn: 'すべてを許可',
          acceptNecessaryBtn: '必要なものを許可',
          showPreferencesBtn: '構成を管理',
          footer: '<a href="#">プライバシーポリシー</a>'
        },
        preferencesModal: {
          title: '構成を管理',
          acceptAllBtn: 'すべてを許可',
          acceptNecessaryBtn: '必要なものを許可',
          savePreferencesBtn: '選択を許可',
          closeIconLabel: 'モーダルを閉じる',
```sections: [
  {
    title: 'あなたのプライバシーを大切にします',
    description: 'お客様の構成を記憶し、サイトの使用方法を理解し、関連するオファーを表示するためにブラウザ保存を使用します。<br><br>特定の目的に同意するために選択してから「選択を承諾」をクリックしてください。いつでも同意を変更または撤回することができます。'
  },
  {
    title: '厳密に必要 <span class="pm__badge">常に有効</span>',
    description: 'このトラッキングはウェブサイトの適切な機能のために不可欠であり、無効にすることはできません。',
    linkedCategory: 'necessary'
  },
  {
    title: 'パフォーマンスと分析',
    description: 'このトラッキングは、当社のウェブサイトのパフォーマンスとご利用方法に関する情報を収集します。',
    linkedCategory: 'analytics',
    cookieTable: {
      caption: '分析用クッキー',
      headers: {
        name: '名前',
        description: '説明',
        duration: '期間'
      },
      body: [
        {
          name: '_ga',
          description: 'ユーザーを区別するために使用されます。',
          duration: '2年'
        },
        {
          name: '_ga_1234ABCD',
          description: 'セッション状態を維持するために使用されます。',
          duration: '2年'
        }
      ]
    }
  },
  {
    title: 'マーケティングとソーシャル',
    description: 'このトラッキングは、お客様が当社のウェブサイトをどのように使用しているかに関する情報を収集し、お客様が興味を持ちそうなオファーを表示します。',
    linkedCategory: 'marketing'
  },
  {
    title: '詳細情報',
    description: 'クッキーについてもっと知りたい場合は、<a href="https://www.cookiesandyou.com/" target="_blank">Cookies & You</a>をご覧ください'
  }
]
};

var c = document.createElement('link');
c.rel = 'stylesheet';
c.href = 'https://' + cmpDomain + '/libs/cookieconsent/' + cmpVersion + '/cookieconsent.css';
document.head.appendChild(c);

var s = document.createElement('script');
s.src = 'https://' + cmpDomain + '/libs/cookieconsent/' + cmpVersion + '/cookieconsent.umd.js';
s.addEventListener('load', function () { CookieConsent.run(cmpConfig); });
document.body.appendChild(s);

// 同意ログ拡張
// スコープ: プリローダー

function logConsentChanges(event){
    var tealiumAccountForLogging = 'services-caleb'
    var tealiumProfileForLogging = 'main'
    
    // CookieConsentV3からすべてのフィールドを取得
    var cookie = CookieConsent.getCookie();
    var preferences = CookieConsent.getUserPreferences();

    // このペイロードは特定の顧客ニーズに合わせて簡単に調整できます
    var userConsent = {
        tealium_event: 'consent_decision', // 古いペイロードを保持しようとしないでください
        tealium_account: tealiumAccountForLogging,
        tealium_profile: tealiumProfileForLogging,
        consent_id: cookie.consentId,
        cmp_name: window.tealiumCmpIntegration.cmpName,
        decision_type: preferences.acceptType,
        accepted_purposes: preferences.acceptedCategories,
        rejected_purposes: preferences.rejectedCategories,
        consent_model: window.tealiumCmpIntegration.cmpCheckIfOptInModel() ? 'opt-in' : 'opt-out',
        url: document.location.href.split('?')[0],
        decision_timestamp: cookie.lastConsentTimestamp,
        expiration_time: cookie.expirationTime,
        revision: cookie.revision
    };
    
    // この決定が最初の決定を必ずしも拾うわけではありません
    // これはレースであり、コールバックの速度の性質上、この方がほとんどの場合勝ちます
    var tealiumVisitorId = utag && utag.loader && utag.loader.RC('utag_main').v_id
    
    // tealium_visitor_idが存在する場合のみ追加
    if (tealiumVisitorId) {
        userConsent.tealium_visitor_id = tealiumVisitorId
    }
    
    // ログまたは配布のためにデータを送信
    fetch('https://collect.tealiumiq.com/event', {
        method: 'POST',
        headers: {
            'Content-Type': 'application/json'
        },
        body: JSON.stringify(userConsent)
    });
}

window.addEventListener('consent_updated', (event) => {
  logConsentChanges(event);
});