JavaScript代码段
要在您的网站上启用Google Analytics(分析),您应在页面上的</head>
结束标记前添加一段JavaScript代码。以下是代码段的一部分:
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o), m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m) })(window,document,'script','//www.google-analytics.com/analytics.js','ga');
代码段运行时,首先会新建一个名为ga
的全局函数。接着,代码段会以异步方式将analytics.js库加载到页面上。
ga
全局函数是您与analytics.js库互动的主要方式。该函数会接受一个序列的参数,其中第一个参数代表Google Analytics(分析)命令。例如,在下面的默认代码段中:
ga('create', 'UA-XXXX-Y', 'auto'); // Creates a tracker. ga('send', 'pageview'); // Sends a pageview.
第一行会调用create
命令,而第二行会调用send
命令。
虽然JavaScript是以异步方式加载analytics.js库,但ga
函数应在库加载之前使用。当您开始执行命令时,每个命令都会添加至队列中。库完成加载后,系统就会执行队列中的所有命令,然后立即执行新命令。这可让开发者忽略Google Analytics(分析)的异步性质,从而专注于使用ga
函数。
重命名全局对象
在一些情况下,ga
这个变量名称可能已经被您页面上的某个现有对象占用。为避免覆盖现有对象,您可以重命名ga
函数,例如改为__gaTracker
。为此,您只需替换上述代码段中的ga
参数:
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o), m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m) })(window,document,'script','//www.google-analytics.com/analytics.js','__gaTracker');
这样,在调用命令时您就可以使用__gaTracker
而非ga
:
__gaTracker('create', 'UA-XXXX-Y', 'auto'); __gaTracker('send', 'pageview');
JavaScript代码段参考
以下参考显示的是添加了注释和空白的基本JavaScript代码段:
<!-- Google Analytics --> <script> /** * Creates a temporary global ga object and loads analy tics.js. * Paramenters o, a, and m are all used internally. They could have been declared using 'var', * instead they are declared as parameters to save 4 bytes ('var '). * * @param {Window} i The global context object. * @param {Document} s The DOM document object. * @param {string} o Must be 'script'. * @param {string} g URL of the analytics.js script. Inherits protocol from page. * @param {string} r Global name of analytics object. Defaults to 'ga'. * @param {DOMElement?} a Async script tag. * @param {DOMElement?} m First script tag in document. */ (function(i, s, o, g, r, a, m){ i['GoogleAnalyticsObject'] = r; // Acts as a pointer to support renaming. // Creates an initial ga() function. The queued commands will be executed once analytics.js loads. i[r] = i[r] || function() { (i[r].q = i[r].q || []).push(arguments) }, // Sets the time (as an integer) this tag was executed. Used for timing hits. i[r].l = 1 * new Date(); // Insert the script tag asynchronously. Inserts above current tag to prevent blocking in // addition to using the async attribute. a = s.createElement(o), m = s.getElementsByTagName(o)[0]; a.async = 1; a.src = g; m.parentNode.insertBefore(a, m) })(window, document, 'script', '//www.google-analytics.com/analytics.js', 'ga'); ga('create', 'UA-XXXX-Y', 'auto'); // Creates the tracker with default parameters. ga('send', 'pageview'); // Sends a pageview hit. </script> <!-- End Google Analytics -->
创建跟踪器对象
要发送数据至Google Analytics(分析),您必须创建跟踪对象。每个跟踪对象只能向一个Google Analytics(分析)网络媒体资源发送数据。为了创建跟踪对象,默认代码段使用了以下代码:
ga('create', 'UA-XXXX-Y', 'auto');
其中传送至ga
函数的第一个参数是create
命令,第二个参数是数据到达的目标网络媒体资源的ID。
自定义跟踪器对象
所有跟踪对象自定义工作都必须在最初创建对象时完成,方法是向ga
函数传递一个配置对象作为其最后一个参数。例如,要覆盖部分Cookie设置,您可以使用:
ga('create', 'UA-12345-6', { 'cookieDomain': 'foo.example.com', 'cookieName': 'myNewName', 'cookieExpires': 20000 });
在上面的示例中,Cookie的网域、名称和过期时间都已通过可选的配置对象进行了修改。
如需详细了解可在create命令中配置的所有字段的完整信息,请参阅“字段参考”文档中的create专有字段部分内容。
在localhost上测试
在一些情况下,您可能要在运行于localhost
上的网络服务器中测试analytics.js。要设置analytics.js Cookie,您需要使用以下命令停用默认的Cookie网域:
ga('create', 'UA-XXXX-Y', { 'cookieDomain': 'none' });
发送数据
在创建跟踪对象并将其关联至网络媒体资源后,您可以使用send
命令发送数据到该网络媒体资源。您发送到Google Analytics(分析)的数据称为Hit
(匹配),analytics.js库允许您通过指定hitType
来发送不同类型的数据。使用send
命令时,您还必须指定您要发送的数据的hitType
。
例如,要发送网页浏览匹配,您可以使用:
ga('send', 'pageview');
这会发送默认网址的数据给Google Analytics(分析)。
字段名称对象
在一些情况下,您可能要覆盖作为同一项网页浏览数据发送的多个值。analytics.js库允许您将字段名称对象作为send
命令中的最后一个参数来传递。这非常实用,因为它可让您设置许多额外的网页浏览属性,例如网页标题:
ga('send', 'pageview', { 'page': '/my-new-page', 'title': 'My New Page Title' });
如需详细了解配置跟踪器对象的全部方法,请参阅字段参考文档。
设置匹配回调
在一些情况下(例如当您跟踪出站链接时),您可能想要知道跟踪器何时完成数据传送。如此,您就可以确保只在系统已将用户的点击报告给Google Analytics(分析)之后才将用户送至他们的目的地。要满足此要求,您可以使用send
命令在字段名称对象中指定于analytics.js完成数据发送后马上执行的hitCallback
函数。您可以按如下所示来设置hitCallback
函数:
ga('send', 'pageview', { 'page': '/my-new-page', 'hitCallback': function() { alert('analytics.js done sending data'); } });
在此示例中,字段名称对象会配置page
参数并设置hitCallback
。一旦跟踪器完成数据发送,系统就会向用户显示提醒框。
设置在多个Send命令中使用的参数
在一些情况下,您可能想要设置一个参数并让该参数的值在多个send
命令中存续。例如,假设您要在一个网页上跟踪一种网页浏览和两种事件,这种情况下如果您想使用自己的自定义路径覆盖每个匹配的网页路径,您就可以在每个send
命令中设置新路径,或者按如下所示使用set
方法:
ga('set', 'page', '/my-custom-page'); ga('send', 'pageview'); ga('send', 'event', 'image1', 'clicked'); ga('send', 'event', 'image2', 'clicked');
在以上代码执行后,系统会为所有3个send命令发送覆盖后的/my-custom-page
页面。
推送函数
有时候,您可能只想在analytics.js库加载后执行代码。为此,您可以将函数作为参数传递给ga
函数。
ga(function() { alert('library done loading'); });
在库完成加载后,用户将看到提醒框。
获取参数
通过analytics.js,您可以使用get
命令获取在跟踪对象中设置的任何值。由于系统只在库加载后才会创建跟踪器对象,因此您必须在已推送的函数内获取参数。
ga(function(tracker) { var defaultPage = tracker.get('page'); });
在以上示例中,函数使用了名为tracker
的参数。在库加载完毕后,该函数即会执行,tracker
的值将是通过运行第一个create
命令创建的默认跟踪对象。随后,系统将使用tracker
获取默认的网页值。
强制采用SSL (HTTPS)
默认情况下,Google Analytics(分析)在发送出站请求时会匹配主机页面的协议。要强制Google Analytics(分析)总是使用SSL发送数据(即使是从非安全的HTTP页面发送时也是如此),请将forceSSL字段设为true
:
ga('create', 'UA-XXXX-Y', 'auto'); ga('set', 'forceSSL', true); // Send all data using SSL, even from insecure (HTTP) pages. ga('send', 'pageview');
使用多个跟踪对象
在一些情况下,您可能想要从单个页面发送数据到多个网络媒体资源。这对由多名负责人分别管理各个版块的网站非常有用;每名负责人都可以查看自己的网络媒体资源。
要满足这一要求,您必须为您要向其发送数据的每个网络媒体资源创建一个跟踪对象:
ga('create', 'UA-XXXX-Y', 'auto'); ga('create', 'UA-12345-6', 'auto', {'name': 'newTracker'}); // New tracker.
一旦运行,系统就会创建两个跟踪器对象。第一个跟踪器将成为默认跟踪对象,且没有名称。第二个跟踪器将命名为“newTracker
”。
要使用这两个跟踪器发送网页浏览数据,您应将跟踪器名称作为前缀添加到命令开头并紧跟着前缀再添加一个句点。比如:
ga('send', 'pageview'); ga('newTracker.send', 'pageview'); // Send page view for new tracker.
这就会将网页浏览数据同时发送给默认跟踪器和新跟踪器。
要在函数内按名称访问跟踪器对象,您可以使用getByName
方法:
ga(function() { var newTracker = ga.getByName('newTracker'); });
要获取已配置的所有跟踪器的列表,请使用getAll
方法:
ga(function() { var allTrackers = ga.getAll(); });
增强的链接归因
增强的链接归因功能会自动使用link元素ID区别单个页面上指向相同网址的多个链接,从而提高网页内分析报告的准确性。
要启用增强的链接归因,请执行以下操作:
- 在Google Analytics(分析)帐户的管理界面中启用增强的链接归因。
- 在每个页面上更新代码以加载“增强的链接归因”插件,示例如下:
ga('create', 'UA-XXXX-Y', 'auto'); ga('require', 'linkid'); // Load the plug-in. Note: this call will block until the plug-in is loaded. ga('send', 'pageview');
自定义增强的归因链接
增强的链接归因插件会使用链接(或父级元素)的元素ID和Cookie区分指向相同网址的链接。您可以在加载插件时提供配置选项,自定义插件在DOM的多大范围内查找元素ID,以及自定义此Cookie的行为。
ga('create', 'UA-XXXX-Y', 'auto'); ga('require', 'linkid', { 'cookieName': '_ela', // Cookie name. _gali by default. 'duration': 45, // Cookie duration. 30 seconds by default. 'levels': 5}); // Max DOM levels from link to look for element ID. 3 by default. ga('send', 'pageview');
IP匿名化
在一些情况下,您可能需要对发送给Google Analytics(分析)的匹配(HTTP请求)的IP地址做匿名化处理。您可以使用set
命令并将anonymizeIp
字段设为true
,为来自某个页面的所有匹配匿名化IP地址(在跟踪器对象的生命周期内):
ga('set', 'anonymizeIp', true);
要匿名化单个匹配的IP地址,您可为该匹配在可选配置对象中设置anonymizeIp
字段:
ga('send', 'pageview', { 'anonymizeIp': true });
要详细了解IP匿名化的工作原理,请参阅帮助中心内的Google Analytics(分析)中的IP匿名化一文。
用户选择停用
有时候,您可能需要在不删除JavaScript代码段的情况下停用页面上的Google Analytics(分析)跟踪代码。例如,如果网站上的隐私权政策允许用户选择停用Google Analytics(分析)跟踪,您可能就需要这样做。
analytics.js库现已添加一个窗口属性,您只要将其设为true
,就可以禁止analytics.js发送数据给Google Analytics(分析)。当Google Analytics(分析)尝试设置Cookie或发回数据到Google Analytics(分析)服务器时,它会检查此属性是否设为了true
。如果是,其效果相当于用户安装了“停用Google Analytics(分析)”浏览器插件。
要停用跟踪,请将以下窗口属性设为true
:
window['ga-disable-UA-XXXX-Y'] = true;
其中,值UA-XXXX-Y
对应于您要停用跟踪的网络媒体资源的ID。
此窗口属性必须在系统调用跟踪代码之前设置,且您必须在您要停用Google Analytics(分析)跟踪的每个页面上设置此属性。如果不设置此属性,或将其设为“false”,则跟踪功能将无法正常工作。
示例
以下是一段可用于为用户提供选择停用功能的简单代码示例。
首先,添加新的HTML链接到您的网站以执行选择停用逻辑:
<a href="javascript:gaOptout()">Click here to opt-out of Google Analytics</a>
然后在analytics.js代码段的前面添加以下代码段。请务必将gaProperty
的值从UA-XXXX-Y
替换为您网站上所用的媒体资源。这个值应与您传递给create
命令的相同。
<script> // Set to the same value as the web property used on the site var gaProperty = 'UA-XXXX-Y'; // Disable tracking if the opt-out cookie exists. var disableStr = 'ga-disable-' + gaProperty; if (document.cookie.indexOf(disableStr + '=true') > -1) { window[disableStr] = true; } // Opt-out function function gaOptout() { document.cookie = disableStr + '=true; expires=Thu, 31 Dec 2099 23:59:59 UTC; path=/'; window[disableStr] = true; } </script>
当用户点击选择停用HTML链接时,自定义的gaOptout
函数就会执行。该函数会设置在未来很长一段时间内有效的Cookie,并停用analytics.js数据收集。当用户回访此网站时,上述脚本将检查其是否设置了选择停用Cookie。如果是,系统就会停用analytics.js数据收集。