Debugging utag.js with Charles Proxy

Debugging utag.js with Charles Proxy

by on ‎02-23-2018 01:46 PM - edited on ‎02-23-2018 01:47 PM by Community Manager (355 Views)

This article will show how to use Charles Proxy to obtain more advanced output from utag.DB.

Table of Contents Placeholder

Prerequisites

Create Rewrite Rules from XML File

  1. Save the attached file titled "Charles_uTag_DB_Upgrade.xml" locally to your computer
  2. Open Charles Rewrite Settings (Tools > Rewrite)
  3. Click Import (See below)
  4. Select the file and click Open.
  5. Click Apply and OK to complete the import.

Charles_uTag_DB_Upgrade.png

Alternatively, if you are familiar with Charles and want to get hands on, instructions for achieving this manually are provided below.

Create Rewrite Rules Manually

  1. Select Tools > Rewrite from the Charles Menu.
  2. Copy and paste the below code into the following Rewrite Rule text fields.

    For Match > Value

    ;utag.o['

    For Replace > Value

    ; utag.ut.typeOf = function(e) {return ({}).toString.call(e).match(/\s([a-zA-Z]+)/)[1].toLowerCase();}; utag.DB = function(a, b) {   var t;   if (utag.cfg.utagdb === false) {     return;   } else if (typeof utag.cfg.utagdb == "undefined") {     utag.db_log = [];     b = document.cookie + '';     utag.cfg.utagdb = ((b.indexOf('utagdb=true') >= 0) ? true : false);   }   if (utag.cfg.utagdb === true) {     var con = window.console;     if (utag.ut.typeOf(a) === "error") {       utag.db_log.push(a);       t = "";       if (a.stack && a.stack.split) {         t = a.stack.split("\n")[1].replace(/^[\s\uFEFF\xA0]+|[\s\uFEFF\xA0]+$/g, '').replace(/^at\s/, "");       }       if (con) {         t = "utag - Error : " + t + " "+ a.message;         if (con.warn) {           con.warn(t);         } else if (con.log){           con.log(t);         }       }     } else {       t = (utag.ut.typeOf(a) == "object") ? utag.handler.C(a) : a;       utag.db_log.push(t);       if (con && con.log) con.log("utag - ", t);     }   } };utag.o[' 
  3. Your Rewrite Rule should look something like this:

    Rwrite.png

  4. Copy and paste the below into ______ to add extra utag.DB calls to try/catches.

    For Match > Value (Regex)

    \}catch\((.*?)\)\{

    For Value Match:

    }catch($1){utag.DB($1); 

Output Samples

A sample of the enhanced output in Google Chrome DevTools

enhanced DB.png

The two body rewrites should look like this:

charles-proxy-utag-rewrite-rules.png