Prevent customer disputes.

Acquiring confirmation of digital purchases provides chargeback defence and dispute protection.

This page covers web-based authentication via modal.
See 'identify' for mobile & biometric approval.

1. Add our consent SDK to the html header of your webpage.

<script src="">

2. Initialise the Citizen consent modal.

Customise the fields as appropriate. If required, all fields can be customised for different languages.

<script type="text/javascript">

window.citizenConsentAsyncInit = function () {


'integrationType': 'WEB',
'entityPublicApiKey': '6a1a125a-5895-432d-9c8c-21eb98120ceb',
'issuingDomain': '',

// custom fields for the modal
'headerText': 'Your subscription agreement:',
'consentText': 'You agree to the following:',
'dataAgreementText': 'Our data agreement:',
'emailText': 'Your email address:',
'dataText': 'The data we store:',

// call to actions for buttons
'ctaConfirmText': 'I AGREE',
'ctaDeclineText': 'I do not agree.',

// confirm messages for post consent CTA clicks (GDPR)
'consentConfirmMessage': 'Your subscription was activated.',
'consentDeclineMessage': 'Your subscription was delcined.',

// field name definitions
'NAME': 'full name',
'DOB': 'date of birth',
'POB': 'place of birth',
'NATIONALITY': 'nationality',
'ADDRESS': 'address',
'PHONE': 'phone number',
'GENDER': 'gender',
'EMAIL': 'email',
'CARD_ON_FILE': 'credit or debit card',
'OTHER': 'other personal data'

// setting false prevents closure without user action
'closeOnClickAway': false

3. Setup the consent modal call.

Add the Citizen consent SDK call prior to an order confirmation or payment confirmation submission. If the agreement is approved, the callback to the page should allow the order to proceed as normal

The consent response is provided when the user clicks on the modal.

The response can be passed to your own callback function and recorded in the Citizen enterprise app.


function citizenCallback(consentResponse){
if (consentResponse.consentStatus === 'GRANTED') { = 'visible';
} else { = 'hidden';


In this demo, the legal agreement ‘Subscription’ is set up in the Citizen enterprise app.

4. Open the modal on an event (such as page load).

In the demo we open the modal on a button onclick. You can also open on page load, or conditionally (ie if user is in the EU)


<body onload="citizenCallback(consentResponse)">