谷歌分析跟踪代碼 - 數據分析技術白皮書

04 谷歌分析跟踪代碼

第04章

JavaScript

Google Analytics（谷歌分析）基於JavaScript（JS）跟踪代碼來跟踪網站數據，這段代碼需要放在網站中需要進行數據跟踪的每一個頁面內。

創建一個新的Google Analytics賬號

首先，你需要創建一個Google Analytics賬號。

當你在Gmail中註冊一個新的電子郵件地址時，你將得到一個谷歌賬號，使用這個賬號，您便可通過以下方式登錄Google Analytics：

https://www.google.com/analytics/

登陸後，你的Google Analytics賬戶將自動創建成功。

賬戶結構

Google Analytics有三層結構：

賬戶
媒體資源
數據視圖

在同一個賬戶下，可以有多個媒體資源。

媒體資源

在你的Google Analytics賬戶下，每一個網站都必須在一個新的媒體資源下創建。

假設你擁有以下兩個網址：

面向PC端用戶（或PC端網站）的網站地址為：www.example.com
面向移動端用戶（或移動端網站）的網站地址為：m.example.com

你有三種選擇給你的網站設置Google Analytics。但最直接的方法是新創建兩個媒體資源：

把www.example.com設置為第一個新創建的媒體資源。
把m.example.com設置為第二個新創建的媒體資源。

在這種情況下，以上每一個網站（即媒體資源）都得到一個獨立的Google Analytics媒體資源ID (如： UA-XXXXXXXX-2 和 UA-XXXXXXXX-2)。

數據視圖

一個媒體資源可以包含多個數據視圖。當你在賬戶中創建一個新的媒體資源時，一個新的數據視圖也會被自動創建。這個數據視圖默認包含該媒體資源下的所有數據。

你可以創建多個數據視圖，在第二個數據視圖中你可以通過應用數據過濾器選取該媒體資源中的一部分數據。比如，第二個數據視圖僅包含那些通過移動設備訪問你網站的用戶。

賬戶、媒體資源和數據視圖

讓我們通過一張圖來了解你的Google Analytics賬戶下所有的媒體資源和數據視圖：

Tracking Code Setup

具有唯一性的Google Analytics ID對應上圖的媒體資源層，即圖中的UA-XXXXXXXX-1 和 UA-XXXXXXXX-2。

訪問權限

你可以將以下四種權限中的任何一種分配給一個谷歌賬號使用者，從而讓他們訪問Google Analytics報告。

閱讀和分析：最低級別的權限，可查看報告、創建自定義報告、創建細分和設置預警。
協作：可以創建個人資源並與他人共享。同時擁有“閱讀和分析”權限下的所有操作。
修改
管理用戶

如果你只想讓使用者查看報告，那麼應該授予他“閱讀和分析”的權限；如果你需要使用者修改管理信息，那麼需要授予他“修改”的權限；如果你需要使用者有添加或刪除其他用戶的權限，那麼應該授予他“管理用戶”的權限。

對於每一個Google Analytics的使用者，你可以選擇在媒體資源級別或視圖級別授予其權限。如：一個使用者在媒體資源m.example.com (UA-XXXXXXXX-2)被授予“修改”權限，那麼他便擁有對數據視圖2、數據視圖2a和數據視圖2b的修改權限。

Google Analytics跟踪代碼的設置

你需要在媒體資源下獲取JavaScript 跟踪代碼段（Google Analytics代碼），然後將代碼放在所有需要跟踪的頁面。

獲取Google Analytics代碼的具體方式如下，首選你需要登錄你的Google Analytics賬戶，在媒體資源下選擇你的網站，點擊進入跟踪代碼：

管理->跟踪信息->跟踪代碼

默認情況下，你的Google Analytics跟踪代碼應該是如下所示代碼段。這是最新版本的Google Analytics跟踪代碼，稱為Universal Analytics代碼。該跟踪代碼在每次頁面被加載時會記錄一次瀏覽。

