Treasure Data recommends that you implement any new features or functionality at your site using the Treasure Data JavaScript SDK version 3. It manages cookies differently. Be aware when referring to most of these articles that you need to define the suggested event collectors and Treasure Data JavaScript SDK version 3 calls in your solutions.

What is Cookie Consent

Cookie Consent is a free JavaScript plugin for alerting users about the use of cookies on your website.

It is designed to help you comply with data privacy regulations such as the GDPR and still provide a quality user experience.

https://cookieconsent.insites.com/documentation/about-cookie-consent/


Customize Your Layout


You can choose from a wide range of layouts and color schemes, including the following example:



User Views

When a user accesses your web page for the first time, the following info is included in the stored cookie by default (td_ip, td_client_id and td_global_id).

If the user selects "Decline" on the cookie consent prompt, the following fields (td_ip, td_client_id and td_global_id) will not be sent on any subsequent page visits by this user.

Run a sample

  1. To run a test, you need to create an HTML using test.html

    Replace the following content with your customized details:

    a. 'WRITE YOUR WRITE ONLY API KEY'

    b. 'WRITE YOUR DB NAME'

    c. 'WRITE YOUR TABLE NAME'

    <html>
     <head>
      <script type="text/javascript">
    !function(t,e){if(void 0===e[t]){e[t]=function(){e[t].clients.push(this),this._init=[Array.prototype.slice.call(arguments)]},e[t].clients=[];for(var r=function(t){return function(){return this["_"+t]=this["_"+t]||[],this["_"+t].push(Array.prototype.slice.call(arguments)),this}},s=["addRecord","blockEvents","fetchServerCookie","fetchGlobalID","fetchUserSegments","resetUUID","ready","setSignedMode","setAnonymousMode","set","trackEvent","trackPageview","trackClicks","unblockEvents"],n=0;n<s.length;n++){var c=s[n];e[t].prototype[c]=r(c)}var o=document.createElement("script");o.type="text/javascript",o.async=!0,o.src=("https:"===document.location.protocol?"https:":"http:")+"//cdn.treasuredata.com/sdk/2.5/td.min.js";var a=document.getElementsByTagName("script")[0];a.parentNode.insertBefore(o,a)}}("Treasure",this);
    
           // Configure an instance for your database
       var td = new Treasure({
       host: 'in.treasuredata.com',
       writeKey: 'WRITE YOUR WRITE ONLY API KEY',
       database: 'WRITE YOUR DB NAME',
     
       startInSignedMode: true
       });
      
       // Enable cross-domain tracking
       td.set('$global', 'td_global_id', 'td_global_id');
      
       // Track pageview information to a table
       td.trackPageview('WRITE YOUR TABLE NAME');
      </script>
      
      <!-- =======================================================
      Start https://cookieconsent.insites.com/ tag
      ======================================================= -->
      <link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/cookieconsent2/3.1.0/cookieconsent.min.css" />
      <script src="https://cdnjs.cloudflare.com/ajax/libs/cookieconsent2/3.1.0/cookieconsent.min.js"></script>
      <script>
       window.addEventListener("load", function(){
        window.cookieconsent.initialise({
         "palette": {
         "popup": {
         "background": "#3c404d",
         "text": "#d6d6d6"
        },
        "button": {
         "background": "#8bed4f"
        }
       },
       "type": "opt-out",
       "revokable": true,
       onStatusChange: function(status) {
        this.hasConsented() ? td.setSignedMode() : td.setAnonymousMode();
       },
      })
      });
      </script>
     </head>
    <body></body>
    </html> 
  2. Set up a simple HTTP server.

    For example on Mac:

    sudo apachectl start
    sudo cp test.html /Library/WebServer/Documents
    # setup owner and permission same with other files in copy destination folder above
    # sudo chown
    # sudo chmod


    Try to access from a browser at: http://127.0.0.1/test.html


    Or, you can refer to this live demo: https://treasure-data.github.io/js-examples/consensus-management/index.html

    You will see a blank page with a bar on the bottom.

  3. Do not select the "Allow cookies" option.


  4. Refresh the page several times and check the destination table that the tracking info is being sent to.

    After a few minutes at most, you should begin to see the streaming data in the destination table.

  5. Confirm the streaming data by running a query similar to the following:

    select td_ip,td_client_id,td_global_id from <db name>.<tbl name>



  6. Select Decline on test.html page.

  7. Refresh the page.

    After the refresh, the consent prompt should no longer appear.


  8. Check the destination table of web tracking again.

    After a few minutes at most, you should begin to see the new streaming data in the destination table.


  9. Confirm by running a query similar to the following:

    select td_ip,td_client_id,td_global_id from <db name>.<tbl name>


    In the following table, you can see the columns td_ip, td_client_id and td_global_id were excluded from the streaming data sent to TD.


  10. The files can be cleaned by prompting the HTTP server to stop running on your local PC and delete test.html file.

    sudo apachectl stop
    sudo rm -f Library/WebServer/Documents/test.html
  • No labels