Web Analytics工具domodomain的B/S交互实现机制分析

最近在 YMU网络的开发过程中试用了 domodomain 提供的 Web Analytics 服务，发现其分析功能很强，能很精确地定位访问来源，而且能展现一个用户的页面访问顺序，界面也挺好用（见截图）。但是其服务不是免费的，价格还挺贵的，不过你可以免费试用一个月哦！

在使用domodomain及Google Analytics这两种Web Analytics工具过程中，顺便分析了一下，
发现两者在Browser和Server间交互的实现机制是基本一致的。

下面以domodomain为例说明实现机制，其中目标监测网页：http://youmonitor.us/index.shtml；
而referrer为http://java-guru.javaeye.com/blog/133803。

1. 首先需要在index.shtml的<body>下增加以下js代码：

<script src="http://www.domodomain.com/DomoDomain/Sensor/DDSense.aspx?id=73083351-f537
    
    
     
     -45c
    
    0-abd3
    
    
     
     -88f
    
    171b
    
    
     
     24a
    
    85"
            type="text/javascript" language="javascript"></script>

其中id是申请服务时分配的标识。

2. 生成base page

当index.shtml被访问时，js代码(http://www.domodomain.com/DomoDomain/Sensor/DDSense.aspx?id=73083351-f537 -45c 0-abd3 -88f 171b 24a 85)被下载、执行，并返回如下结果：

function DD()

var n = new Date();

var sTimezone = n.getTimezoneOffset();

var sWidth=screen.width;

var sHeight=screen.height;

var sApp=navigator.appName;

var sReferrer=""+escape(document.referrer);

var sLocation=""+escape(document.URL);

var sColor=0;

if (sApp!="Netscape") sColor=screen.colorDepth;

else sColor=screen.pixelDepth;

document.write(

    "<div id=/"Layer2/" style=/"position:absolute;/"><img src=/"http://www.domodomain.com/Domodomain/Sensor

/DDWebSensor.aspx?id=73083351-f537
   
   
    
    -45c
   
   0-abd3
   
   
    
    -88f
   
   171b
   
   
    
    24a
   
   85&keywords="+

    "&rnd="+Math.random()+

    "&location="+sLocation+

    "&referrer="+sReferrer+

    "&color="+sColor+

    "&width="+sWidth+

    "&height="+sHeight+

    "&timezone="+sTimezone+

    "/" width=/"1/" height=/"1/" ></div>");

function DD2()

var n = new Date();

var sTimezone = n.getTimezoneOffset();

var sWidth=screen.width;

var sHeight=screen.height;

var sApp=navigator.appName;

var sReferrer=""+escape(document.referrer);

var sLocation=""+escape(document.URL);

var sColor=0;

if (sApp!="Netscape") sColor=screen.colorDepth;

else sColor=screen.pixelDepth;

document.write(

    "<div id=/"Layer2/" style=/"position:absolute;/"><img src=/"xxx?id=73083351-f537
   
   
    
    -45c
   
   0-abd3
   
   
    
    -88f
   
   171b
   
   
    
    24a
   
   85

&keywords="+

    "&rnd="+Math.random()+

    "&location="+sLocation+

    "&referrer="+sReferrer+

    "&color="+sColor+

    "&width="+sWidth+

    "&height="+sHeight+

    "&timezone="+sTimezone+

    "/" width=/"1/" height=/"1/" ></div>");

DD();

此时DD()函数会被进一步执行，DD函数会生成<img>对象。

3. load <img>对象

Base page装载完毕，浏览器会load其他内嵌对象，domodomain生成的<img>也会被获取，此时其src为访问来源记录url：

http://www.domodomain.com/Domodomain/Sensor/DDWebSensor.aspx?id=73083351-f537
   
   
    
    -45c
   
   0-abd3
   
   
    
    -88f
   
   171b
   
   
    
    24a
   
   85&keywords=
    &rnd=0.9592277737313195&location=http://youmonitor.us/&referrer= http://java-guru.javaeye.com/blog/133803
    &color=32&width=1152&height=864&timezone=-480

该URL发送目标网页、访问来源、访问机器的分辨率和时区等信息给服务器，并返回以下内容：

<!DOCTYPE html PUBLIC "-//W
   
   
    
    3C
   
   //DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional

.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" >

<head><title>

    Untitled Page

</title></head>

<body>

    <form name="form1" method="post" action="DDWebSensor.aspx?id=73083351-f537
   
   
    
    -45c
   
   0-abd3
   
   
    
    -88f
   
   171b
   
   
    
    24a
   
   85

&amp;keywords=&amp;rnd=0.9592277737313195&amp;location=http%
   
   
    
    3a
   
   %
   
   
    
    2f
   
   %2fyoumonitor.us%
   
   
    
    2f
   
   &amp;referrer=http

%
   
   
    
    3a
   
   %
   
   
    
    2f
   
   %2fjava-guru.javaeye.com%2fblog%
   
   
    
    2f
   
   133803&amp;color=32&amp;width=1152&amp;height=864&amp;timezone

=-480" id="form1">

<div>

<input type="hidden" name="__VIEWSTATE" id="__VIEWSTATE" value="/wEPDwUJNzgzNDMwNTMzZGS0W7hZuJUQAI4YTS7CaLL9MJYR
   
   
    
    9g

==" />

</div>

    <div>

    </div>

    </form>

</body>

</html>