<script>
(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('create', 'UA-XXXXXXXX-Y', 'auto');
ga('send', 'pageview');
</script>

首先看這段跟踪代碼的第一部分，它的主要作用是從谷歌服務器中獲取包含Google Analytics跟踪庫的analytics.js，並植入到你的網頁中。

(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');

這段Analytics.js庫使用了第一方cookie。

Cookie是一個存儲在用戶瀏覽器中的文本文件，體積很小，並有如下特徵：

包含實際數據的名稱-值對
過期之後即失效
負責發送域名和服務器路徑

當用戶瀏覽各個網頁時，Google Analytics的 JavaScript庫記錄用戶所查看的網頁相關信息。

analytics.js設置了以下兩種Cookie形式：

Cookie名稱	有效期	說明
_ga	2年	用於區分用戶
_gat	10分鐘	用於限制請求率

這段跟踪代碼的第二部分是Google Analytics跟踪代碼的核心，當安裝了Google Analytics跟踪代碼的網頁被加載時，有兩行命令將被觸發：

第一行代碼會觸發Google Analytics跟踪器，將數據發送到相應的媒體資源ID下。以如下代碼為例，數據將被發送至UA-XXXXXXXX-Y，這些數據被記錄在你網站所定義的Google Analytics cookie之下。
第二行代碼發送1次瀏覽記錄至Google Analytics

ga('create', 'UA-XXXXXXXX-Y', 'auto');
ga('send', 'pageview');

需要注意的是，為了使跟踪代碼能夠正常的工作，第一行’create’指令必須在’send’指令或其他附加的指令之前。這是因為追踪器必須是首要被觸發的。

第一行中的第三個參數’auto’定義了cookies的範圍。如果你有特別的需求，可以對第三個參數設置其他值。

如：

如果參數是’auto’且跟踪代碼添加在了域名example.com下的所有頁面，那麼cookies將包括www.example.com和m.example.com。
如果參數為空且跟踪代碼添加在了域名example.com下的所有頁面，那麼cookies將覆蓋www.example.com和m.example.com。
如果參數是’example.com’且跟踪代碼添加在了域名example.com下的所有頁面，那麼cookies將包括www.example.com和m.example.com。
如果參數是’www.example.com#039;且跟踪代碼添加在了域名example.com下的所有頁面，那麼cookies將僅包括www.example.com。
如果參數是’m.example.com’且跟踪代碼添加在了域名example.com下的所有頁面，那麼cookies將僅包括m.example.com。

在什麼位置放置跟踪代碼

Google Analytics的跟踪代碼是異步方式加載的，瀏覽器不用等整段代碼完全加載完就可以監測網頁的其他部分：

谷歌建議將此代碼添加在網站的<head></head>部分來更好地體現異步代碼的優勢。
也可將代碼放在<body></body>部分
如果你的網站是用某些開源代碼或付費的內容管理系統（CMS）創建的，那麼就需要得到CMS的修改權限，從而來添加/修改Google Analytics跟踪代碼。
如果你的網站是通過scratch生成，代碼的添加會稍微複雜些。你需要讓網站開發者來添加或修改Google Analytics跟踪代碼。

當然，在部署 GA 跟踪代碼前，你必須要先有一個正在運營的網站。你可很簡單的從例如 Siteground、Hostgator 或 Godaddy 購買一個網站寄存空間，並安裝 WordPress 作為的網站系統。具體可參考 WordPress 教學。

怎麼部署跟踪代碼？

如果你恰好有兩個網站，一個是PC端網站（www.example.com），另一個是移動端網站（m.example.com），兩個都在域名example.com下，那麼需要考慮不同的設置方式。

同一媒體資源ID的設置
不同媒體資源ID的設置
高級設置

同一媒體資源ID的設置

設置示例：

Tracking Code Setup

創建一個Google Analytics媒體資源ID（如：UA-XXXXXXXX-1）。
把媒體資源ID為UA-XXXXXXXX-1的跟踪代碼放置在你網站的所有頁面中（包括www.example.com和m.example.com）。

優勢：

在一個媒體資源ID下管理一個網站，所簡單易行。
在你的報告中，你擁有的數據是兩個網站總的會話數和總用戶數。

劣勢：

一個媒體資源ID需要存儲來自兩個網站的數據，那麼當數據量級增長很快時，這個媒體資源所展現的數據很快變成抽樣數據。
所有的報告所展示數據都是兩個網站數據的加和，難以將數據拆分到各個網站。

設置兩個不同的媒體資源ID

設置示例：

Trackind code Setup

創建兩個媒體資源ID，並把兩個網站分別放在不同的媒體資源ID下。如一個媒體資源ID（UA-XXXXXXXX-1）分配給www.example.com，另一個媒體資源ID（UA-XXXXXXXX-2）分配給m.example.com。
把UA-XXXXXXXX-1的跟踪代碼放置在www.example.com的所有頁面中，同樣把UA-XXXXXXXX-2的跟踪代碼放置在m.example.com的所有頁面中

優勢：

不同媒體資源ID的設置使得獨立分析兩個不同網站數據時變得更容易。
使用兩個不同的媒體資源ID，數據抽樣的風險較小。

劣勢：

你需要為你的網站維護兩個不同的媒體資源ID下兩個不同的跟踪代碼。
難以快速算出兩個網站的總會話數和總用戶數。

高級設置

設置示例：

Tracking Code Setup

創建一個Google Analytics媒體資源ID（如：UA-XXXXXXXX-1）。
在該媒體資源ID下為不同的網站創建更多的媒體資源ID，如一個ID（UA-XXXXXXXX-2）分配給www.example.com，另一個ID（UA-XXXXXXXX-3）分配給m.example.com。
把媒體資源ID為 UA-XXXXXXXX-1 的跟踪代碼放置在你網站的所有頁面中（包括www.example.com和m.example.com）。
把媒體資源ID為UA-XXXXXXXX-2的跟踪代碼放置在www.example.com的所有頁面中，同樣把媒體資源ID為UA-XXXXXXXX-3的跟踪代碼放置在m.example.com的所有頁面中。
然後對跟踪代碼作如下修改。

放置在www.example.com的代碼修改如下：

ga('create', 'UA-XXXXXXXX-1', 'auto');
ga('send', 'pageview');

ga('create', 'UA-XXXXXXXX-2', 'auto', 'wwwexample');
ga('wwwexample.send', 'pageview');

放置在m.example.com的代碼修改如下：

ga('create', 'UA-XXXXXXXX-1', 'auto');
ga('send', 'pageview');

ga('create', 'UA-XXXXXXXX-3', 'auto', 'mexample');
ga('mexample.send', 'pageview');

附加代碼的意思是：

為wwwexample 或mexample添加一個附加的Google Analytics跟踪器，跟踪器命名不限制於wwwexample 或mexample。
把瀏覽量回傳給wwwexample 或mexample。

優勢：

簡化數據的整合和分析，最大的媒體資源ID下兩個網站的總會話數和總用戶數是已經計算好的。針對每一個小的媒體資源ID（UA-XXXXXXXX-2和UA-XXXXXXXX-3），也是同樣的計算方法和展示方法。
即使最大的媒體資源ID進行了數據抽樣，另外兩個小的媒體資源ID（UA-XXXXXXXX-2和UA-XXXXXXXX-3）在數據抽樣時也沒有問題。

劣勢：

為兩個網站維護三個不同的媒體資源ID，操作複雜。
最大的媒體資源ID包含兩個網站的數據，在數據抽樣時有較大風險。

舊版本的跟踪代碼

在異步監測代碼發布之前，Google Analytics跟踪代碼使用的是同步監測，監測代碼如下：

<script type="text/javascript">
var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www.");
document.write(unescape("%3Cscript src='" + gaJsHost + "google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E"));
</script>
<script type="text/javascript">
try{
var pageTracker = _gat._getTracker("UA-XXXXXXXX-X");
pageTracker._trackPageview();
} catch(err) {}
</script>

這些是早期的Google Analytics跟踪代碼版本。異步監測代碼也經歷了早期的舊版本，以下是第一版異步監測代碼：

<script type="text/javascript">
var _gaq = _gaq || [];
_gaq.push(['_setAccount', 'UA-XXXXXXXX-X']);
_gaq.push(['_trackPageview']);
(function() {
var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
})();
</script>

這兩個舊版本的跟踪代碼和最新的代碼都具備相同的功能，即觸發Google Analytics跟踪器，並發送一個瀏覽記錄到Google Analytics。

如果你還在用上述兩個舊版Google Analytics跟踪代碼中的其中一版，那麼你需要升級到最新的版本（(i.e. Universal Analytics），也就是異步監測的第二版跟踪代碼。

Universal Analytics跟踪代碼具備舊版本代碼的所有功能（i.e.觸發跟踪器並回傳瀏覽量），此外還具備如下功能：

Universal Analytics跟踪代碼使用一個獨立cookie進行數據跟踪，且能夠在用戶的瀏覽器中生成一個用戶ID。
Universal Analytics可跨設備追踪用戶。當一個用戶使用相同的賬號信息在不同設備上登錄時，Universal Analytics便可以將將用戶的這一系列行為進行關聯。

數據分析技術白皮書在2016年11月正式出版。

英文版：Google Analytics Tracking Codes – 簡體中文版：谷歌分析跟踪代碼

Analytics Book繁體中文版上的內容按下列許可協議發布： CC Attribution-Noncommercial 4.0 International

Gordon Choi's Analytics Book