List your Tracking Technologies

Overview

If you are using Transcend's Consent to ensure compliance on your websites, under some laws including the GDPR, you are required to disclose the list of trackers and cookies on your website. This is traditionally done within a "Cookie Policy".

This guide will help you figure out a few ways you can create and configure and automatically kept up to date table of tracking technologies. It can be done either:

1) On a Transcend Privacy Center

2) Embedded directly into a policy on your website

If you are using the Privacy Center to host your Privacy Policies or serve your users' Privacy Requests, you can set up an additional tab to list all data flows and cookies present on your websites.

Privacy Center Tracking Technologies Tab
  1. Go to your Privacy Center -> Tracking Technologies in the Admin Dashboard
  2. Turn on Show Tracking Technologies tab? to display the Tracking Technologies tab in your Privacy Center.
  3. Select Show cookies in Tracking Technologies table? to display your websites' cookies in the Tracking Technologies tab.
  4. Select Show data flows in Tracking Technologies table? to display your websites' data flows (network requests) in the Tracking Technologies tab.
  5. Select Show button to change consent preferences? to allow for users to open the consent modal and opt out directly on that page.
  6. Remember to Save Changes, Preview Changes, and Review & Publish to visualize and publish the changes you just made to your Privacy Center.
Your Privacy Center Settings

If you are managing multiple websites or subdomains in a single instance of Transcend - you may have a desire to break down the set of tracking technologies on each website. This may not be required by law - but can help build trust with your customers e.g. I want our customers to know that our core application does not do advertising or analytics, that only happens on our splash page.

  1. Go to your Privacy Center -> Tracking Technologies in the Admin Dashboard
  2. Make sure you turn on Allow site filter on Tracking Technologies table?
  3. Go to Consent Management -> Developer Settings -> Deployed Sites
  4. For any websites that you do not want rendered in the Privacy Center (e.g. a staging or development site), you will want to toggle off Include in Metadata
Disable certain deployed sites from showing on the Privacy Center

5. Publish your Consent Manager to the production bundle

6. Go to your Privacy Center -> Tracking Technologies and publish the Privacy Center

You will then see this Select Website option on the Privacy Center and a new Sites column in the table.

Show select website option on Tracking Technologies page on Privacy Center

If you wish to link directly to a specific website filter, you can do so using the host query parameter. e.g. https://e-shop-it.trsnd.co/trackers/en/?host=eshopit.co

You can also access the list of data flows and cookies discovered by Transcend's Consent, and create your own custom page to document them.

Custom Implementation of Tracking Technologies Tab

Sometimes you need to show the same tracker inventory somewhere else (support portal, static site, email). You can use the airgap runtime to download the exact data set that powers the Privacy Center.

const metadata = await airgap.getMetadata();

getMetadata() will fetch the published metadata.json file that is associated with each airgap.js bundle. You can see an example here

