Pelajari cara mendaftarkan sumber untuk mengatribusikan klik dan penayangan ke peristiwa yang sesuai.
Sumber atribusi adalah peristiwa yang terkait dengan iklan (klik atau tampilan), yang memungkinkan teknologi iklan melampirkan jenis informasi berikut: - Data pelaporan kontekstual, seperti ID materi iklan, informasi tentang kampanye, atau geografi. - Tujuan konversi, seperti di situs tempat Anda mengharapkan pengguna melakukan konversi.
Dengan mengikuti langkah-langkah dalam dokumen ini, Anda dapat mendaftarkan sumber—tayangan iklan atau klik—yang kemudian dikaitkan oleh browser.
Metode pendaftaran
Untuk mendaftarkan sumber atribusi, gunakan elemen HTML atau panggilan JavaScript:
- Tag
<a>
- Tag
<img>
- Tag
<script>
fetch
panggilanXMLHttpRequest
window.open
Tindakan ini menghasilkan permintaan jaringan yang kemudian Anda respons dengan header respons HTTP pendaftaran sumber.
Mendaftarkan sumber untuk klik atau penayangan
Untuk mendaftarkan sumber atribusi bagi klik atau penayangan, ikuti langkah-langkah yang diuraikan di sini. Langkah-langkah lengkapnya akan mengikuti. Berikut ringkasannya:
- Memulai pendaftaran sumber. Gunakan elemen HTML atau panggilan JavaScript untuk membuat permintaan. Langkah ini berbeda untuk klik dan tampilan, seperti yang akan Anda lihat di bagian berikut.
Selesaikan pendaftaran sumber dengan merespons menggunakan header pendaftaran sumber. Setelah menerima permintaan tersebut, respons dengan header
Attribution-Reporting-Register-Source
. Di header tersebut, tentukan konfigurasi Attribution Reporting yang diinginkan. Langkah ini sama untuk klik dan tampilan.Contoh untuk laporan ringkasan:
{ "aggregation_keys": { "campaignCounts": "0x159", "geoValue": "0x5" }, "aggregatable_report_window": "86400", "destination": "https://example.com" }
Contoh untuk laporan tingkat peristiwa:
{ "source_event_id": "12340873456", "destination": "[eTLD+1]", "expiry": "[64-bit signed integer]", "priority": "[64-bit signed integer]", "event_report_window": "[64-bit signed integer]" }
Atribut wajib dan opsional
Saat menggunakan elemen HTML atau melakukan panggilan JavaScript untuk mendaftarkan sumber, Anda
mungkin harus menggunakan attributionsrc
atau attributionReporting
. Lihat tabel berikut untuk mengetahui detail tentang kapan fungsi ini
diperlukan.
Jika attributionsrc
bersifat opsional, penggunaannya menunjukkan bahwa permintaan memenuhi syarat untuk Attribution Reporting. Jika Anda menggunakan
attributionsrc
, browser akan mengirimkan
header Attribution-Reporting-Eligible
. Ini juga berguna untuk pengukuran aplikasi ke web: jika attributionsrc
ada, browser akan mengirimkan header Attribution-Reporting-Support
.
Metode pendaftaran | Sumber |
---|---|
Tag <a> |
(sumber navigasi)attributionsrc wajib. |
Tag <img> |
(sumber peristiwa)attributionsrc wajib. |
Tag <script> |
(sumber peristiwa)attributionsrc wajib. |
fetch panggilan |
Opsi attributionReporting bersifat
wajib. |
XMLHttpRequest
|
Opsi attributionReporting bersifat
wajib. |
window.open()
|
(sumber navigasi)attributionsrc wajib ada. |
Langkah 1: Mulai pendaftaran sumber
Langkah 1 berbeda untuk klik dan tampilan. Buka tab yang sesuai untuk setiap tab.
Untuk mendaftarkan sumber atribusi untuk klik, Anda dapat menggunakan tag <a>
atau JavaScript
window.open()
.
Menggunakan anchor
Tambahkan attributionsrc
ke tag <a> yang ada yang ingin Anda ukur tayangan atau kliknya:
<a href="https://shoes.example/..."
attributionsrc>Click me</a>
Tinjau kode contoh untuk mengetahui informasi selengkapnya.
Menggunakan skrip
Telepon window.open()
dengan attributionsrc
:
window.open(
"https://shoes.example/...",
"_blank",
"attributionsrc");
Agar dipertimbangkan, metode ini harus dipanggil dalam waktu 5 detik setelah interaksi pengguna.
Daripada menambahkan attributionsrc
dengan sendirinya, Anda dapat menentukan satu nilai URL untuk gambar atau skrip:
<a href=... attributionsrc="https://a.example/register-source">
Dalam kasus JavaScript, jika Anda memberi attributionsrc
nilai, pastikan untuk mengenkode URL tersebut jika URL tersebut berisi karakter khusus seperti '=' yang akan menyebabkan parameter tidak diurai dengan benar.
Enkode sebagai berikut:
const encodedUrl = encodeURIComponent(
'https://adtech.example/attribution_source?ad_id=...');
window.open(
"https://shoes.example/landing",
"_blank",
attributionsrc=${encodedUrl});
attributionsrc
juga dapat mengambil daftar URL yang dipisahkan spasi seperti yang digambarkan di sini dengan tag anchor:
<!-- With an anchor tag -->
<a href=... attributionsrc="https://a.example/register-source
https://b.example/register-source">
atau seperti yang ada di sini menggunakan window.open()
.
// With window.open()
window.open('...', '_blank', attributionsrc=${encodedUrl1}
attributionsrc=${encodedUrl2})
Dalam kasus tersebut, kedua URL akan menerima permintaan navigation-source-eligible
attributionsrc
(permintaan yang menyertakan header Attribution-Reporting-Eligible
).
attributionsrc
dengan atau tanpa nilai
Seperti yang Anda lihat sebelumnya, Anda dapat menentukan attributionsrc
tanpa URL. Anda juga dapat menentukan
satu URL. Selain itu, untuk sumber saja (tidak berlaku untuk pemicu), Anda dapat menggunakan daftar URL yang dipisahkan spasi.
Menggunakan URL akan menyebabkan browser memulai permintaan pengambilan keepalive terpisah—satu
untuk setiap URL—yang mencakup header permintaan
Attribution-Reporting-Eligible
.
Hal ini berguna jika Anda ingin membuat pendaftaran sumber dengan merespons permintaan yang terpisah dari permintaan utama elemen.
Misalnya, jika Anda perlu mendaftarkan sumber untuk klik pada elemen anchor,
Anda mungkin sebenarnya tidak mengontrol tujuan. Dalam hal ini, Anda memerlukan
konfigurasi untuk mengirim header pendaftaran sumber sebagai respons terhadap permintaan
yang terpisah dari navigasi dan dapat Anda kontrol sepenuhnya. Dengan
menentukan nilai eksplisit untuk attributionsrc
, Anda menginstruksikan
browser untuk membuat permintaan tambahan tersebut dan mengonfigurasi tujuannya.
Untuk langkah 1 mendaftarkan tampilan, buka tab dan pilih Langkah 1 Tampilan.
Guna mendaftarkan sumber atribusi untuk tampilan, Anda dapat menggunakan tag gambar atau skrip yang akan ditambahi atribut attributionsrc
.
Atau, Anda dapat menggunakan JavaScript fetch()
atau XMLHttpRequest()
.
Dengan gambar
<img attributionsrc
src="https://adtech.example/attribution_source?ad_id=..."/>
Dengan skrip
<script attributionsrc
src="https://adtech.example/attribution_source?ad_id=..."/>
Secara opsional, Anda dapat menentukan nilai URL untuk
attributionsrc
dengan cara yang sama seperti untuk
klik; yaitu, untuk gambar atau skrip , Anda dapat menyetel URL attributionsrc
atau URL seperti berikut:
Dengan satu URL:
attributionsrc="https://adtech.example/attribution_source?ad_id=123"
Dengan daftar URL:
attributionsrc="https://a.example/register-source
https://b.example/register-source"
Menggunakan fetch()
atau XMLHttpRequest()
Kode ini secara efektif menyimulasikan fungsi permintaan HTML dengan attributionsrc
:
// With fetch
const attributionReporting = {
eventSourceEligible: true,
triggerEligible: false,
};
// Optionally set keepalive to ensure the request outlives the page.
window.fetch("https://adtech.example/attribution_source?my_ad_id=123", {
keepalive: true, attributionReporting });
// With XHR
const attributionReporting = {
eventSourceEligible: true,
triggerEligible: false,
};
const req = new XMLHttpRequest();
req.open('GET', url);
req.setAttributionReporting(
attributionReporting);
req.send();
Untuk langkah 1 mendaftarkan klik, buka tab dan pilih Klik langkah 1.
Langkah 2: Berikan respons dengan header (klik dan tampilan)
Langkah berikutnya untuk klik dan tampilan adalah merespons dengan header Attribution-Reporting-Register-Source
.
Tinjau kode contoh untuk mengetahui informasi selengkapnya.
Setelah menerima permintaan browser di server, tanggapi dan sertakan header Attribution-Reporting-Register-Source
dalam respons Anda.
res.set(
'Attribution-Reporting-Register-Source',
JSON.stringify({
// Use source_event_id to map it to any granular information
// you need at ad-serving time
source_event_id: '412444888111012',
destination: 'https://advertiser.example',
// Optional fields
expiry: '604800',
priority: '100',
debug_key: '122939999'
})
);
Setelah diubah stringnya, header Anda akan terlihat seperti ini:
{"source_event_id":"412444888111012","destination":"https://advertiser.example","expiry":"604800","priority":"100","debug_key":"122939999"}
Langkah berikutnya
Pelajari cara Mendaftarkan pemicu atribusi.