Pilih API pelacakan yang sesuai berdasarkan skema pelacakan.
1. Bagaimana cara melihat rencana pelacakan?
Sebelum melakukan pelacakan, tentukan lokasi dan objek yang akan dilacak dengan menyusun persyaratan pelacakan yang jelas. Di platform QuickTracking, persyaratan eksplisit dari pelacakan disebut rencana pelacakan, dan template spesifikasi dirancang untuk rencana tersebut. Contoh:
Dalam rencana pelacakan, pelacakan yang diperlukan adalah sebagai berikut:
1. Subjek peristiwa: "siapa" yang memicu peristiwa. Peristiwa dapat dibagi menjadi ID perangkat dan ID akun. Setiap peristiwa harus memiliki salah satu dari keduanya.
ID Perangkat: Biasanya dihasilkan secara otomatis untuk QT di H5. Jika halaman H5 disematkan dalam applet, ID perangkat perlu diatur ke ID perangkat dari applet.
ID Akun: ID akun pengguna setelah masuk. Ketika pengguna masuk dari perangkat yang berbeda, ID perangkat berubah, tetapi ID akun tetap sama. Misalnya, seorang pengguna menggunakan ponsel dan tablet untuk masuk secara terpisah.
2. Properti Pengguna: untuk properti ID akun, misalnya, pengguna dengan ID akun "testdemo@111", "tanggal lahir" "1999-02-13", "tingkat keanggotaan" "platinum", dll. "Tanggal lahir" dan "peringkat keanggotaan" adalah properti pengguna.
3. Properti Saluran: Properti pengiriman iklan, seperti saluran pengiriman, metode pengiriman, dan konten pengiriman.
4. Properti Global: properti yang dibawa oleh setiap peristiwa setelah pengaturan global sekali
5. Peristiwa Penelusuran Halaman: Peristiwa yang dilaporkan ketika halaman dimuat (kode halaman sama dengan kode peristiwa dalam skema pelacakan, dan juga merupakan peristiwa yang ditandai dengan warna biru).
6. Klik, paparan, dan peristiwa kustom: peristiwa yang dilaporkan ketika pengguna klien berinteraksi dengan klien.
2. Atur ID perangkat dan ID akun
2.1 Pengaturan ID Perangkat
ID perangkat web dapat dihasilkan secara otomatis oleh Quicktracking atau diunggah secara manual oleh pengembang. Nilai default: Dihasilkan secara otomatis oleh Quicktracking.
Dihasilkan secara otomatis: Secara default, ID perangkat situs web hanya diregenerasi ketika browser berubah atau pengguna menghapus cookie dan cache. Jika browser dan alamat IP pengguna tetap tidak berubah, ID perangkat yang diregenerasi tidak berubah.
Unggah manual: Tetapkan nilai untuk _dev_id. Panjang unggahan harus 24 hingga 36 karakter.
// Jika ID pengguna dilacak secara asinkron, Anda harus mencegah SDK dilaporkan dan atur pelacakan BLOCK.
aplus_queue.push({
action: 'aplus.setMetaInfo',
arguments: ['_hold', 'BLOCK']
});
// Tetapkan parameter _dev_id.
aplus_queue.push({
action: 'aplus.setMetaInfo',
arguments: ['_dev_id', 'ID perangkat Kustom']
});
// Karena pelacakan ID pengguna bersifat asinkron, Anda perlu mengatur BLOCK terlebih dahulu, lalu atur START.
// Setelah _hold=START diatur, log yang sebelumnya diblokir akan dikirim satu per satu dengan informasi pengguna.
aplus_queue.push({
action: 'aplus.setMetaInfo',
arguments: ['_hold', 'START']
});2.2 Pengaturan ID Akun
Anda harus menentukan ID akun saat Anda masuk atau masuk ke H5. Ini karena setiap log setelah pengaturan akan membawa ID akun, tetapi peristiwa yang dipicu setelah Anda keluar dari H5 dan kemudian masuk ke H5 tidak akan membawa ID akun. Oleh karena itu, Anda perlu mengatur ID akun saat Anda masuk ke instance H5 atau saat Anda masuk ke instance H5.
// Saat pengguna masuk, informasi akun login diperoleh atau pengguna telah masuk. Anda dapat memperoleh akun login dengan menggunakan cookie atau localstorage.
function demoLogin() {
/*************************** IF SYNCHRONIZING SCENE ************************************* /
aplus_queue.push({
action: 'aplus.setMetaInfo',
arguments: ['_user_id', 'ID akun']
});
/******************** Jika ini adalah skenario asinkron dan log harus bergantung pada akun pengguna ******************************* /
// Atur _hold=BLOCK untuk memblokir pelacakan dan pelaporan.
aplus_queue.push({
action: 'aplus.setMetaInfo',
arguments: ['_hold', 'BLOCK']
});
...
function callback() {
// Dapatkan ID akun pengguna dalam hasil callback asinkron.
aplus_queue.push({
action: 'aplus.setMetaInfo',
arguments: ['_user_id', 'ID akun']
});
// Atur _hold=START untuk mengizinkan pelacakan dan pelaporan.
aplus_queue.push({
action: 'aplus.setMetaInfo',
arguments: ['_hold', 'START']
});
};
...
};
// Reset ID akun pengguna saat pengguna keluar.
function demoLogOff() {
aplus_queue.push({
action: 'aplus.setMetaInfo',
arguments: ['_user_id', '']
});
};2.3 ID Perangkat dan ID Akun
Mendapatkan ID Perangkat
Gunakan salah satu metode berikut untuk mendapatkan ID perangkat yang dihasilkan secara otomatis oleh SDK:
Bidang bernama cna disimpan dalam cookie domain saat ini. Anda dapat mengurai file document.cookie untuk mendapatkan nilai bidang cna.
Anda dapat menggunakan metode _dev_id untuk mendapatkan ID perangkat yang diunggah sebagai berikut:
Pengembang dapat menggunakan setMetaInfo untuk menetapkan _dev_id untuk menyesuaikan ID perangkat, yang dapat dibaca aplus.getMetaInfo('_dev_id')
Mendapatkan ID Akun
Anda dapat menggunakan setMetaInfo untuk menetapkan _user_id untuk menyesuaikan ID akun pengguna. Anda dapat mendapatkan ID dengan menggunakan aplus.getMetaInfo('_user_id')
3. Atur properti pengguna
Laporkan properti pengguna dengan menggunakan kode peristiwa pra-bangun $$_user_profile. Jenis peristiwa adalah peristiwa lainnya.
Sebelum melaporkan properti pengguna, Anda harus mengatur _user_id untuk melaporkan akun pengguna. Jika tidak, Quick Tracking tidak akan melakukan perhitungan korelasi pada properti pengguna. Setelah Anda mengonfirmasi ID akun pengguna pelaporan, contoh pelaporan properti pengguna adalah sebagai berikut:
// Kode contoh
aplus_queue.push({
'action': 'aplus.record',
'arguments': ['$$_user_profile', 'OTHER', {
name: 'sss', // Properti pengguna 1
gender: 'male', // Properti pengguna 2
class: '3', // Properti pengguna 3
}]
});Dalam konten sebelumnya, baris 2, 3, 4, 8, dan 9 tidak dapat diubah. Hanya baris 5, 6, dan 7 yang dapat disesuaikan.
4 Properti Saluran
Secara default, siklus hidup properti saluran sama dengan sesi pada tab SessionStorage browser. Anda dapat menyesuaikan waktu kedaluwarsa parameter UTM berdasarkan hari (didukung oleh V2.0.7 dan lebih baru ). Hasilnya disimpan dalam cookie. Waktu kedaluwarsa maksimum diatur berdasarkan waktu kedaluwarsa maksimum aktual cookie yang didukung oleh setiap browser.
Metode pengaturan:
aplus_queue.push({
action: 'aplus.setMetaInfo',
arguments: ['aplus-utm-expire-days', '1']
});Skenario parameter saluran H5 adalah sebagai berikut:
4.1 Tautan H5 membangkitkan aplikasi, mini program, dan halaman H5
Properti saluran tidak perlu dilacak, tetapi URL mini program atau aplikasi harus berisi properti saluran ini, dan kunci properti harus dimulai dengan "utm_" karena kata kunci yang dikenali oleh SDK adalah "utm_". Penyebab utama:
qaplus/product?utm_channel=gzh
PS: Jika Anda telah bekerja sama dengan perusahaan pengiriman saluran di pasar dan tidak dapat dimulai dengan utm_, Anda dapat menggunakan API properti global untuk melaporkan properti saluran. (Kunci properti harus dimulai dengan utm_).
4.2 Tautan H5 membangkitkan pasar aplikasi untuk mengunduh dan meluncurkan aplikasi
Dalam skenario ini, jika hanya "parameter utm" yang termasuk dalam URL H5, "parameter utm" tidak dapat disertakan dalam peristiwa startup setelah aplikasi diunduh. Oleh karena itu, perlu untuk melakukan pencocokan fuzzy antara "peristiwa arousal H5" dan "peristiwa startup aplikasi" pada alamat IP dan User Agent browser.
Ketika pengguna mengklik tombol 「Panggil /Unduh Aplikasi」 di H5, peristiwa tautan aplikasi ($$_app_link) dilaporkan. Dalam peristiwa tersebut, appkey dan properti saluran dari aplikasi panggilan harus disertakan.
// Kode contoh
aplus_queue.push({
action: 'aplus.recordAppLink',
arguments: [{
targetAppKey: 'Application appKey', // Diperlukan. AppKey dari aplikasi yang akan dibangkitkan.
custom1: 'custom1', // Opsional. Parameter kustom.
...
}]
})Peristiwa aktivasi aplikasi ($$_app_install)"" dilacak dan dilaporkan secara otomatis oleh SDK Aplikasi QT.
Sistem QT melakukan pencocokan fuzzy antara peristiwa evokasi aplikasi ($$_app_link) dan peristiwa aktivasi aplikasi ($$_app_install) pada "Alamat IP dan UserAgent browser". Saat Anda menggunakannya, Anda dapat langsung menganalisis properti saluran dari "aktivasi aplikasi (preset)" dalam aplikasi.
5 Properti Global
Siklus hidup properti global dimulai ketika operasi API properti global pertama kali diatur. Ketika tab halaman browser ditutup, browser ditutup, atau URL browser aplikasi multi-halaman berubah.
5.1 Atur tambahkan properti global (aplus.appendMetaInfo)
Ketika Anda menggunakan aplus.appendMetaInfo untuk melaporkan properti global, jika kunci properti global sama dengan properti global yang ada, nilai yang ada diperbarui. Jika kunci properti global berbeda dari properti global yang ada, properti global baru dimasukkan.
API:
aplus_queue.push({
action: 'aplus.appendMetaInfo', // Tambahkan properti global
arguments: ['globalproperty', {
xxx: xxx,
}]
});Contoh:
aplus_queue.push({
action: 'aplus.appendMetaInfo', // Tambahkan properti global
arguments: ['globalproperty', {
a: 3,
b: 4
}]
});
// Properti global saat ini adalah a:3 dan b:4
aplus_queue.push({
action: 'aplus.appendMetaInfo', // Tambahkan properti global
arguments: ['globalproperty', {
b: 2,
d: 4
}]
});
// Properti global saat ini adalah a:3, b:2, dan d:4 Setelah properti global diatur, setiap log peristiwa yang dipicu dilaporkan. Siklus hidup hanya dimulai ketika halaman H5 ditutup.
5.2 Atur ganti properti global (aplus.setMetaInfo)
Ketika Anda menggunakan aplus.setMetaInfo untuk melaporkan properti global, hanya laporan terakhir yang diutamakan. Artinya, semua properti global yang ada dihapus terlebih dahulu, lalu properti global yang diatur oleh setMetaInfo() ini dimasukkan.
Pastikan metode ini memenuhi logika bisnis sebelum Anda menggunakannya. Dalam skenario umum, 「bersihkan」 properti global.
Catatan bahwa menggunakan metode ini juga akan menimpa properti saluran! ! !
Antarmuka:
aplus_queue.push({
action: 'aplus.setMetaInfo', // Timpa properti global
arguments: ['globalproperty', {
xxx: xxx
}]
});Contoh
aplus_queue.push({
action: 'aplus.setMetaInfo',
arguments: ['globalproperty', {
a: 1,
b: 2
}]
});
// Properti global saat ini adalah a:1 dan b:2
aplus_queue.push({
action: 'aplus.setMetaInfo',
arguments: ['globalproperty', {
c: 1,
d: 2
}]
});
// Properti global saat ini adalah c:1 dan d:2, "a:1 dan b:2 tidak ada lagi" 5.3 Dapatkan Properti Global
Anda dapat menggunakan getMetaInfo untuk mendapatkan semua properti global dan properti saluran.
aplus.getMetaInfo('globalproperty');Catatan: Untuk mendapatkan properti global, Anda harus memanggil operasi setelah SDK diinisialisasi.
6 API Peristiwa Penelusuran Halaman
1. Peristiwa penelusuran halaman dibagi menjadi dua metode: pelacakan otomatis SDK (auto-tracking) dan pelacakan kode. Secara default, pelacakan otomatis diaktifkan.
2. Berikut ini perlu disematkan untuk peristiwa penelusuran halaman:
Kode peristiwa: kode halaman. Dalam peristiwa penelusuran halaman, kode peristiwa adalah kode halaman.
Properti peristiwa penelusuran halaman: lihat rencana pelacakan untuk properti spesifik.
6.1 pageConfig
pageConfig digunakan untuk mengonfigurasi mode pengkodean halaman secara global, seperti yang ditunjukkan dalam contoh berikut:
<head>
...
<script>
... bagian kode integrasi sdk
// Atur pengkodean halaman dan judul halaman.
// Atur pageConfig [SDK v1.7.7 atau lebih baru] agar berlaku.
// Jika pageConfig tidak diatur
// Pengkodean halaman adalah URL halaman saat ini secara default, tanpa parameter.
// Judul halaman default adalah document.title.
aplus_queue.push({
action: 'aplus.setMetaInfo',
arguments: ['pageConfig', {
hashMode: false, // Nilai default: false. Parameter ini menentukan mode history. Jika mode hash diaktifkan, parameter ini menentukan nilai true.
// Parameter ini hanya berlaku ketika parameter hashMode diatur ke true. Nilai default: false. Jika nilainya diatur ke true, semua URL sama satu sama lain.
hashAutoPVSupportFullURL: false,
'/': {
pageName: 'home_page_test',
pageTitle: 'Homepage',
skipMe: true // Abaikan peristiwa penelusuran halaman yang dilaporkan secara otomatis untuk halaman ini. Nilai default adalah undefined.
},
'/search': { // Cocokkan berdasarkan location.pathname
pageName: 'search_page_test',
pageTitle: 'Halaman Pencarian',
regRule: // \/search // (opsional untuk memverifikasi rute dinamis
},
'#/hash_page': { // cocokkan berdasarkan location.hash
pageName: 'hash_page_test',
pageTitle: 'Halaman dalam mode hash',
regRule: ekspresi reguler yang cocok dengan rute hash saat ini // (opsional) untuk memverifikasi rute dinamis.
},
'/demo.html': {
pageName: 'demo_test',
pageTitle: 'Halaman uji demo'
}
}]
});
</script>
</head>pageName
Menunjukkan pengkodean halaman.
pageTitle
Menunjukkan judul halaman.
skipMe menentukan apakah pelacakan otomatis untuk halaman ini dinonaktifkan.
Nilai true menunjukkan bahwa pelacakan otomatis dinonaktifkan, sedangkan false menunjukkan bahwa pelacakan otomatis diaktifkan.
Pengaturan ini memiliki prioritas lebih tinggi daripada saklar utama aplus-disable-apv yang menonaktifkan pelacakan otomatis peristiwa penelusuran halaman.
hashMode
Menunjukkan apakah URL halaman pv ditentukan secara otomatis berdasarkan mode hash. Nilai default: false.
hashAutoPVSupportFullURL
Menunjukkan apakah pv otomatis dikirim ketika parameter URL berubah dalam mode hash.
Nilai default: false. Parameter ini hanya berlaku jika hashMode diatur ke true.
Contoh: Pertama, hashMode=true, dan atur nilainya ke true. Ketika URL halaman beralih dari www.example.com/#/a?p=111 ke www.example.com/#/a?p=222, pv otomatis juga akan dikirim.
Didukung pada versi V2.4.3 dan lebih baru.
6.2 Pelacakan Otomatis Halaman (auto-tracking)
Ketika SDK mendeteksi bahwa kode SDK di halaman dimuat, peristiwa penelusuran halaman dilaporkan. Berikut adalah isi yang dilaporkan:
Waktu Klien Saat Ini
Jalur Halaman
Pengkodean Halaman (Nilai default adalah jalur halaman. Jika pageconfig diatur, nilainya adalah page_name dari pemetaan.)
Judul Halaman (Nilai default adalah judul halaman. Jika pageconfig diatur, nilainya adalah page_title dari pemetaan.)
Durasi Tinggal Halaman: Tidak dilacak oleh SDK.
6.2.1 Saklar Pelacakan Otomatis Halaman
Secara default, pelaporan halaman otomatis diaktifkan. Untuk menonaktifkannya, panggil API berikut:
aplus_queue.push({
action: 'aplus.setMetaInfo',
arguments: ['aplus-disable-apv', true]
});Jika Anda ingin menonaktifkan pelaporan halaman otomatis untuk halaman tertentu, Anda dapat mengatur skipMe ke true dalam pageconfig untuk menonaktifkannya.
6.2.2 Laporkan properti pada halaman kustom
Dalam mode pelacakan otomatis, Anda dapat mengonfigurasi properti kustom untuk halaman. Untuk melakukannya, tentukan parameter extData dalam konfigurasi pageConfig. Anda dapat mengatur extData sebagai fungsi atau menentukan bidang dalam extData sebagai fungsi.
Catatan: Versi yang didukung adalah v2.0.17 dan lebih baru.
Contoh kode:
<head>
...
<script>
... bagian kode integrasi sdk
aplus_queue.push({
action: 'aplus.setMetaInfo',
arguments: ['pageConfig', {
'/page1': {
pageTitle: '',
pageName: '',
skipMe: true,
extData: {
customData1: 1,
customData2: 1,
},
},
'/page2': {
extData: {
customData1: 1,
customData2: function () {
return 1342;
}
}
},
'/page3': {
extData: function () {
return {
customData1: 1,
customData2: 1342
}
}
},
});
</script>
</head>Pelacakan Manual Halaman 6.3
API
Metode sendPV digunakan untuk mengirimkan log PV halaman. Definisi API adalah sebagai berikut:
aplus_queue.push({
action: 'aplus.sendPV',
arguments: [pageEventConfig, userData]
});Parameter:
pageEventConfig merupakan konfigurasi peristiwa halaman. Anda hanya perlu menulis { is_auto: false }.
userdata adalah parameter tambahan untuk peristiwa halaman ini. Nilainya harus berupa objek JSON (objek sederhana yang diratakan, tidak dapat bersarang dalam beberapa lapisan). Jika tidak ada, gunakan objek kosong '{}'
Contoh
// Demo sederhana
aplus_queue.push({
'action': 'aplus.sendPV',
'arguments': [{
is_auto: false
}, {
page_title: "halaman utama", // Nilai default adalah nilai dalam parameter pageConfig. Jika parameter ini diatur, nilainya diatur di sini. Parameter ini opsional.
page_name: "yourCurrentPageName", // Nilai default adalah nilai dalam pageConfig. Jika diatur di sini, nilainya diatur di sini (opsional).
// Jika Anda mengatur parameter durasi (dalam milidetik),QuickTracking digunakan sebagai "properti peristiwa-durasi (s)" untuk analisis.
duration: 1111111,
// Sesuaikan properti peristiwa.
x: 111,
y: 222
}]
});Secara default, nilai parameter page_title diatur berdasarkan nilai parameter pageConfig. Jika parameter page_title ditentukan, nilainya akan diambil dari parameter pageConfig.
Secara default, parameter page_name diatur berdasarkan nilai dalam parameter pageConfig. Jika parameter page_name ditentukan, nilainya akan diambil dari parameter pageConfig.
7 Pelacakan Peristiwa
Semua peristiwa kecuali peristiwa penelusuran halaman dikubur menggunakan 'action':'aplus.record'. Berikut ini perlu dilacak:
Kode peristiwa:
Properti peristiwa:
Pengkodean Halaman (opsional): Secara default, SDK melacak jalur halaman. Jika jalur halaman dipetakan dalam pageConfig dan page_name diatur, nilainya adalah page_name dalam pageConfig. Jika page_name diatur dalam properti peristiwa ketika peristiwa dilacak, nilainya diatur ke page_name dalam properti peristiwa. Yaitu, prioritas nilai adalah
page_name dalam properti peristiwa> page_name dalam pageConfig> jalur halaman
Judul Halaman: SDK melacak judul halaman secara default. Jika jalur halaman dipetakan dalam pageConfig dan page_title diatur, nilainya adalah page_title dalam pageConfig. Jika Anda mengatur page_title dalam properti peristiwa ketika Anda melacak peristiwa, nilai parameter page_title sama dengan properti peristiwa. Yaitu, prioritas nilai adalah
page_title dalam event propertys> page_title dalam pageConfig> judul halaman
Pelacakan acara dibagi menjadi pelacakan otomatis SDK (auto-tracking) dan pelacakan kode. Secara default, auto-tracking untuk klik dan tayangan dinonaktifkan.
Harap perhatikan bahwa:
Dalam aplikasi, tipe data memiliki pengetikan kuat dan harus benar. Namun, di H5, tipe data memiliki pengetikan lemah dan tipe data apa pun dapat digunakan. Oleh karena itu, ketika H5 disematkan dalam aplikasi, jika tipe data di H5 tidak sesuai dengan tipe data di aplikasi, seperti null, mungkin akan muncul kesalahan. Oleh karena itu, kami menyarankan Anda untuk menggunakan tipe yang sesuai untuk mengirimkan data di H5, seperti number\string\string array.
Properti event dapat berupa salah satu dari jenis berikut: String, Number, dan string array.
7.1 Peristiwa Paparan
EXP secara khusus mengacu pada peristiwa paparan
aplus_queue.push({
'action': 'aplus.record',
'arguments': ['Kode peristiwa dalam skema pelacakan ', 'EXP', {
x: '111',
y: '222',
z: 333,
page_name: "demoPageName", // Kode halaman kustom dari halaman saat ini. Parameter ini tidak wajib.
}]
});7.2 Peristiwa Klik
CLK secara khusus mengacu pada peristiwa klik
aplus_queue.push({
'action': 'aplus.record',
'arguments': ['Kode peristiwa dalam skema pelacakan ', 'CLK', {
x: '111',
y: '222',
z: 333,
page_name: "demoPageName", // Kode halaman kustom dari halaman saat ini. Parameter ini tidak wajib.
}]
});7.3 Pelacakan event lainnya
Event kustom lainnya selain event klik dan tayangan
aplus_queue.push({
'action': 'aplus.record',
'arguments': ['Kode event dalam skema pelacakan ', 'OTHER', {
x: '111',
y: '222',
z: 333,
page_name: "demoPageName", // Kode halaman kustom dari halaman saat ini. Parameter ini tidak wajib.
}]
});7.4 Paparan Otomatis (pelacakan otomatis)
SDK secara internal membantu pengembang menangani waktu paparan dan secara otomatis melacak perilaku paparan elemen. Waktu pemicu adalah saat kontrol ditampilkan di area terlihat lebih dari 50% selama 300ms.
<body>
<div id="root">
<h1 class="title">demo</h1>
<! -- Jika Anda perlu melewati parameter, lewati data-* melalui properti data html, harap gunakan kombinasi huruf kecil untuk mendefinisikan parameter -->
<button class="autoexp-component-css"
data-pagename="Sesuaikan pengkodean halaman untuk acara saat ini"
data-page_title="Sesuaikan judul halaman untuk acara saat ini"> Uji paparan </button>
<List>
<List.Item class="autoexp-list-item" data-name={"a"}>a</List.Item>
<List.Item class="autoexp-list-item" data-name={"b"}>b</List.Item>
<List.Item class="autoexp-list-item" data-name={"c"}>c</List.Item>
<List.Item
class='autotrack_exp_web'
data-itemname={'Rebook'}
data-itemzoon={'abc'}
data-itemid={'a_product_id'}
data-promotioninformation={'abc'}
data-pagename={'Homepage'}> Pelacakan Penuh-Paparan Otomatis </List. Item>
</List>
</div>
</body>Blok konfigurasi SDK:
aplus_queue.push({
action: 'aplus.setMetaInfo',
arguments: ['aplus-auto-exp', [
// lacak perilaku paparan elemen tombol.
{
cssSelector: '.autoexp-component-css', // Kelas elemen yang ingin Anda paparkan.
logkey: 'auto-exp-id', // Kode acara yang sesuai dalam skema pelacakan.
Props: ['data-pagename', 'data-page_title'], // Properti kustom pada elemen yang ingin Anda paparkan.
},
// lacak perilaku paparan elemen daftar.
{
cssSelector: '.autoexp-list-item',
logkey: 'auto-exp-item', // Kode acara yang sesuai dalam skema pelacakan.
props: ['data-name'], // Bidang nama item yang termasuk dalam paparan otomatis.
},
],
],
});
// Fungsi callback sebelumnya untuk paparan otomatis, yang digunakan untuk mendukung pelaporan parameter kustom, seperti penulisan unta (properti data HTML hanya mendukung huruf kecil secara default).
// Versi 1.9.25 dan yang lebih baru didukung.
aplus_queue.push({
action: 'aplus.setMetaInfo',
arguments: ['aplus-auto-exp-userfn', function (e) {
if (e.className.indexOf('autotrack_exp_web') != -1) {
var dataset = e.dataset;
var obj = {};
obj.itemID = dataset.itemid;
obj.itemName = dataset.itemname;
obj.itemZoon = dataset.itemzoon;
obj.promotionInformation = dataset.promotioninformation;
obj.pageName = dataset.pagename;
return {
userdata: obj
};
}
}]
});Jika Anda menggulir di dalam elemen (dengan bilah gulir di blok), Anda perlu menambahkan konfigurasi positionSelector, lihat kode berikut:
aplus_queue.push({
action: 'aplus.setMetaInfo',
arguments: ['aplus-auto-exp', [{
positionSelector: '.content-wrap', // kelas elemen bilah gulir Anda
cssSelector: '.autoclk-app-option', // Kelas elemen yang ingin Anda paparkan.
logkey: 'auto-exp-id', // Kode acara yang sesuai dalam skema pelacakan.
props: ['data-name'], // Properti kustom elemen tersebut.
},
],
],
});Dalam aplikasi satu halaman, SDK secara berulang melaporkan acara paparan ketika halaman meninggalkan dan kemudian kembali. Untuk menonaktifkan perilaku default ini, Anda dapat mengatur pengaturan berikut:
aplus_queue.push({
action: 'aplus.setMetaInfo',
arguments: ['aplus-exposure-event-can-repeat', false]
});Nilai default metaInfo aplus-exposure-event-can-repeat adalah true, yaitu pelaporan ulang acara paparan didukung.
Catatan: API aplus-exposure-event-can-repeat hanya berlaku di versi v1.10.2 dan di atasnya. Perilaku default acara paparan otomatis di bawah versi ini masih berupa aplikasi satu halaman. Selama halaman tidak dimuat ulang, elemen yang terpapar pada halaman tidak akan dipaparkan lagi saat kembali ke halaman saat ini.
7.5 Klik Otomatis (pelacakan otomatis)
Mulai dari versi 1.7.0, untuk mengurangi beban kerja pengembang, SDK juga memungkinkan Anda mengonfigurasi beberapa informasi sehingga SDK dapat secara otomatis melacak peristiwa klik pada halaman.
<body>
<div id="root">
<h1 class="title">Demo</h1>
<! -- 1. Pertama, tentukan kelas elemen html untuk melaporkan peristiwa -->
<! -- 2. Jika Anda perlu melewati parameter, lewati data-* melalui properti data html, gunakan kombinasi huruf kecil untuk mendefinisikan parameter -->
<button
class='autoclk-component-css'
data-aparam="1"
data-pagename="Sesuaikan pengkodean halaman untuk peristiwa saat ini"
data-page_title="Sesuaikan judul halaman untuk peristiwa saat ini">
Uji Klik
</button>
<li
className='autotrack_clk_web'
data-itemname='Membaca Stude'
data-itemzoon='abc'
data-itemid='a_product_id'
data-promotioninformation='abc'
data-pagename='homepage'> klik otomatis </li>
</div>
</body>Blok konfigurasi SDK:
aplus_queue.push({
action: 'aplus.setMetaInfo',
arguments: ['aplus-auto-clk', [{
cssSelector: '.autoclk-component-css', // Kelas dari elemen.
logkey: 'auto-clk-id', // Kode peristiwa yang sesuai dalam skema pelacakan.
props: ['data-aparam, 'data-pagename, 'data-page_title'], // Properti kustom pada elemen.
},
],
],
});
// Fungsi pra-panggilan untuk klik otomatis. Digunakan untuk mendukung pelaporan parameter kustom, seperti penulisan untaian. Secara default, properti data HTML hanya mendukung huruf kecil.
// Versi 1.9.25 dan yang lebih baru didukung.
aplus_queue.push({
action: 'aplus.setMetaInfo',
arguments: ['aplus-auto-clk-userfn', function (e) {
if (e.className.indexOf('autotrack_clk_web') != -1) {
var dataset = e.dataset;
var obj = {};
obj.itemID = dataset.itemid;
obj.itemName = dataset.itemname;
obj.itemZoon = dataset.itemzoon;
obj.promotionInformation = dataset.promotioninformation;
obj.pageName = dataset.pagename;
return {
userdata: obj
};
}
}]
});7.6 Penangkapan otomatis dari klik kontrol apa pun (auto-tracking)
7.6.1 Sakelar tersembunyi penuh
Anda dapat mengatur parameter aplus-autotrack-enabled menjadi true untuk mengaktifkan fitur pelacakan penuh. Secara default, fitur ini diaktifkan. Atur nilainya menjadi false untuk menonaktifkan fungsi auto-tracking lokal.
aplus_queue.push({
action: 'aplus.setMetaInfo',
arguments: ['aplus-autotrack-enabled', true]
});7.6.2 Konfigurasi kontrol auto-tracking
Secara default, web sdk hanya melacak peristiwa klik dari empat kontrol html yaitu a, button, textarea, dan input. Jika Anda perlu melacak jenis kontrol lainnya, Anda dapat mengonfigurasinya melalui konfigurasi tambahan aplus-autotrack-config.
aplus_queue.push({
action: 'aplus.setMetaInfo',
arguments: ['aplus-autotrack-config', {
track_tags: {
li: true, // lacak kontrol <li/>
img: true,// lacak kontrol <img/>.
svg: true,// lacak kontrol <svg/>.
div: true,// lacak kontrol <div/>.
span: true,// lacak kontrol <span/>.
path: true,// lacak kontrol <path/>.
p: true // lacak kontrol <p/>
},
track_input: true, // lacak konten masukan dalam kotak input. Secara default,
element_capture_enable: true // Mode penangkapan peristiwa didukung untuk semua klik kontrol pelacakan. Mode default adalah mode gelembung dan nilainya adalah false.
}]
});7.6.3 Laporkan properti peristiwa auto-tracking
Sama seperti pelaporan properti untuk peristiwa otomatis, dengan bantuan pelaporan properti data html.
<body>
<div id="root">
<! -- Jika Anda perlu melewati parameter, lewati data-* melalui properti data html -->
<button data-aparam="1"> Klik Uji </button>
</div>
</body>7.6.4 Nonaktifkan pelaporan peristiwa auto-tracking untuk satu kontrol
Jika Anda ingin menonaktifkan pelaporan peristiwa untuk sebuah kontrol, nonaktifkan pelaporan dengan menambahkan properti kontrol aplus-autotrack-off ke true.
<body>
<div id="root">
<! -- Jika Anda perlu melewati parameter, lewati data-* melalui properti data html -->
<button data-aparam="1" aplus-autotrack-off="true">
Komponen yang dikonfigurasi dengan aplus-autotrack-off tidak dilaporkan
</button>
</div>
</body>
7.6.5 Pengkodean peristiwa kustom untuk satu kontrol
Kostumisasi pengkodean peristiwa melalui data-clk-logkey.
<button data-clk-logkey="demoEventCode"> Kostumisasi pengkodean peristiwa melalui data-clk-logkey </button>8 Heatmap
8.1 Sakelar Kemampuan Heatmap
Secara default, SDK menonaktifkan kemampuan heatmap. Untuk mengaktifkan kemampuan tersebut, konfigurasikan pengaturan berikut:
aplus_queue.push({
action: 'aplus.setMetaInfo',
arguments: ['aplus-heatmap-enabled', true]
});Atau
<meta name="aplus-heatmap-enabled" content="1">8.2 Laju Pengambilan Sampel Event Heatmap
Heatmap Event laju sampel Minimum Didukung pemisah ribuan Desimal
aplus_queue.push({
action: 'aplus.setMetaInfo',
arguments: ['aplus-rate-ahot', 0,001] // laju sampel kejadian untuk heatmap. Jumlah desimal minimum yang didukung adalah pemisah ribuan.
});Atau
<meta name="aplus-rate-ahot" content="0,001">9 Berbagi fisi
Berbagi fisi adalah konsep kunci dari strategi pertumbuhan hacking. Ini bergantung pada hubungan sosial antara pengguna untuk mewujudkan transmisi informasi yang saling menguntungkan, sehingga mendorong akuisisi pengguna baru.
Setelah menyelesaikan integrasi fungsi SDK berbagi fisi, Anda dapat menggunakan platform Quick Tracking untuk berbagi model tren serta mengukur manfaat penarikan kampanye pemasaran melalui indikator berulang terkait berbagi.
Mendukung melihat metrik efek berulang dari pengguna berbagi teratas dan hierarki berbagi berulang yang berbeda.
Mendukung kombinasi dan konfigurasi fleksibel indikator berulang, melihat pengguna teratas dengan kemampuan tarik fisi paling banyak dan kemampuan konversi berbagi berulang, melacak hubungan antara pengguna yang berbagi tautan fisi dan berbagi berulang, dan dengan cepat menemukan konsumen pendapat kunci.
9.1 Dapatkan parameter sumber berbagi
window.aplus.getRefShareParams();Versi yang didukung
H5 SDK v2.2.0 atau lebih baru
Fungsi
API yang digunakan untuk mendapatkan id berbagi sumber dan url berbagi sumber ketika orang yang dibagikan membuka H5 dari pembagian
Parameter Permintaan
N/A
Parameter Respons
Parameter Objek
Parameter | Parameter | Nilai Default | Deskripsi | Catatan |
$$_ref_share_url | String | "" | URL berbagi sumber yang tidak berisi id berbagi | N/A |
$$_ref_share_id | String | "" | id berbagi sumber | N/A |
Contoh Panggilan
Skenario berdasarkan nilai balik promise
// Skenario nilai balik promise
function onShare(options) {
const {
$$_ref_share_url,
$$_ref_share_id
} = window.aplus.getRefShareParams();
const promise = window.aplus.requestShareParams({
title: 'Bagikan halaman aktivitas',
path: 'https://www.taobao.com/productId?utm_test=test',
campaign: 'Ini adalah kampanye berbagi',
shareId: $$_ref_share_id
}).then(res => {
const { $sid } = res;
if ($sid) {
window.aplus.record("$$_share", "CLK", {
$$_ share_title: "Ini adalah judul berbagi",
$$_share_id: $sid,
$$_share_campaign_id: "Ini adalah aktivitas berbagi kustom",
$$_ share_type: "Platform berbagi yang ditentukan pengguna",
$$_ share_url: "Ini adalah url berbagi"
});
} else {
console.log("Gagal mendapatkan parameter berbagi"); // Tentukan penyebab kesalahan. Dalam mode DEBUG, konsol mengembalikan nilai.
}
});
}Nilai balik berdasarkan callback
// Panggil nilai balik.
function onShare() {
const {
$$_ref_share_url,
$$_ref_share_id
} = window.aplus.getRefShareParams();
window.aplus.requestShareParams({
title: 'Bagikan halaman aktivitas',
path: '/pages/share/shareCampaign?utm_test=test',
campaign: 'Ini adalah kampanye berbagi',
shareId: $$_ref_share_id
}, (res) => {
const { $sid } = res;
if ($sid) {
window.aplus.record("$$_share", "CLK", {
$$_ share_title: "Ini adalah judul berbagi",
$$_share_id: $sid,
$$_share_campaign_id: "Ini adalah aktivitas berbagi kustom",
$$_ share_type: "Platform berbagi target yang ditentukan pengguna",
$$_ share_url: "Ini adalah url berbagi"
});
} else {
console.log("Gagal mendapatkan parameter berbagi"); // Tentukan penyebab kesalahan. Dalam mode DEBUG, konsol mengembalikan nilai.
}
});
}9.2 Permintaan parameter berbagi
window.aplus.requestShareParams(Object params, Function callback);Versi
H5 SDK v2.2.0 atau lebih baru
Fungsi
permintaan digunakan untuk membangun ID berbagi yang diperlukan untuk rantai berbagi
Parameter Permintaan
Parameter | Parameter | Nilai Default | Deskripsi | Catatan |
params | Object | N/A | Bagikan API untuk mendapatkan parameter |
url: jalur halaman yang dibagikan. Tipe String. Nilai default: location.href
campaign: identitas kampanye berbagi. Tipe String, nilai default undefined, panjang maksimum 4*1024 karakter title: Bagikan judul. Tipe String, nilai default undefined, panjang maksimum 4*1024 panjang shareId: ID berbagi sumber. Tipe String. Nilai default: undefined. |
callback | Function | undefined | Fungsi callback yang dikembalikan untuk API yang tidak mendukung promise | Jika parameter callback tidak ditentukan, API perolehan parameter berbagi mengembalikan hasil sebagai promise secara default. Jika parameter callback memiliki nilai dan merupakan parameter callback, fungsi callback mengembalikan parameter berbagi untuk mendapatkan hasil permintaan API. |
Parameter Respons
Jika parameter permintaan tidak berisi callback, Promise.resolve(Object result); dikembalikan.
Parameter | Parameter | Nilai Default | Deskripsi | Catatan |
$sid | String | undefined | ID Berbagi, yang merupakan pengenal unik dari perilaku berbagi subjek berbagi | N/A |
Jika parameter permintaan berisi callback, kembalikan Object result.
Parameter | Parameter | Nilai Default | Deskripsi | Catatan |
$sid | String | undefined | ID berbagi. ID tersebut adalah pengenal unik subjek berbagi. | N/A |
Contoh Panggilan
Skenario berdasarkan nilai balik promise
// Skenario nilai balik promise
function onShare(options) {
const promise = window.aplus.requestShareParams({
title: 'Bagikan halaman aktivitas',
path: 'https://www.taobao.com/productId?utm_test=test',
campaign: 'Ini adalah kampanye berbagi',
shareId: "Ini adalah id berbagi sumber"
}).then(res => {
const { $sid } = res;
if ($sid) {
window.aplus.record("$$_share", "CLK", {
$$_ share_title: "Ini adalah judul berbagi",
$$_share_id: $sid,
$$_share_campaign_id: "Ini adalah aktivitas berbagi kustom",
$$_ share_type: "Platform berbagi target yang ditentukan pengguna",
$$_ share_url: "Ini adalah url berbagi"
});
} else {
console.log("Gagal mendapatkan parameter berbagi"); // Tentukan penyebab kesalahan. Dalam mode DEBUG, konsol mengembalikan nilai.
}
});
}Nilai balik berdasarkan callback
function onShare() {
window.aplus.requestShareParams({
title: 'Bagikan halaman aktivitas',
path: '/pages/share/shareCampaign?utm_test=test',
campaign: 'Ini adalah kampanye berbagi',
shareId: "Ini adalah id berbagi sumber"
}, (res) => {
const { $sid } = res;
if ($sid) {
window.aplus.record("$$_share", "CLK", {
$$_ share_title: "Ini adalah judul berbagi",
$$_share_id: $sid,
$$_share_campaign_id: "Ini adalah aktivitas berbagi kustom",
$$_ share_type: "Platform berbagi target yang ditentukan pengguna",
$$_ share_url: "Ini adalah url berbagi"
});
} else {
console.log("Gagal mendapatkan parameter berbagi"); // Tentukan penyebab kesalahan. Dalam mode DEBUG, konsol mengembalikan nilai.
}
});
}9.3 Laporkan peristiwa berbagi
Laporkan peristiwa berbagi dengan menggunakan kode peristiwa pra-set $$_share. Jenis peristiwa adalah peristiwa klik (CLK).
Contoh
window.aplus.record("$$_share", "CLK", {
$$_ share_title: "Ini adalah judul berbagi",
$$_ share_id: "ID berbagi diperoleh melalui API parameter permintaan berbagi",
$$_share_campaign_id: "Ini adalah aktivitas berbagi kustom",
$$_ share_type: "Platform berbagi target yang ditentukan pengguna",
$$_ share_url: "Ini adalah url berbagi"
});Harap dicatat bahwa tautan yang dipanggil perlu membawa kunci "$sid" dan nilainya adalah parameter ID berbagi, seperti https://example.aliyun.com/path/to/content?$sid=123456"
Contoh aplikasi lain dari tautan H5:
const {
$$_ref_share_url,
$$_ref_share_id
} = window.aplus.getRefShareParams();
window.aplus.requestShareParams({
title: 'Bagikan halaman aktivitas',
path: '/pages/share/shareCampaign?utm_test=test',
campaign: 'Ini adalah kampanye berbagi',
shareId: $$_ref_share_id
}, (res) => {
const { $sid } = res;
if ($sid) {
window.aplus.record("$$_share", "CLK", {
$$_ share_title: "Ini adalah judul berbagi",
$$_share_id: $sid,
$$_share_campaign_id: "Ini adalah aktivitas berbagi kustom",
$$_ share_type: "Platform berbagi target yang ditentukan pengguna",
$$_ share_url: "Ini adalah url berbagi"
});
setTimeout(() => {
var urlScheme = "https://example.aliyun.com/path/to/content?utm_source=utm_test&$sid=" + $sid;
window.location.href = urlScheme;
}, 1000)
} else {
console.log("Gagal mendapatkan parameter berbagi"); // Tentukan penyebab kesalahan. Dalam mode DEBUG, konsol mengembalikan nilai.
}
});