SDK Integration

ClientAPI Axeptio is a RESTful JSON / HTTP API that allows you to install and set up Axeptio on your website.

The SDK is a small Javascript file which is loaded by your html page thanks to a tag

Axeptio Embed.JS SDK

This 40Kb file (12Kb zipped) is hosted by Axeptio and served from a high-performance CDN (content distribution network).

Integration

Copy and paste the code snippet below into your source code or in a Tag Management System like Google Tag Manager.

You can find our snippet code in the integration section. Then, you need to copy and paste the script in your source code (all pages).

My projects > Name of the project > Technical integration

<script>
window.axeptioSettings = {
  clientId: "5c11ff5ce95cd64112feab79",
};
 
(function(d, s) {
  var t = d.getElementsByTagName(s)[0], e = d.createElement(s);
  e.async = true; e.src = "//static.axept.io/sdk.js";
  t.parentNode.insertBefore(e, t);
})(document, "script");
</script>

React specificity

If your website is in React, you'll have to modify the code a little, to load a different version of the sdk. Change this line :

e.async = true; e.src = "//static.axept.io/sdk.js";

Into this :

e.async = true; e.src = "//static.axept.io/sdk_slim.js";

Detailed Integration

Based on your CMS, we suggest you to click on one of the links below :

Options and advanced mode

You can configure the SDK behavior by passing options before the script load. For this, there is two options available :

Pass options as attributes on our <script> tag

You may have noticed in the previous code, but our Axeptio script "sdk.js" reads attributes associated to the <script> tag used to load it. Then, when we write :

el.setAttribute('data-cookies-version', 'Misterflyversion1FR');

It's as if we wrote this :

<script type="text/javacript" data-cookies-version="Misterflyversion1FR"></script>

This way it is possible to pass various arguments, detailed here :

  • data-cookies-version : identifier of the cookie configuration "version" that you want to load on the site. This attribute overwrite any pre-defined value.

  • data-cookies-domain : domain name used to save the cookie where the user preferences are stored. This method is detailed here.

  • data-token : if you memorized the token generated for your user, for example to allow him to find back his choices when he logs in, you can pass it so that Axeptio will not generate a new one.

Declare an axeptioSettings object in your page

On script load, our SDK will check if an axeptioSettings object was already declared. If it is the case, it will pick in its parameters.

window.axeptioSettings = {
userCookiesDuration: 6*30
}

The list of the different properties of this object are the following :

/** @type {string} clientId ObjectID corresponding to the project object */
clientId;
/** @type {string} user token set by the website (if the user is logged in)*/
token;
/**
* String identifier of the version of Cookie configuration
* that should be loaded. If this parameter is omitted, then it's the "pages"
* property in the configuration that gets parsed in case of
* multiple cookies configurations.
* @type {string}
*/
cookiesVersion;
/**
* Flag to tell whether GTM Events should be written in the dataLayer variable or not
* @type {boolean}
*/
triggerGTMEvents = true;
/**
* Name of the cookies containing the JSON value of user choices
* @type {string}
*/
jsonCookieName = 'axeptio_cookies';
/**
* Name of the cookies that stores authorized vendors (comma-separated string)
* @type {string}
*/
authorizedVendorsCookieName = 'axeptio_authorized_vendors';
/**
* Number of days used the cookie holding user's choices should be active
* @type {number}
*/
userCookiesDuration = 365;
/**
* If specified, domain name on which the cookie containing user choices
* will be available. This allows to request one consent for various subdomains
* @type {string}
*/
userCookiesDomain;
/**
* Wether or not the cookie holding choices is HTTPS only
* @type {boolean}
*/
userCookiesSecure = true;
/**
* ClassName of the <div> tag were Axeptio's WebsiteOverlay will be mounted
* @type {string}
*/
mountClassName = 'axeptio_mount';
/**
* URL on which the widget will send its POST and GET requests
* for querying and storing consent proofs.
* @type {string}
*/
apiUrl = 'https://api.axept.io/v1';

For Gandi or Varnish users, caching contents forbids cookie usage, unless they are prefixed. Cf Gandi documentation on this topic. To dodge this limitation, you can rename the two Axeptio cookies by declaring them in your axeptioSettings object :

window.axeptioSettings = {
authorizedVendorsCookieName: "STYXKEY_axeptio_vendors",
jsonCookieName: "STYXKEY_axeptio_json"
}