How to use Hosted Datalayer like a generic JSONP service

[UnknownJ]

TIQ's Hosted Data Layer functionality is great, but it's also possible to extend it to behave more like a JSONP service, running a callback immediately upon the loading of the data. For example, you might not want to hold up the initial utag.view() event waiting for the responses to come back (or indeed, you might be running extensions that don't play nicely with the noview config option), but would like to fire a specific tag once a response comes back.

The following function will allow you to grab a data object from the CDN, and pass it to a given callback object:

function getDLE(key, callback, errorFunction){

  var enrichmentData;
  var account = "your-account-name";
  var profile = "profile-name";

  try {
    enrichmentData = window.utag.globals.dle.enrichments;
  } catch(e){
    var logFunction = console.log;
    if(window.utag && window.utag.DB) logFunction = window.utag.DB;
    if(errorFunction && typeof errorFunction == "function") logFunction = errorFunction;
    logFunction("Attempted to use Hosted Data Layer but extension hadn't initialised");
    return false;
  }

  utag.ut.loader({
    type: "script",
    src: "https://tags.tiqcdn.com/dle/" + account + "/" + profile + "/" + key + ".js?cb=" + Math.random(),
    cb: function(){
      var res = enrichmentData[key];
      if(typeof callback == "function" && typeof res != "undefined"){
        callback(res);
      }
    }
  });

  return true;
}

You can then run it as follows:

getDLE("product002",console.log,console.error);

Which will pass the object returned by product002.js into the console.log function. If you don't have Hosted Datalayer enabled in your profile (or if it hasn't initialised when you try to run the call), it'll produce a console error.

In general this doesn't let you do much that the vanilla functionality doesn't already do, but there are a few special use cases for it:

1. Chaining lookups, if you wanted to perform a Hosted Datalayer request based on a value retrieved from a Hosted Datalayer call
2. Performing a lookup after the initial page load - for example, in a single page application where your lookup key may only become available after the customer has reached a certain point

You can in theory make it work without using the Hosted Datalayer extension at all, by creating the window.utag.globals.dle.enrichments object from scratch in advance, but I'm not sure that that would be best practice..

Bonus Awesome / Awful Use Case:

Tired of defining your tag mappings in advance? Want to live life on the edge defining them whenever you like without a publish? Why not have an empty mapping object in your tag file, and then create a tag scoped extension which:

1. Tests whether the u.map object has no keys (!Object.keys(u.map).length)
2. If it has no keys:
   1. Run a DLE lookup against a known Hosted Datalayer key with a callback that:
      1. Writes the response object to u.map
      2. Fires a utag.view/link against that specific tag ID
   2. Return false
3. If it has keys, do nothing

Effectively what happens is that when the tag fires for the first time, with an empty mapping object, it'll request its data mapping from the server and abort that particular send. Upon receiving the mapping data, it'll load it into the tag, and then re-fire itself.

Now, I have no idea why you'd want to store your variable mappings dynamically outside of TIQ and update them outside of a full profile publish. But it's a decent illustration of the power the Hosted Datalayer functionality has. Post your own dangerous use cases below :o)

[kathleen_jo]

Interesting use case @UnknownJ! My goodness I love how creative this is!

Great stuff! Keep it coming!