Knowledge Base
Sign Up for Free

How do I allow viewers to consent to video view tracking (GDPR compliance)?

Avatar
Brendan O'Driscoll
  • Updated
Who Can Use This Feature?
Individual Plans
Free Pro
Business Plans
Essentials Growth Enterprise
Disclaimer: This article is provided for instructional purposes only. Vidyard does not guarantee the example code. It is meant to illustrate how you might use our player API methods to obtain viewer consent for browser cookies.


Vidyard's technology allows you and your business to understand more about your viewers, who they are, and how they engage with your video content.

In areas where data privacy regulations apply (e.g. Europe's GDPR), it is important to use Vidyard in compliance with applicable laws. That's why we've implemented a GDPR Compliance feature.

When enabled on your account, the GDPR Compliance feature forces video players in your account (or a specific folder) to only collect anonymized data until the viewer has given consent. Consent is managed through your implementation of the Vidyard Player API.

This article demonstrates how you can use the Player API to set in the browser's local storage whether a viewer has given consent to personal data collection.

Requirements

  • You must have the GDPR Compliance feature enabled on your Vidyard account
  • You or a member of your team should have the HTML, CSS, and Javascript knowledge to implement a consent workflow on your website

Managing viewer consent on a webpage

There are two Player API methods used to manage viewer consent on a webpage. Typically these are used in coordination with a prompt or banner that asks visitors if they want to accept browser cookies and other data collection tools.

Method

Description
VidyardV4.api.GDPR.consent (consent)

This method sets consent for each player on the page to true or false.

If true, consent is logged in the local storage of the viewer's browser.

If false, Vidyard will not collect personally identifiable data from the viewer. Consent is removed from local storage.
VidyardV4.api.GDPR.hasConsentOnReady (callback(consent))

This method checks for true or false against each player once all players on the page are ready.

The method will then run a callback function with the returned consent value. 

For example, the function might display or hide a consent banner based on the returned consent value.

The example below uses VidyardV4.api.GDPR.consent in a function to grantConsent or revokeConsent on button click.

VidyardV4.api.GDPR.hasConsentOnReady is used to show or hide a different banner depending on whether consent is set to true or false in local storage. 

Review the full example on CodePen.
<script>
var consentBanner = document.getElementById("gdpr-consent-banner");
var revokeBanner = document.getElementById("gdpr-revoke-banner");

function grantConsent() {
  VidyardV4.api.GDPR.consent(true);
  consentBanner.classList.add('hidden');
}

function revokeConsent() {
  VidyardV4.api.GDPR.consent(false);
  revokeBanner.classList.add('hidden');
}

function closeBanner() {
  consentBanner.classList.add('hidden');
  revokeBanner.classList.add('hidden');
}

window['onVidyardAPI'] = function() {
  VidyardV4.api.GDPR.hasConsentOnReady((hasConsent) => {
    if (hasConsent) {
      revokeBanner.classList.remove("hidden");
    } else {
      consentBanner.classList.remove("hidden");
    }
  });
}
</script>

Articles in this section

Related articles