連接器外掛程式可簡化跨網域評估的導入程序,如 analytics.js 請見跨網域評估指南。
總覽
跨網域評估的運作原理是在來源網域和目標網域之間共用專屬用戶端 ID。這個過程分為兩個步驟:
- 來源網域必須確保所有指向目的地網域的網址都包含來源網域的用戶端 ID。
- 使用者前往目的地網域時,目的地網域必須檢查網址是否包含用戶端 ID。
連結器外掛程式會在指向目標網域的網址中加入連結器參數,以便完成這項操作。linker 參數包含用戶端 ID,以及目前經過編碼的時間戳記和瀏覽器中繼資料。時間戳記和中繼資料可用來避免網址共用相關問題。
連結器參數看起來會像這樣:
_ga=1.199239214.1624002396.1440697407
在目的地網域上,系統會提供 allowLinker
欄位,當 true
指示 analytics.js 檢查網址中的連接器參數。如果找到連結器參數且參數有效,就會從參數中擷取用戶端 ID 並儲存。
連結器外掛程式允許網頁連結和表單中的網址,自動及手動新增連結器參數。在大多數情況下,建議您採用自動方式。
自動新增連接器參數
如要在來源網域中為指向目的地網域的網址設定跨網域自動連結,您「需要」require連接器外掛程式並呼叫其 autoLink
方法。
autoLink
您可以透過指令佇列呼叫 autoLink
方法。
執行後,analytics.js 會監聽指向目的地網域 (或網域) 的連結所獲得的點擊,並在開始導覽之前,立即將這些連結器參數加到這些連結中。連接器參數會在兩分鐘後失效,因此必須等待使用者點擊連結來新增連接器參數。
如果您的網站上有表單指向目標網域,則應指定選用的 decorateForms
參數,並設為 true
。
使用方式
ga('[trackerName.]linker:autoLink', domains, [useAnchor], [decorateForms]);
參數
名稱 | 類型 | 必要 | 說明 |
---|---|---|---|
domains |
Array[RexExp|string] |
是 | 要與網址 hostname 比對的字串陣列或規則運算式,指示要套用自動連結的網域。如果傳遞字串,analytics.js 會執行子字串比對,代表 example.com 會比對指向 blog.example.com 的連結。 |
useAnchor |
boolean |
否 | 如果為 true,系統會將連結器參數加到網址的錨定部分,而非查詢部分。 |
decorateForms |
boolean |
否 | 如果為 true,連結器外掛程式會在表單提交內容中加入連接器參數,指向與 domain 參數相符的目的地。 |
範例
// Loads the Linker plugin
ga('require', 'linker');
// Instructs the Linker plugin to automatically add linker parameters
// to all links and forms pointing to the domain "destination.com".
ga('linker:autoLink', ['destination.com'], false, true);
手動新增連接器參數
您可以透過 decorate
方法,手動將連接器參數新增至特定 <a>
或 <form>
元素。只有在未使用上述 autoLink
方法時,才需要使用此方法。
decorate
您可以透過指令佇列呼叫 decorate
方法。
連結器參數會在兩分鐘後過期,因此請確保呼叫裝飾方法時,必須盡量接近導覽發生的時間。在大多數情況下,應在事件處理常式中呼叫這個方法。
使用方式
ga('[trackerName.]linker:decorate', element, [useAnchor]);
參數
名稱 | 類型 | 必要 | 說明 |
---|---|---|---|
element |
HTMLElement |
是 | 要附加連接器參數的 <a> 或 <form> 元素。 |
useAnchor |
boolean |
否 | 如果為 true,系統會將連結器參數加到網址的錨定部分,而非查詢部分。 |
範例
// Loads the Linker plugin
ga('require', 'linker');
// Gets a reference to a link pointing to an external domain.
var destinationLink = document.getElementById('destination-link');
// Adds click handler that decorates `destinationLink`.
destinationLink.addEventListener('click', function() {
ga('linker:decorate', destinationLink);
});
linkerParam
除了 decorate
方法之外,您也可以透過 linkerParam
欄位手動取得追蹤器要使用的連結器參數。
ga(function(tracker) {
var linkerParam = tracker.get('linkerParam');
});
設定網站以接受連接器參數
當使用者到達連結網域含有網址連結器參數的網頁時,analytics.js 就必須要求尋找該參數。
您可以在建立追蹤程式時,將 allowLinker
欄位設為 true
,指示到達網頁尋找連接器參數:
ga('create', 'UA-XXXXXX-X', 'auto', {
allowLinker: true
});
雙向跨網域評估
這種使用者流程是指使用者一律從來源網域開始,且只有在進入目標網域時,才會視為單向跨網域評估。上述操作說明的假設是這類型的使用者流程。
如果不知道使用者首先會造訪哪個網域,請務必導入雙向跨網域評估,並將每個網域設為來源或目的地。
如要導入雙向跨網域評估,請在兩個網域上啟用自動連結,並且設定兩個網域接受連接器參數。
於 source.com
:
ga('create', 'UA-XXXXX-Y', 'auto', {allowLinker: true});
ga('require', 'linker');
ga('linker:autoLink', ['destination.com']);
於 destination.com
:
ga('create', 'UA-XXXXX-Y', 'auto', {allowLinker: true});
ga('require', 'linker');
ga('linker:autoLink', ['source.com']);
在所有網域上使用同一個程式碼片段
為進一步簡化,您可以在 autoLink
方法中列出所有要評估的網域,以便在每個網域上使用相同的程式碼片段:
ga('create', 'UA-XXXXX-Y', 'auto', {allowLinker: true});
ga('require', 'linker');
ga('linker:autoLink', ['source.com', 'destination.com']);