Découvrez comment enregistrer des sources pour attribuer des clics et des vues aux événements appropriés.
Une source d'attribution est un événement lié aux annonces (un clic ou une vue), auquel une technologie publicitaire peut associer les types d'informations suivants:
- Données contextuelles de rapport, telles que l'ID de la création publicitaire, des informations sur la campagne ou la zone géographique.
- Une destination de conversion, comme le site sur lequel vous souhaitez que l'utilisateur effectue une conversion.
En suivant la procédure décrite dans ce document, vous pouvez enregistrer des sources (impressions d'annonces ou clics) auxquelles le navigateur attribue des conversions.
Méthodes d'enregistrement
Pour enregistrer des sources d'attribution, utilisez des éléments HTML ou des appels JavaScript:
- Balise
<a>
- Balise
<img>
- Balise
<script>
fetch
appelXMLHttpRequest
window.open
appel
Cela génère des requêtes réseau auxquelles vous répondez avec une source en-tête de réponse HTTP d'inscription.
Enregistrer des sources pour les clics ou les vues
Pour enregistrer une source d'attribution pour des clics ou des vues, suivez les étapes ci-dessous. La procédure à suivre est indiquée ci-dessous. Voici le résumé:
- Lancez l'enregistrement de la source. Utilisez un élément HTML ou un élément via un appel JavaScript pour effectuer une requête. Cette étape diffère pour les clics et les vues, comme vous le verrez dans les sections suivantes.
Terminez l'enregistrement de la source en répondant à cette demande. d'inscription. À la réception de cette requête, répondez avec l'en-tête
Attribution-Reporting-Register-Source
Dans cet en-tête, spécifiez la configuration Attribution Reporting souhaitée. Cette étape est la même pour les clics et les vues.Exemple pour les rapports récapitulatifs:
{ "aggregation_keys": { "campaignCounts": "0x159", "geoValue": "0x5" }, "aggregatable_report_window": "86400", "destination": "https://example.com" }
Exemple pour les rapports au niveau des événements:
{ "source_event_id": "12340873456", "destination": "[eTLD+1]", "expiry": "[64-bit signed integer]", "priority": "[64-bit signed integer]", "event_report_window": "[64-bit signed integer]" }
Attributs obligatoires et facultatifs
Lorsque vous utilisez des éléments HTML ou effectuez des appels JavaScript pour enregistrer des sources, vous
peut avoir besoin d'utiliser attributionsrc
ou attributionReporting
. Consultez le tableau suivant pour en savoir plus
obligatoire.
Lorsque attributionsrc
est facultatif, son utilisation indique que la demande est éligible pour Attribution Reporting. Si vous utilisez
attributionsrc
, le navigateur envoie
Attribution-Reporting-Eligible
. Il est également utile pour les conversions
mesure: si attributionsrc
est présent, le navigateur envoie le
Attribution-Reporting-Support
.
Méthode d'enregistrement | Source |
---|---|
Balise <a> |
(source de navigation)attributionsrc est obligatoire. |
Balise <img> |
(source de l'événement)attributionsrc est obligatoire. |
Balise <script> |
(source de l'événement)attributionsrc est obligatoire. |
fetch appel |
L'option attributionReporting est
obligatoire. |
XMLHttpRequest |
L'option attributionReporting est
obligatoire. |
window.open appel |
(source de navigation)attributionsrc est obligatoire. |
Étape 1: Lancez l'enregistrement de la source
L'étape 1 diffère pour les clics et les vues.
Afin d'enregistrer une source d'attribution pour un clic, vous pouvez utiliser une balise <a>
ou JavaScript
window.open()
Utiliser une ancre
Ajoutez attributionsrc
aux balises <a>
existantes pour lesquelles vous souhaitez mesurer les impressions ou les clics:
<a href="https://shoes.example/..." attributionsrc>Click me</a>
Pour en savoir plus, consultez l'exemple de code.
Utiliser un script
Appeler window.open()
avec attributionsrc
:
window.open(
"https://shoes.example/...",
"_blank",
"attributionsrc");
Pour être prise en compte, cette méthode doit être appelée dans les cinq secondes suivant l'interaction de l'utilisateur.
Au lieu d'ajouter attributionsrc
seul, vous pouvez spécifier une seule valeur d'URL pour une image ou un script:
<a href=... attributionsrc="https://a.example/register-source">Click me</a>
Dans le cas JavaScript, si vous attribuez une valeur à attributionsrc
, assurez-vous
pour encoder cette URL si elle contient des caractères spéciaux tels que =
,
entraînerait une analyse incorrecte du paramètre.
Codez comme suit:
const encodedUrl = encodeURIComponent(
"https://adtech.example/attribution_source?ad_id=...");
window.open(
"https://shoes.example/landing",
"_blank",
`attributionsrc=${encodedUrl}`);
attributionsrc
peut également accepter une liste d'URL séparées par des espaces, comme illustré ici avec une balise <a>
:
<a href=... attributionsrc="https://a.example/register-source
https://b.example/register-source">Click me</a>
ou comme ici à l'aide de window.open()
.
window.open("...", "_blank", `attributionsrc=${encodedUrl1}
attributionsrc=${encodedUrl2}`)
Dans ce cas, les deux URL reçoivent des attributionsrc
éligibles pour la source de navigation.
(requêtes incluant l'en-tête Attribution-Reporting-Eligible
).
attributionsrc
avec ou sans valeur
Comme vous l'avez vu précédemment, vous pouvez spécifier attributionsrc
sans URL. Vous pouvez également spécifier
une seule URL. Vous pouvez également utiliser une liste d'URL séparées par des espaces.
L'utilisation d'URL oblige le navigateur à lancer une requête de récupération distincte de message keepalive, une
pour chaque URL, qui inclut la requête Attribution-Reporting-Eligible
en-tête.
Cela est utile si vous souhaitez enregistrer la source en répondant à une distincte de la requête principale de l'élément.
Par exemple, si vous devez enregistrer des sources pour les clics sur un élément d'ancrage,
vous n'avez peut-être pas réellement
le contrôle de la destination ; dans ce cas, vous voudrez
Une configuration dans laquelle vous envoyez l'en-tête d'enregistrement de la source en tant que réponse à une requête
distinct de la navigation et que vous pouvez contrôler entièrement. Par
spécifiant une valeur explicite pour attributionsrc
, vous demandez au
navigateur pour effectuer cette requête
supplémentaire et configurer sa destination.
Afin d'enregistrer une source d'attribution pour une vue, vous pouvez utiliser un tag d'image ou de script auquel vous ajouterez l'attribut attributionsrc
.
Vous pouvez également utiliser JavaScript fetch()
ou XMLHttpRequest()
.
Avec une image
<img attributionsrc
src="https://adtech.example/attribution_source?ad_id=...">
Avec un script
<script attributionsrc
src="https://adtech.example/attribution_source?ad_id=..."></script>
Vous pouvez éventuellement spécifier une valeur d'URL pour
attributionsrc
comme pour
les clics ; Autrement dit, pour une image ou un script , vous pouvez définir la ou les URL attributionsrc
comme suit:
Avec une seule URL:
<img attributionsrc="https://adtech.example/attribution_source?ad_id=123">
Avec une liste d'URL:
<img attributionsrc="https://a.example/register-source
https://b.example/register-source">
Utiliser fetch()
ou XMLHttpRequest()
Ce code simule efficacement le fonctionnement d'une requête HTML avec attributionsrc
:
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 });
const attributionReporting = {
eventSourceEligible: true,
triggerEligible: false,
};
const req = new XMLHttpRequest();
req.open("GET", url);
req.setAttributionReporting(attributionReporting);
req.send();
Étape 2: Répondre avec un en-tête (clics et vues)
L'étape suivante pour les clics et les vues consiste à répondre avec l'en-tête Attribution-Reporting-Register-Source
.
Pour en savoir plus, consultez l'exemple de code.
À la réception de la requête du navigateur sur le serveur, répondez et incluez dans
votre réponse, l'en-tête Attribution-Reporting-Register-Source
.
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"
})
);
Une fois la chaîne concaténée, votre en-tête ressemble à ceci:
{"source_event_id":"412444888111012","destination":"https://advertiser.example","expiry":"604800","priority":"100","debug_key":"122939999"}
Étapes suivantes
Découvrez comment enregistrer des déclencheurs d'attribution.