Zarejestruj źródła atrybucji

Dowiedz się, jak rejestrować źródła, aby przypisywać kliknięcia i wyświetlenia do odpowiednich zdarzeń.

Źródło atrybucji to zdarzenie związane z reklamą (kliknięcie lub wyświetlenie), do którego technologia reklamowa może dołączyć te informacje:

  • Dane raportowania kontekstowego, takie jak identyfikator kreacji, informacje o kampanii lub dane geograficzne.
  • Miejsce docelowe konwersji, np. strona, na której oczekujesz konwersji.

Wykonując czynności opisane w tym dokumencie, możesz zarejestrować źródła (wyświetlenia lub kliknięcia reklam), do których przeglądarka przypisuje konwersje.

Metody rejestracji

Aby zarejestrować źródła atrybucji, użyj elementów HTML lub wywołań JavaScript:

  • Tag <a>
  • Tag <img>
  • Tag <script>
  • fetch komponent do wykonywania połączeń
  • XMLHttpRequest
  • window.open komponent do wykonywania połączeń

Spowoduje to wygenerowanie żądań sieciowych, na które odpowiesz za pomocą nagłówka odpowiedzi HTTP rejestracji źródłowej.

Rejestrowanie źródeł kliknięć lub wyświetleń

Aby zarejestrować źródło atrybucji dla kliknięć lub wyświetleń, wykonaj czynności opisane tutaj. Poniżej znajdziesz instrukcje poszczególnych czynności. Oto podsumowanie:

  1. Rozpocznij rejestrację źródła. Aby wysłać żądanie, użyj elementu HTML lub wywołania JavaScriptu. Ten krok różni się w przypadku kliknięć i wyświetleń, jak zauważysz w kolejnych sekcjach.
  2. Ukończ rejestrację źródła, odpowiadając, używając nagłówka rejestracji źródłowej. Po otrzymaniu żądania odpowiedz, wysyłając nagłówek Attribution-Reporting-Register-Source. W tym nagłówku podaj odpowiednią konfigurację raportowania atrybucji. Ten krok jest taki sam w przypadku kliknięć i wyświetleń.

    Przykład raportów podsumowujących:

    {
      "aggregation_keys": {
        "campaignCounts": "0x159",
        "geoValue": "0x5"
      },
      "aggregatable_report_window": "86400",
      "destination": "https://example.com"
    }
    

    Przykład raportów na poziomie zdarzenia:

    {
      "source_event_id": "12340873456",
      "destination": "[eTLD+1]",
      "expiry": "[64-bit signed integer]",
      "priority": "[64-bit signed integer]",
      "event_report_window": "[64-bit signed integer]"
    }
    

Atrybuty wymagane i opcjonalne

Jeśli używasz elementów HTML lub wykonujesz wywołania JavaScriptu do rejestrowania źródeł, konieczne może być użycie właściwości attributionsrc lub attributionReporting. W tabeli poniżej znajdziesz szczegółowe informacje o tym, kiedy są one wymagane.

Gdy parametr attributionsrc jest opcjonalny, użycie go wskazuje, że żądanie kwalifikuje się do raportowania atrybucji. Jeśli używasz tagu attributionsrc, przeglądarka wysyła nagłówek Attribution-Reporting-Eligible. Przydaje się on też do pomiarów połączeń z aplikacji do witryny: jeśli podano attributionsrc, przeglądarka wysyła nagłówek Attribution-Reporting-Support.

Metoda rejestracji Źródło
Tag <a> (źródło nawigacji)
Parametr attributionsrc jest wymagany.
Tag <img> (źródło zdarzenia)
Parametr attributionsrc jest wymagany.
Tag <script> (źródło zdarzenia)
Parametr attributionsrc jest wymagany.
fetch komponent do wykonywania połączeń Opcja attributionReporting jest wymagana.
XMLHttpRequest Opcja attributionReporting jest wymagana.
window.open komponent do wykonywania połączeń (źródło nawigacji)
Parametr attributionsrc jest wymagany.

Krok 1. Rozpocznij rejestrację źródła

Krok 1 wygląda inaczej w przypadku kliknięć i wyświetleń.

Aby zarejestrować źródło atrybucji kliknięcia, możesz użyć tagu <a> lub JavaScriptu window.open().

Użycie kotwicy

Dodaj attributionsrc do dotychczasowych tagów <a>, w przypadku których chcesz mierzyć wyświetlenia lub kliknięcia:

<a href="https://shoes.example/..." attributionsrc>Click me</a>

Więcej informacji znajdziesz w przykładowym kodzie.

