CMP API usage
Introduction
As an approved IAB Consent Management Platform, Clickio Consent Tool fully supports the standardized CMP Javascript API for user consent data retrieval.
Non-EU visitors and CMP API
By default, the non-EU version of the Consent Tool code (automatically served by our geo-aware CDN) does not include CMP API functionality (to minimize load traffic/time), but that is server-side configurable - feel free to contact support if you need it.
General information
The current version API documentation can be found here. Clickio CMP API implementation fully supports all the described functionality.
When implementing the CMP API integration, you should bear in mind that it loads asynchronously, so you can not directly call __tcfapi
function to pass commands from your scripts. Avoid implementing any await cycles/timeouts, which create parasitic load or delays. Instead, you can use a simple CMP API stub, which gracefully handles all the calls for you, while the full code loads.
<script type="text/javascript">
!function(){"use strict";var t;(function(t){t.t=function(){for(var t,e,n="__tcfapiLocator",r=[],i=window;i;){try{if(i.frames[n]){t=i;break}}catch(t){}if(i===window.top)break;i=i.parent}t||(function t(){var e=i.document,r=!!i.frames[n];if(!r)if(e.body){var a=e.createElement("iframe");a.style.cssText="display:none",a.name=n,e.body.appendChild(a)}else setTimeout(t,5);return!r}(),i.__tcfapi=function(){for(var t=arguments.length,n=new Array(t),i=0;i<t;i++)n[i]=arguments[i];if(!n.length)return r;if("setGdprApplies"===n[0])n.length>3&&2===parseInt(n[1],10)&&"boolean"==typeof n[3]&&(e=n[3],"function"==typeof n[2]&&n[2]("set",!0));else if("ping"===n[0]){var a={gdprApplies:e,cmpLoaded:!1,cmpStatus:"stub"};"function"==typeof n[2]&&n[2](a)}else r.push(n)},i.addEventListener("message",(function(t){var e="string"==typeof t.data,n={};try{n=e?JSON.parse(t.data):t.data}catch(t){}var r=n.i;r&&window.__tcfapi(r.command,r.version,(function(n,i){var a={o:{returnValue:n,s:i,u:r.u}};e&&(a=JSON.stringify(a)),t&&t.source&&t.source.postMessage&&t.source.postMessage(a,"*")}),r.p)}),!1))}}(t={t:{}}),t.t)()}();
</script>
After installing this code on the page, you can then call the API as usual (getTCData
dump example is shown below). It is recommended to install the code prior to any other related scripts in the page head
.
window.__tcfapi('getTCData', null, function (consentData, consentDataSuccess) {
console.groupCollapsed('getTCData called ('+consentDataSuccess+')');
console.log(consentData);
console.groupEnd();
});
The stub stores the request and replies as soon as the full code loads. PostMessage commands are also supported.