Panduan ini menjelaskan cara mengukur peristiwa di beberapa domain menggunakan analytics.js.
Ringkasan
Library analytics.js menggunakan client ID unik untuk menentukan apakah seseorang adalah pengguna yang kembali atau pengguna baru. Pengguna dianggap sebagai pengguna yang kembali jika hit dengan client ID yang cocok telah dikirim ke properti yang sama.
Secara default, client ID disimpan di cookie browser, yang berarti hanya dapat diakses oleh halaman di domain yang sama. Untuk melacak Client-ID yang sama untuk pengguna tertentu di domain yang berbeda-beda, gunakan pelacakan lintas-domain.
Untuk membagikan client ID di seluruh domain, Anda dapat menambahkannya sebagai parameter kueri ke URL yang mengarah dari domain saat ini (domain sumber) ke domain tujuan yang ingin Anda ukur. Saat pengguna mengklik link atau mengirim formulir di domain sumber dan membuka domain tujuan, kode di halaman tujuan dapat mengakses client ID dengan membacanya dari URL.
Mendapatkan client ID di domain sumber
Untuk mengambil client ID di domain sumber, gunakan metode get
:
ga(function(tracker) {
var clientId = tracker.get('clientId');
});
Setelah memiliki client ID di domain sumber, Anda dapat menambahkannya ke link yang mengarah ke domain tujuan.
<a href="https://destination.com/?clientId=XXXXXX">destination.com</a>
Menetapkan client ID di domain tujuan
Anda dapat memberi tahu objek pelacak di domain tujuan client ID apa yang akan digunakan dengan menentukan kolom client ID di perintah create
:
ga('create', 'UA-XXXXX-Y', 'auto', {
'clientId': getClientIdFromUrl()
});
Jika client ID sudah ada di domain tujuan, metode ini akan menimpanya.
Mendeteksi berbagi URL
Potensi masalah saat meneruskan client ID di URL adalah pengguna membagikan URL, dan bisa saja pengguna membagikan URL yang berisi client ID milik orang lain.
Salah satu cara untuk menghindari masalah ini adalah dengan menambahkan stempel waktu ke client ID. Hal ini memungkinkan Anda mendeteksi kapan URL aslinya dibuat, dan jika sudah terlalu lama, anggap client ID tersebut tidak valid. Selain stempel waktu, Anda dapat menambahkan string agen pengguna atau metadata khusus perangkat atau browser lainnya. Kemudian di domain tujuan, jika metadata tidak cocok, Anda akan mengetahui bahwa client ID berasal dari orang lain.
Mengabaikan rujukan mandiri
Kampanye rujukan baru akan dibuat setiap kali perujuk dokumen halaman berasal dari hostname yang tidak cocok dengan entri dalam daftar Pengecualian Rujukan untuk properti Anda.
Secara default, daftar Pengecualian Rujukan hanya menyertakan domain yang Anda berikan saat properti pertama kali dibuat. Agar kampanye rujukan baru tidak dibuat saat pengguna menjelajah di seluruh domain, Anda harus menambahkan entri untuk setiap domain yang ingin diukur dalam daftar Pengecualian Rujukan.
iFrame
Teknik yang dijelaskan di atas memerlukan kode JavaScript yang berjalan setelah analytics.js dimuat. Karena elemen <iframe>
biasanya ada di halaman sebelum analytics.js dimuat, menambahkan client ID ke URL di parameter sumber iframe sering kali bukan merupakan opsi.
Untuk mengatasi masalah ini, Anda dapat mengonfigurasi halaman di dalam iframe untuk menunda pembuatan pelacaknya setelah menerima data client ID dari halaman induk. Dan di halaman induk, Anda mengonfigurasinya untuk mengirim client ID ke halaman iframe menggunakan postMessage.
Berikut adalah contoh kode halaman induk di source.com
:
<iframe id="destination-frame" src="https://destination.com"></iframe>
<script>
ga('create', 'UA-XXXXX-Y', 'auto');
ga(function(tracker) {
// Gets the client ID of the default tracker.
var clientId = tracker.get('clientId');
// Gets a reference to the window object of the destionation iframe.
var frameWindow = document.getElementById('destination-frame').contentWindow;
// Sends the client ID to the window inside the destination frame.
frameWindow.postMessage(clientId, 'https://destination.com');
});
</script>
Dan berikut ini adalah kode yang akan menerima pesan dalam iframe yang dihosting di destination.com
:
window.addEventListener('message', function(event) {
// Ignores messages from untrusted domains.
if (event.origin != 'https://destination.com') return;
ga('create', 'UA-XXXXX-Y', 'auto', {
clientId: event.data
});
});
Bisa saja analytics.js akan gagal dimuat di halaman induk, sehingga halaman di iframe tidak akan pernah menerima client ID. Cara Anda menangani kasus ini bergantung pada seberapa penting kecocokan client ID.
Jika Anda hanya ingin mengambil data ketika Anda tahu bahwa client ID sama, kode di atas sudah cukup. Jika Anda ingin mengambil data di halaman dalam frame, terlepas dari apakah halaman tersebut menerima client ID dari halaman induk atau tidak, Anda harus menambahkan penggantian.
Kode berikut menggunakan waktu tunggu di halaman dalam iframe untuk menangani kasus ketika halaman induk lambat atau gagal mengirim client ID:
// Stores whether or not the tracker has been created.
var trackerCreated = false;
function createTracker(opt_clientId) {
if (!trackerCreated) {
var fields = {};
if (opt_clientId) {
fields.clientId = opt_clientId;
}
ga('create', 'UA-XXXXX-Y', 'auto', fields);
trackerCreated = true;
}
}
window.addEventListener('message', function(event) {
// Ignores messages from untrusted domains.
if (event.origin != 'https://destination.com') return;
// Creates the tracker with the data from the parent page.
createTracker(event.data);
});
// Waits for three seconds to receive the client ID from the parent page.
// If that doesn't happen, it creates the tracker as normal.
setTimeout(createTracker, 3000);