{
  "services": [
    {
      "title": "Internal Service",
      "description": "A service maintained internally by our company.",
      "sites": ["e-shop-it.trsnd.co"],
      "logoSquare": "https://images.ctfassets.net/47c3v3p6lsvu/405DEQfhOz4NROtP4EfNeC/0b1fd91cdf81d406690496195200e529/Servers.svg",
      "integrationName": "internalService",
      "cookies": [
        {
          "name": "showAnnouncementBanner",
          "trackingPurposes": ["Essential"],
          "maxAge": null
        },
        {
          "name": "viewCount",
          "trackingPurposes": ["Analytics"],
          "maxAge": null
        },
        {
          "name": "uniqueRunId",
          "trackingPurposes": ["Analytics"],
          "maxAge": null
        },
        {
          "name": "viewCountHttpOnly",
          "trackingPurposes": ["Analytics"],
          "maxAge": null
        }
      ],
      "dataFlows": [
        {
          "value": "prod-backend-company-uploads-transcend-io.s3.amazonaws.com",
          "type": "HOST",
          "trackingPurposes": ["Essential"]
        },
        {
          "value": "misc-assets-transcend-io.s3.amazonaws.com",
          "type": "HOST",
          "trackingPurposes": ["Essential"]
        },
        {
          "value": "transcend-testing-assets.s3-us-west-1.amazonaws.com",
          "type": "HOST",
          "trackingPurposes": ["Essential"]
        },
        {
          "value": "images.ctfassets.net",
          "type": "HOST",
          "trackingPurposes": ["Essential"]
        }
      ]
    },
    {
      "title": "Snap Ads",
      "description": "Snap Ads is a mobile advertising platform for Snapchat.",
      "sites": ["eshopit.co"],
      "logoSquare": "https://images.ctfassets.net/47c3v3p6lsvu/5n6hYg0CZFw5wiMEuMfujF/b1d7bced0d02768fb01564803fc389fa/Snap_Ads.svg",
      "integrationName": "snapAds",
      "cookies": [],
      "dataFlows": [
        {
          "value": "sc-static.net",
          "type": "HOST",
          "trackingPurposes": ["Functional", "Analytics", "SaleOfInfo"]
        },
        {
          "value": "tr6.snapchat.com",
          "type": "HOST",
          "trackingPurposes": ["HealthData"]
        },
        {
          "value": "tr.snapchat.com",
          "type": "HOST",
          "trackingPurposes": ["Advertising", "SaleOfInfo"]
        }
      ]
    },
    {
      "title": "Heap",
      "description": "Heap captures and measures every action in the user's web app.",
      "sites": ["eshopit.co"],
      "logoSquare": "https://images.ctfassets.net/47c3v3p6lsvu/heapLogoSquare/408377a83aea411de9a329747a83f06d/Heap.svg",
      "integrationName": "heap",
      "cookies": [
        {
          "name": "^_hp2_hld.*",
          "trackingPurposes": ["Analytics"],
          "maxAge": null
        },
        {
          "name": "^_hp2_ses_props.*",
          "trackingPurposes": ["Analytics"],
          "maxAge": null
        }
      ],
      "dataFlows": [
        {
          "value": "cdn.heapanalytics.com",
          "type": "HOST",
          "trackingPurposes": ["SaleOfInfo"]
        },
        {
          "value": "heapanalytics.com",
          "type": "HOST",
          "trackingPurposes": ["Analytics", "Advertising", "SaleOfInfo"]
        }
      ]
    },
    {
      "title": "Google Tag Manager",
      "description": "Google Tag Manager helps marketers control the end-to-end process of adding website tags.",
      "sites": ["eshopit.co"],
      "logoSquare": "https://images.ctfassets.net/47c3v3p6lsvu/googleTagManagerLogoSquare/bc58ee41b55cbb437b48eecb7d8be377/Google_Tag_Manager.svg",
      "integrationName": "googleTagManager",
      "cookies": [],
      "dataFlows": [
        {
          "value": "//www.googletagmanager.com/gtm.js",
          "type": "PATH",
          "trackingPurposes": ["Essential"]
        },
        {
          "value": "//www.googletagmanager.com/gtag/js",
          "type": "PATH",
          "trackingPurposes": ["Essential"]
        }
      ]
    },
    {
      "title": "Transcend",
      "description": "Zero trust architecture. Built for engineers. Transcend makes it simple to give your users the privacy they deserve, while automating CCPA/GDPR compliance.",
      "sites": ["eshopit.co", "e-shop-it.trsnd.co"],
      "logoSquare": "https://images.ctfassets.net/47c3v3p6lsvu/3GKcmAPtt3P3vySdrol7xa/fa17494cb00b0c1f33012df1cccd0c06/Transcend_Logo_Mark__Color_.svg",
      "integrationName": "transcend",
      "cookies": [],
      "dataFlows": [
        {
          "value": "transcend-cdn.com",
          "type": "HOST",
          "trackingPurposes": ["Essential"]
        },
        {
          "value": "transcend.io",
          "type": "HOST",
          "trackingPurposes": ["Essential"]
        },
        {
          "value": "cdn.dev.trancsend.com",
          "type": "HOST",
          "trackingPurposes": ["Essential"]
        }
      ]
    },
    {
      "title": "Pinterest Ads",
      "description": "Pinterest is a visual bookmarking tool for saving and discovering creative ideas.",
      "sites": ["eshopit.co"],
      "logoSquare": "https://images.ctfassets.net/47c3v3p6lsvu/pinterestLogoSquare/e79cfcb3a14798b60b515e66fe42af9a/Pinterest_Ads.svg",
      "integrationName": "pinterestAds",
      "cookies": [
        {
          "name": "_pin_unauth",
          "trackingPurposes": ["Advertising"],
          "maxAge": null
        }
      ],
      "dataFlows": [
        {
          "value": "s.pinimg.com",
          "type": "HOST",
          "trackingPurposes": ["Advertising", "SaleOfInfo"]
        },
        {
          "value": "www.pinterest.com",
          "type": "HOST",
          "trackingPurposes": ["Advertising"]
        }
      ]
    },
    {
      "title": "Contentful",
      "description": "Contentful offers a headless content management system that helps organizations deliver content across channels",
      "sites": [],
      "logoSquare": "https://images.ctfassets.net/47c3v3p6lsvu/2vpayQYJtt0jARD6wUZgjp/5077ebf93e6b24a8de3942414129973e/Contentful.svg",
      "integrationName": "contentful",
      "cookies": [],
      "dataFlows": [
        {
          "value": "assets.ctfassets.net",
          "type": "HOST",
          "trackingPurposes": [
            "Functional",
            "Analytics",
            "Advertising",
            "SaleOfInfo"
          ]
        }
      ]
    },
  
  ],
  "purposes": {
    // ....
  },
  "macroregions": [
    // ...
  ],
  "regimePurposeScopes": [
    // ....
  ],
  "regionRegimesMap": [
    // ...
  ],
  "regimePurposeOptOuts": [
    // ...
  ],
  "purposeMap": {
    // ...
  },
  "loadOptions": {
    // ...
  },
  "cdn": "https://transcend-cdn.com"
}

