FlamioDocs
ProductPricingSign in
Web SDK

Record only after consent

Hold web SDK recording until the visitor accepts your cookie banner, and stop it when they decline or withdraw.

Start the SDK in waiting mode, then pass it the visitor's decision from your cookie banner or consent management platform (CMP). Flamio records only the visitors who agree.

You callWhat the SDK does
Flamio.init with consent: 'wait'Records nothing, stores nothing in the browser and sends nothing.
Flamio.consent('granted')Starts recording from this moment, beginning with the page as it is now.
Flamio.consent('denied')Stops recording and discards data that was not sent yet. Data already sent stays in Flamio.
Flamio.init with consent: 'denied'The same as 'wait': nothing happens unless you later call Flamio.consent('granted').
  • The SDK does not remember the decision between page loads. Pass it on every page: right after init when your banner already knows the choice, and again whenever the visitor changes it.
  • Whether a visit is recorded under sampleRate is decided at init. A visitor outside the sample is not recorded, even after granting.

Before you begin

  • The web SDK is installed, or you are installing it now. See Install the web SDK.
  • Your site has a cookie banner or a CMP that keeps the visitor's choice.

Start the SDK in waiting mode

Add consent: 'wait' to Flamio.init:

flamio.ts
import { Flamio } from '@flamioai/web-sdk';

Flamio.init({
  projectKey: 'YOUR_KEY_HERE',
  endpoint: 'https://api.flamio.org/api',
  consent: 'wait',
});

/**
 * Call from your cookie banner or CMP: once on page load with the stored
 * choice, and again whenever the visitor changes it.
 */
export function applyFlamioConsent(recordingAllowed: boolean): void {
  Flamio.consent(recordingAllowed ? 'granted' : 'denied');
}

YOUR_KEY_HERE is your project's API key from Flamio On-Live > Setup.

Grant when the visitor accepts

Call applyFlamioConsent(true) when the visitor accepts the category your banner uses for analytics or session recording. Also call it on every later page load where the stored choice is already "accepted".

Deny when the visitor declines or withdraws

Call applyFlamioConsent(false). On a page that was recording, recording stops at once and unsent data is thrown away.

Deploy and check

Deploy your site, accept the banner in a fresh browser window, use the site for a minute and close the tab. In Flamio On-Live > Setup, step 4 moves to Data is flowing once consenting visitors arrive.

This page stores the choice in localStorage, shows the banner only when there is no choice yet, and tells the SDK on every load.

index.html
<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <title>Example</title>
  </head>
  <body>
    <main>Your page</main>

    <div id="cookie-banner" hidden>
      <p>We record how visitors use this site to improve it.</p>
      <button id="accept-recording" type="button">Accept</button>
      <button id="decline-recording" type="button">Decline</button>
    </div>

    <script type="module">
      import { Flamio } from 'https://esm.sh/@flamioai/web-sdk@0.9.0';

      const CHOICE_KEY = 'recording-consent';
      const banner = document.getElementById('cookie-banner');

      Flamio.init({
        projectKey: 'YOUR_KEY_HERE',
        endpoint: 'https://api.flamio.org/api',
        consent: 'wait',
      });

      function choose(choice) {
        localStorage.setItem(CHOICE_KEY, choice);
        Flamio.consent(choice);
        banner.hidden = true;
      }

      const stored = localStorage.getItem(CHOICE_KEY);
      if (stored === 'granted' || stored === 'denied') {
        Flamio.consent(stored);
      } else {
        banner.hidden = false;
      }

      document.getElementById('accept-recording').addEventListener('click', () => choose('granted'));
      document.getElementById('decline-recording').addEventListener('click', () => choose('denied'));
    </script>
  </body>
</html>

YOUR_KEY_HERE is your project's API key from Flamio On-Live > Setup.

Most CMPs run a callback, or fire an event, when the visitor's choice is known on page load and whenever it changes. Call applyFlamioConsent from there with the value of the category that covers session recording. The exact callback name depends on your CMP — see its documentation.

consent-wiring.ts
import { applyFlamioConsent } from './flamio';

type ConsentState = { analytics: boolean };

// Replace with your CMP's "consent ready" and "consent changed" hooks.
export function onConsentKnown(state: ConsentState): void {
  applyFlamioConsent(state.analytics);
}

Identify signed-in users

Attach your user ID, name and email to On-Live sessions, so you can see who a visitor was and find all of their visits.

Control what is recorded

What the web SDK records and masks by default, and how to mask text, block elements and skip pages with classes, selectors and URL rules.

On this page

How consent works in the SDK
Before you begin
Start the SDK in waiting mode
Grant when the visitor accepts
Deny when the visitor declines or withdraws
Deploy and check
Example: a simple cookie banner
Example: a consent management platform
Related