NavigatorUAData.brands — Eigenschaft · JavaScript-Referenz

Signatur

NavigatorUAData.brands

Beschreibung

Die schreibgeschützte Eigenschaft brands des Interfaces NavigatorUAData (erreichbar über navigator.userAgentData) liefert ein Array von Objekten. Jedes Objekt hat die Felder brand (z. B. "Google Chrome", "Chromium", "Microsoft Edge") und version (nur die Hauptversion als String, z. B. "124").

Die Eigenschaft gehört zur User-Agent Client Hints-API, die den klassischen, schwer zu parsenden navigator.userAgent-String ersetzen soll. brands zählt zu den sogenannten Low-Entropy-Hinweisen und ist deshalb synchron und ohne Nachfrage verfügbar. Genaue Versionsnummern (fullVersionList) müssen dagegen asynchron über getHighEntropyValues() angefordert werden.

Das Array enthält absichtlich einen „GREASE“-Eintrag mit einer erfundenen Marke (z. B. "Not.A/Brand" oder "Not A(Brand") und ändert die Reihenfolge der Einträge zufällig. So sollen Entwickler gezwungen werden, gezielt nach einer Marke zu suchen, statt feste Positionen oder exakte Listen abzufragen. Prüfen Sie daher immer mit some() oder find() und nie über einen Index.

Einsatzzwecke sind vor allem Statistik, Hinweise zur Browser-Version und Workarounds für bekannte Fehler einzelner Engines. Für normale Funktionsweichen ist die Feature-Erkennung (z. B. 'share' in navigator) fast immer die bessere Wahl.

Rückgabewert

Typ

ReadonlyArray<{ brand: string, version: string }>

Beschreibung

Eingefrorenes Array aus Objekten mit brand (Markenname) und version (Hauptversion als String). Enthält immer auch einen GREASE-Eintrag mit Fantasienamen.

Beispiele

Markenliste ausgeben (mit Feature-Erkennung)

if ('userAgentData' in navigator) {
  for (const { brand, version } of navigator.userAgentData.brands) {
    console.log(`${brand}: ${version}`);
  }
} else {
  console.log('UA Client Hints nicht verfügbar – Fallback auf navigator.userAgent');
}

Chromium: 124 Google Chrome: 124 Not-A.Brand: 99

Prüfen, ob ein Chromium-Browser ab Version 110 läuft

const isChromiumAtLeast = (minVersion) => {
  const brands = navigator.userAgentData?.brands ?? [];
  const entry = brands.find(({ brand }) => brand === 'Chromium');
  return entry ? Number.parseInt(entry.version, 10) >= minVersion : false;
};

console.log(isChromiumAtLeast(110));

true

Exakte Versionen über getHighEntropyValues() nachladen

const getFullVersions = async () => {
  if (!navigator.userAgentData) return null;
  const { fullVersionList } = await navigator.userAgentData
    .getHighEntropyValues(['fullVersionList']);
  return fullVersionList;
};

getFullVersions().then((list) => console.table(list));

[{ brand: 'Chromium', version: '124.0.6367.91' }, { brand: 'Google Chrome', version: '124.0.6367.91' }, { brand: 'Not-A.Brand', version: '99.0.0.0' }]

Edge gezielt erkennen

const isEdge = navigator.userAgentData?.brands
  .some(({ brand }) => brand === 'Microsoft Edge') ?? false;

document.documentElement.classList.toggle('is-edge', isEdge);
console.log('Edge:', isEdge);

Edge: false

// Wichtig · Fallstricke

Browser-Kompatibilität: Nur in Chromium-basierten Browsern (Chrome, Edge, Opera, Samsung Internet) vorhanden. Firefox und Safari stellen navigator.userAgentData nicht bereit – immer mit optionaler Verkettung (?.) oder 'userAgentData' in navigator absichern.
Nur sichere Kontexte: Unter HTTP (außer localhost) ist navigator.userAgentData undefined.
GREASE-Eintrag: Die Liste enthält bewusst eine Fantasie-Marke und wechselnde Reihenfolgen. Niemals brands[0] auswerten oder die Array-Länge fest erwarten.
version ist ein String und nur die Hauptversion. Vor numerischen Vergleichen mit parseInt() umwandeln; für Detailversionen getHighEntropyValues(['fullVersionList']) nutzen.
Die Eigenschaft ist schreibgeschützt und das Array eingefroren – Zuweisungen oder push() haben keine Wirkung bzw. werfen im Strict Mode einen TypeError.
Serverseitig stehen dieselben Informationen im HTTP-Header Sec-CH-UA zur Verfügung.
Browsererkennung ist kein Ersatz für Feature-Erkennung; Marken können sich ändern oder von Browsern gezielt anders gemeldet werden.

Siehe auch

Navigator.buildID NavigatorUAData.mobile NavigatorUAData.platform Navigator.clipboard Navigator.contacts