Because each service now includes a sites array, you can recreate the Privacy Center’s filtering logic in your own experience:

async function getServicesForHost(host) {
    const metadata = await airgap.getMetadata();

    return metadata.services.filter((service) => {
        // Always include services that have no site metadata.
        if (!service.sites?.length) {
            return true;
        }
        return service.sites.includes(host);
    });
}

Here is a minimal vanilla-JS helper that converts the metadata for a single host into an HTML table. You can drop this into any page where airgap is loaded:

async function renderTrackingTable(containerId, host) {
  const metadata = await airgap.getMetadata();

  const services = metadata.services.filter((service) => {
    if (!host || !service.sites?.length) {
      return true;
    }
    return service.sites.includes(host);
  });

  const container = document.getElementById(containerId);
  if (!container) {
    throw new Error(`Container not found: ${containerId}`);
  }

  // Clear container
  container.innerHTML = "";

  const table = document.createElement("table");
  const thead = document.createElement("thead");
  const headerRow = document.createElement("tr");

  ["Service", "Description", "Data Flows", "Cookies", "Sites"].forEach((text) => {
    const th = document.createElement("th");
    th.textContent = text;
    headerRow.appendChild(th);
  });

  thead.appendChild(headerRow);
  table.appendChild(thead);

  const tbody = document.createElement("tbody");

  for (const service of services) {
    const tr = document.createElement("tr");

    // Service
    const serviceTd = document.createElement("td");
    serviceTd.textContent = service.title || "";
    tr.appendChild(serviceTd);

    // Description
    const descTd = document.createElement("td");
    descTd.textContent = service.description || "";
    tr.appendChild(descTd);

    // Data Flows
    const dataFlowsTd = document.createElement("td");
    const dataFlowsUl = document.createElement("ul");

    (service.dataFlows || []).forEach((flow) => {
      const li = document.createElement("li");
      li.textContent = flow.value;
      dataFlowsUl.appendChild(li);
    });

    dataFlowsTd.appendChild(dataFlowsUl);
    tr.appendChild(dataFlowsTd);

    // Cookies
    const cookiesTd = document.createElement("td");
    const cookiesUl = document.createElement("ul");

    (service.cookies || []).forEach((cookie) => {
      const li = document.createElement("li");
      li.textContent = cookie.name;
      cookiesUl.appendChild(li);
    });

    cookiesTd.appendChild(cookiesUl);
    tr.appendChild(cookiesTd);

    // Sites
    const sitesTd = document.createElement("td");
    const sitesUl = document.createElement("ul");

    (service.sites || []).forEach((site) => {
      const li = document.createElement("li");
      li.textContent = site;
      sitesUl.appendChild(li);
    });

    sitesTd.appendChild(sitesUl);
    tr.appendChild(sitesTd);

    tbody.appendChild(tr);
  }

  table.appendChild(tbody);
  container.appendChild(table);
}

Call renderTrackingTable('tracker-table', 'docs.example.com') after airgap initializes to embed a filtered list anywhere on your site.

  • If a site is missing from the dropdown and from metadata, confirm the domain exists in the Domains list table and that at least one cookie or data flow references it.
  • Hosts are stored without protocol (e.g., `docs.example.com`). The `SelectConsentSite` dropdown adds `https://` automatically when you click the external-link icon.
  • The `host` query param accepts either domains or IP addresses. Stick to hostnames unless you intentionally track an on-prem IP.
  • airgap.getMetadata() runs in the browser, so do not call it from a Web Worker or Worklet context. If you need to access the metadata outside of browser context, just fetch the raw file e.g. example here