Za pomocą skryptu

Zadzwoń do użytkownika window.open(), używając numeru attributionsrc:

window.open(
  "https://shoes.example/...",
  "_blank",
  "attributionsrc");

Aby ta metoda została uwzględniona, musi zostać wywołana w ciągu 5 sekund od interakcji użytkownika.

Zamiast dodawać samo attributionsrc, dla obrazu lub skryptu możesz określić pojedynczą wartość adresu URL:

<a href=... attributionsrc="https://a.example/register-source">Click me</a>

Jeśli w przypadku JavaScriptu podasz wartość attributionsrc, zakoduj ten adres URL na wypadek, gdyby zawiera on znaki specjalne (np. =), które spowodowałyby nieprawidłową analizę parametru.

Zakoduj go w następujący sposób:

const encodedUrl = encodeURIComponent(
  "https://adtech.example/attribution_source?ad_id=...");
window.open(
  "https://shoes.example/landing",
   "_blank",
   `attributionsrc=${encodedUrl}`);

attributionsrc może również pobierać listę adresów URL oddzielonych spacjami, jak pokazano tutaj, za pomocą tagu <a>:

<a href=... attributionsrc="https://a.example/register-source
  https://b.example/register-source">Click me</a>

lub w bieżącej formie za pomocą usługi window.open().

window.open("...", "_blank", `attributionsrc=${encodedUrl1}
  attributionsrc=${encodedUrl2}`)

W takich przypadkach oba adresy URL otrzymują żądania attributionsrc odpowiednie do źródła nawigacji (żądania zawierające nagłówek Attribution-Reporting-Eligible).

attributionsrc z wartością lub bez niej

Tak jak poprzednio, możesz określić attributionsrc bez adresu URL. Możesz też podać pojedynczy adres URL. Możesz też użyć listy adresów URL rozdzielonych spacjami.

Użycie adresów URL powoduje, że przeglądarka wysyła osobne żądanie utrzymywania aktywności (po jednym dla każdego adresu URL), które zawiera nagłówek żądania Attribution-Reporting-Eligible.

Jest to przydatne, gdy chcesz dokonać rejestracji źródła, odpowiadając na żądanie niezależne od głównego żądania elementu.

Jeśli na przykład musisz rejestrować źródła kliknięć elementu zakotwiczonego, możesz nie mieć kontroli nad miejscem docelowym. W takim przypadku potrzebujesz konfiguracji, która wysyła nagłówek rejestracji źródła jako odpowiedź na żądanie, które jest niezależne od nawigacji i nad którą masz całkowitą kontrolę. Określając jawną wartość dla attributionsrc, informujesz przeglądarkę, że ma wysłać to dodatkowe żądanie i skonfigurować jego miejsce docelowe.

Aby zarejestrować źródło atrybucji dla widoku, możesz użyć tagu obrazu lub skryptu, do którego dodasz atrybut attributionsrc.

Możesz też użyć JavaScriptu fetch() lub XMLHttpRequest().

Z obrazem

<img attributionsrc
src="https://adtech.example/attribution_source?ad_id=...">

Za pomocą scenariusza

<script attributionsrc
  src="https://adtech.example/attribution_source?ad_id=..."></script>

Opcjonalnie możesz określić wartość adresu URL dla parametru attributionsrc tak samo jak w przypadku kliknięć. W przypadku obrazu lub skryptu możesz więc ustawić adres URL attributionsrc bądź URL-e w ten sposób:

W przypadku pojedynczego adresu URL:

<img attributionsrc="https://adtech.example/attribution_source?ad_id=123">

Za pomocą listy adresów URL:

<img attributionsrc="https://a.example/register-source
  https://b.example/register-source">

Używasz fetch() lub XMLHttpRequest()

Ten kod skutecznie symuluje działanie żądania HTML z użyciem funkcji 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();

Krok 2. Odpowiedz za pomocą nagłówka (kliknięcia i wyświetlenia)

Następnym krokiem w przypadku kliknięć i wyświetleń jest przesłanie w odpowiedzi nagłówka Attribution-Reporting-Register-Source.

Więcej informacji znajdziesz w przykładowym kodzie.

Po otrzymaniu do serwera żądania przeglądarki odpowiedz i dołącz do odpowiedzi nagłówek 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"
  })
);

Po ustawieniu ciągu znaków nagłówek będzie wyglądał tak:

{"source_event_id":"412444888111012","destination":"https://advertiser.example","expiry":"604800","priority":"100","debug_key":"122939999"}

Dalsze kroki

Dowiedz się, jak zarejestrować reguły atrybucji.