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

Avatar
Brendan O'Driscoll
Who Can Use This Feature?
Self-Service Plans
Free Pro Plus
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. 

<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>

Need support

Submit a ticket or start a chat. We'll provide a self-serve resource or connect you with our support team, available 24x5.

Chat with Our Team