Pelajari cara mendaftarkan sumber untuk mengatribusikan klik dan penayangan ke peristiwa yang sesuai.
Sumber atribusi adalah peristiwa terkait iklan (klik atau penayangan), yang dapat dilampirkan oleh teknologi iklan dengan jenis informasi berikut:
- Data pelaporan kontekstual, seperti ID materi iklan, informasi tentang kampanye, atau geografi.
- Tujuan konversi, seperti situs tempat Anda mengharapkan pengguna melakukan konversi.
Dengan mengikuti langkah-langkah dalam dokumen ini, Anda dapat mendaftarkan sumber—tayangan iklan atau klik—yang kemudian diatribusikan konversinya oleh browser.
Metode pendaftaran
Untuk mendaftarkan sumber atribusi, gunakan elemen HTML atau panggilan JavaScript:
- Tag
<a>
- Tag
<img>
- Tag
<script>
fetch
panggilanXMLHttpRequest
window.open
panggilan
Tindakan ini akan menghasilkan permintaan jaringan yang kemudian Anda respons dengan header respons HTTP pendaftaran sumber.
Mendaftarkan sumber untuk klik atau penayangan
Untuk mendaftarkan sumber atribusi untuk klik atau penayangan, ikuti langkah-langkah yang diuraikan di sini. Berikut langkah-langkah lengkapnya. Berikut ringkasannya:
- Mulai pendaftaran sumber. Gunakan elemen HTML atau panggilan JavaScript untuk membuat permintaan. Langkah ini berbeda untuk klik dan penayangan, seperti yang akan Anda lihat di bagian berikut.
Selesaikan pendaftaran sumber dengan merespons dengan header pendaftaran sumber. Setelah menerima permintaan tersebut, balas dengan header
Attribution-Reporting-Register-Source
. Di header tersebut, tentukan konfigurasi Pelaporan Atribusi yang dipilih. Langkah ini sama untuk klik dan penayangan.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 perlu menggunakan attributionsrc
atau attributionReporting
. Lihat tabel berikut untuk mengetahui detail tentang kapan hal ini
diperlukan.
Jika attributionsrc
opsional, penggunaannya menunjukkan bahwa permintaan tersebut memenuhi syarat untuk Pelaporan Atribusi. Jika Anda menggunakan
attributionsrc
, browser akan mengirim
header Attribution-Reporting-Eligible
. Hal ini juga berguna untuk pengukuran aplikasi ke web: jika attributionsrc
ada, browser akan mengirim header Attribution-Reporting-Support
.
Metode pendaftaran | Sumber |
---|---|
Tag <a> |
(sumber navigasi)attributionsrc wajib. |
Tag <img> |
(sumber peristiwa)attributionsrc wajib diisi. |
Tag <script> |
(sumber peristiwa)attributionsrc wajib diisi. |
fetch panggilan |
Opsi attributionReporting
wajib. |
XMLHttpRequest |
Opsi attributionReporting
wajib. |
window.open panggilan |
(navigation source)attributionsrc wajib diisi. |
Langkah 1: Memulai pendaftaran sumber
Langkah 1 berbeda untuk klik dan penayangan.
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 iklan atau kliknya:
<a href="https://shoes.example/..." attributionsrc>Click me</a>
Tinjau kode contoh untuk mengetahui informasi selengkapnya.
Menggunakan skrip
Panggil 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
saja, untuk gambar atau skrip, Anda dapat menentukan satu nilai URL:
<a href=... attributionsrc="https://a.example/register-source">Click me</a>
Dalam kasus JavaScript, jika Anda memberikan nilai ke attributionsrc
, pastikan untuk mengenkode URL tersebut jika berisi karakter khusus seperti =
yang akan menyebabkan parameter diuraikan dengan tidak 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 menggunakan daftar URL yang dipisahkan spasi seperti yang diilustrasikan di sini dengan tag <a>
:
<a href=... attributionsrc="https://a.example/register-source
https://b.example/register-source">Click me</a>
atau seperti di sini menggunakan window.open()
.
window.open("...", "_blank", `attributionsrc=${encodedUrl1}
attributionsrc=${encodedUrl2}`)
Dalam kasus tersebut, kedua URL menerima permintaan attributionsrc
yang memenuhi syarat sumber navigasi (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, Anda dapat menggunakan daftar URL yang dipisahkan spasi.
Penggunaan URL menyebabkan browser memulai permintaan pengambilan keepalive terpisah—satu
untuk setiap URL—yang menyertakan 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 perlu mendaftarkan sumber untuk klik pada elemen anchor,
Anda mungkin tidak benar-benar mengontrol tujuan; dalam hal ini, Anda memerlukan
konfigurasi yang memungkinkan Anda mengirim header pendaftaran sumber sebagai respons terhadap permintaan
yang terpisah dari navigasi, dan yang dapat Anda kontrol sepenuhnya. Dengan menentukan nilai eksplisit untuk attributionsrc
, Anda menginstruksikan browser untuk membuat permintaan tambahan tersebut dan mengonfigurasi tujuannya.
Untuk mendaftarkan sumber atribusi untuk tampilan, Anda dapat menggunakan tag gambar atau skrip yang akan Anda tambahkan 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=..."></script>
Secara opsional, Anda dapat menentukan nilai URL untuk
attributionsrc
dengan cara yang sama seperti untuk
klik; yaitu, untuk gambar atau skrip , Anda dapat menetapkan URL attributionsrc
seperti ini:
Dengan satu URL:
<img attributionsrc="https://adtech.example/attribution_source?ad_id=123">
Dengan daftar URL:
<img attributionsrc="https://a.example/register-source
https://b.example/register-source">
Menggunakan fetch()
atau XMLHttpRequest()
Kode ini secara efektif menyimulasikan tindakan yang akan dilakukan permintaan HTML dengan attributionsrc
:
const attributionReporting = {
eventSourceEligible: true,
triggerEligible: false,
};
// Optionally set keepalive to make sure the request outlives the page.
window.fetch("https://adtech.example/attribution_source?my_ad_id=123",
{ keepalive: true, attributionReporting });
const attributionReporting = {
eventSourceEligible: true,
triggerEligible: false,
};
const req = new XMLHttpRequest();
req.open("GET", url);
req.setAttributionReporting(attributionReporting);
req.send();
Langkah 2: Respons dengan header (klik dan penayangan)
Langkah berikutnya untuk klik dan penayangan adalah merespons dengan header Attribution-Reporting-Register-Source
.
Tinjau kode contoh untuk mengetahui informasi selengkapnya.
Setelah menerima permintaan browser di server, respons 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 di-string, 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.