Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

...

Syntax

function __tcfapi()

argument name

type

optional

value

description

command

string

'addEventListener'

version

integer

✔️

null|2

The TCF API version to use. Can be null instead.

callback

function

function(tcData:TCData, success:boolean)

The callback function that is called with the function call result.

Description

In order to retrieve user consent, the IAB specification provides two different functions: addEventListener and getTCData. Although both can retrieve user consent, addEventListener is recommended, given it can "follow" the user interaction, making sure that it will eventually return the consent data once the user has finished interacting with the CMP GUI. On the other hand, getTCData function just returns the current consent status. This means that it may return uninitialized, incomplete, or full consent data, depending on the timing it is called. This means that the responsibility to obtain the definite data for the consent falls over the publisher’s lap. With addEventListener every consent status change triggers a new call to the given callback, which means that the only thing needed to process the consent data is a simple check for whether or not that consent data is final, thus usable down the line.

...

Code Block
__tcfapi('addEventListener', 2, function(tcData, success) {
  if(success && (tcData.eventStatus === 'tcloaded' || tcData.eventStatus === 'useractioncomplete')) {
    // Check if Google has vendor consent and device access: Google Id is 755, Device access is purpose 1
    if(!tcData.gdprApplies || (tcData.vendor.consents[755] && tcData.purpose.consents[1])) {
      // for example, trigger adsense
      console.log("Google has vendor consent and device access which is required for gpt and adsense", tcData);
    } else {
      console.log("Google is missing consent", tcData);
    }
  }
});

Wait for consent and check the users choices

This example shows how to check for full or partial user consent.

Code Block
__tcfapi('addEventListener', 2, function(tcData, success) {
  if(success && (tcData.eventStatus === 'tcloaded' || tcData.eventStatus === 'useractioncomplete')) {
    if(tcData.gdprApplies) {
      // Get global vendor list and check if all vendors got consent
      __tcfapi('getVendorList', 2, function(gvl, success) {
        if(success) {
          if(Object.keys(tcData.vendor.consents).length == Object.keys(gvl.vendors).length &&
             Object.keys(tcData.purpose.consents).length == Object.keys(gvl.purposes).length) {
            // User clicked "Accept All"
            console.log("User gave full consent", tcData);
          } else if(Object.keys(tcData.vendor.consents).length == 0 &&
                    Object.keys(tcData.purpose.consents).length == 0) {
            // User clicked "Customize choices" and then "Save preferences"
            console.log("User rejected consent", tcData);
          } else {
            // User customized consent choices
            console.log("User gave partial customized consent", tcData);
          }
        }
      });
    } else {
      console.log("GDPR does not apply, have full consent");
    }
  } else {
    console.log("User consent not available yet", tcData);
  }
});