JavaScript API

f.js exposes a small public API on window.consentfolio, plus a document event, so your own site code can read or react to consent state instead of only relying on the banner UI.

window.consentfolio

getConsent()

Returns the visitor's current consent state:

var state = window.consentfolio.getConsent();
// { id: '<visitor uuid or null>', choices: { analytics: true, marketing: false, ... }, hasConsented: true }

hasConsented is false (and choices empty) if the visitor hasn't made a choice yet, or their prior choice has expired / been invalidated by a config change.

show()

Opens the first-layer banner (the same UI a new visitor sees), even if the visitor already has a stored choice:

window.consentfolio.show();

showPreferences()

Opens the preferences modal directly to the per-category view. It shows the visitor's consent ID and date for their own DSAR self-service:

window.consentfolio.showPreferences();

withdraw()

Withdraws consent for every non-essential category in one call (equivalent to choosing "reject all" from the preferences modal). This triggers the same revoke flow as an in-UI withdrawal. The new state is persisted, a receipt is sent, and the page reloads:

document.getElementById('cf-withdraw').addEventListener('click', function () {
  window.consentfolio.withdraw();
});

onConsent(cb)

Registers a callback that fires whenever consent is granted or changes. If consent is already known at the time you call this, it fires immediately with the current state. You don't need to check getConsent() separately to cover the "already consented on a prior visit" case:

window.consentfolio.onConsent(function (state) {
  if (state.choices.analytics) {
    // safe to initialize your own analytics-dependent code here
  }
});

cf:consent event

As an alternative to onConsent(), f.js dispatches a cf:consent CustomEvent on document. It fires on initial load if consent is already known, on every new choice, and whenever consent changes (including withdrawal):

document.addEventListener('cf:consent', function (e) {
  console.log(e.detail); // same shape as getConsent()
});

Use whichever fits your code better: onConsent() for a single "run this once consent is known" callback, or cf:consent if you'd rather wire it up through your existing event-handling code or need multiple independent listeners.