HTMLAnchorElement.attributionSrc — Eigenschaft · JavaScript-Referenz

Signatur

HTMLAnchorElement.attributionSrc

Beschreibung

Die Eigenschaft attributionSrc spiegelt das HTML-Attribut attributionsrc eines <a>-Elements wider. Sie gehört zur Attribution Reporting API. Mit dieser API lassen sich Konversionen messen, zum Beispiel „Klick auf eine Anzeige führt zu einem Kauf“, ohne seitenübergreifende Cookies. Ist das Attribut gesetzt, schickt der Browser beim Klick auf den Link den Header Attribution-Reporting-Eligible mit. Der Server kann darauf mit Attribution-Reporting-Register-Source antworten und so eine Attributionsquelle (Navigationsquelle) registrieren.

Welche Wirkung der Wert hat, hängt von seinem Inhalt ab:

Leerer String (""): Die Quelle wird über die Antwort auf die eigentliche Navigation zur href-URL registriert. Der Zielserver muss also den Registrierungs-Header senden.
Eine oder mehrere URLs, durch Leerzeichen getrennt: Zusätzlich zur Navigation sendet der Browser im Hintergrund keepalive-Anfragen an diese URLs. Deren Antworten können die Quelle registrieren. Das ist praktisch, wenn ein separater Mess- oder Ad-Tech-Server die Registrierung übernimmt und nicht die Zielseite.

Die Eigenschaft ist nützlich, wenn Links dynamisch entstehen, etwa in Werbeflächen oder Empfehlungs-Widgets, und das Attribut erst zur Laufzeit gesetzt werden soll. Die Registrierung passiert erst beim tatsächlichen Klick des Nutzers. Das bloße Setzen der Eigenschaft löst noch keine Anfrage aus.

Parameter

Name	Typ	Default	Beschreibung
$wert (beim Setzen)	string	""	Leerer String für eine Registrierung über die Navigationsantwort, oder eine durch Leerzeichen getrennte Liste absoluter bzw. relativer URLs für zusätzliche Registrierungsanfragen im Hintergrund.

Rückgabewert

Typ

string

Beschreibung

Der aktuelle Wert des attributionsrc-Attributs. Fehlt das Attribut, wird ein leerer String zurückgegeben. Ob das Attribut wirklich vorhanden ist, prüft man deshalb mit hasAttribute("attributionsrc").

Beispiele

Link dynamisch als Attributionsquelle markieren

const link = document.createElement('a');
link.href = 'https://shop.example/produkt/42';
link.textContent = 'Jetzt ansehen';

// Leerer String: Der Zielserver registriert die Quelle
// per Header in der Navigationsantwort
link.attributionSrc = '';

document.querySelector('#werbeflaeche').append(link);
console.log(link.hasAttribute('attributionsrc'));

true

Registrierung über einen separaten Mess-Server

const link = document.querySelector('a.anzeige');

// Mehrere Registrierungs-Endpunkte, durch Leerzeichen getrennt
link.attributionSrc = [
  'https://adtech.example/register-source?kampagne=sommer',
  'https://messung.example/quelle'
].join(' ');

console.log(link.getAttribute('attributionsrc'));

https://adtech.example/register-source?kampagne=sommer https://messung.example/quelle

Feature-Erkennung mit Fallback

const unterstuetzt = 'attributionSrc' in HTMLAnchorElement.prototype;

for (const link of document.querySelectorAll('a[data-kampagne]')) {
  if (unterstuetzt) {
    link.attributionSrc = `https://adtech.example/register?id=${link.dataset.kampagne}`;
  } else {
    // Fallback: klassischer Tracking-Parameter in der URL
    const url = new URL(link.href);
    url.searchParams.set('utm_campaign', link.dataset.kampagne);
    link.href = url.toString();
  }
}

console.log('Attribution Reporting verfügbar:', unterstuetzt);

Attribution Reporting verfügbar: true (in Chromium-Browsern, sonst false)

// Wichtig · Fallstricke

Experimentell und Chromium-spezifisch: Die Eigenschaft gibt es nur in Chromium-basierten Browsern. Firefox und Safari unterstützen sie nicht. Vor der Nutzung sollte man das Feature immer erkennen ('attributionSrc' in HTMLAnchorElement.prototype). Google hat angekündigt, mehrere Privacy-Sandbox-APIs, darunter die Attribution Reporting API, einzustellen. Für neue Projekte ist die API deshalb nur eingeschränkt zu empfehlen.
Leerer String ist nicht gleich „nicht gesetzt“: Der Getter liefert in beiden Fällen "". Mit link.attributionSrc = '' wird das Attribut aber hinzugefügt und aktiviert damit die Registrierung. Zum Deaktivieren benutzt man removeAttribute('attributionsrc').
Voraussetzungen: Die API braucht einen sicheren Kontext (HTTPS). Außerdem muss die Permissions-Policy attribution-reporting sie erlauben. In Cross-Origin-iframes ist sie ohne Freigabe blockiert.
Nutzeraktivierung nötig: Eine Navigationsquelle wird nur bei einem echten Klick des Nutzers registriert. Ein per Skript ausgelöstes link.click() ohne Nutzergeste registriert keine Navigationsquelle.
Ohne Server-Header passiert nichts: Das Attribut macht den Klick nur berechtigt. Registriert wird die Quelle erst, wenn der Server mit Attribution-Reporting-Register-Source antwortet.
Datenschutz: Nutzer oder Browsereinstellungen können die API abschalten. Man darf also nicht davon ausgehen, dass Berichte zuverlässig ankommen.

Siehe auch

Window.open() HTMLAnchorElement.attributionSourceId HTMLAnchorElement.origin HTMLAnchorElement.protocol HTMLAnchorElement.relList