Start · Sprachen · JavaScript · Referenz · HTMLAreaElement.username

HTMLAreaElement.username

Eigenschaft

Liest oder setzt die Benutzernamen-Komponente der URL im <code>href</code>-Attribut eines <code>&lt;area&gt;</code>-Elements.

seit JavaScript Baseline: alle modernen Browser Kategorie: webapi

Signatur

HTMLAreaElement.username

Beschreibung

Die Eigenschaft username der Schnittstelle HTMLAreaElement ist ein String mit dem Benutzernamen, der in der URL des href-Attributs vor dem @ steht, z. B. anna in https://anna:geheim@example.com/. Enthält die URL keinen Benutzernamen, ist der Wert ein leerer String.

Die Eigenschaft gehört zu den URL-Zerlegungseigenschaften, die HTMLAreaElement über das Mixin HTMLHyperlinkElementUtils erhält, genau wie HTMLAnchorElement. Sie lässt sich lesen und schreiben: Wird ein neuer Wert zugewiesen, baut der Browser die URL neu zusammen und aktualisiert das href-Attribut. Sonderzeichen werden dabei prozentkodiert.

Praktisch braucht man username vor allem zum Prüfen oder Bereinigen von Links in Imagemaps, etwa um Zugangsdaten zu erkennen und aus URLs zu entfernen, bevor diese angezeigt oder weitergegeben werden.

Rückgabewert

Typ
string
Beschreibung
Der Benutzername aus der URL (prozentkodiert) oder "", wenn keiner vorhanden ist. Beim Setzen wird das href-Attribut entsprechend geändert.

Beispiele

Benutzernamen aus einem area-Link auslesen

// <map name="karte"><area id="bereich" shape="rect" coords="0,0,50,50" href="https://anna:geheim@example.com/login"></map>
const area = document.getElementById('bereich');
console.log(area.username);
console.log(area.password);
anna geheim

Benutzernamen setzen, href wird aktualisiert

const area = document.createElement('area');
area.href = 'https://example.com/intern';
area.username = 'max mustermann';
console.log(area.href);
https://max%20mustermann@example.com/intern

Zugangsdaten aus allen Imagemap-Links entfernen

const bereinigeAreas = () => {
  document.querySelectorAll('area[href]').forEach((area) => {
    if (area.username || area.password) {
      area.username = '';
      area.password = '';
    }
  });
};

bereinigeAreas();

// Wichtig · Fallstricke

  • Sicherheit: Zugangsdaten in URLs (user:pass@host) gelten als veraltet und unsicher. Sie landen im Verlauf, in Logs und im Referer. Viele Browser blockieren solche URLs bei Unterressourcen oder zeigen Warnungen an. Ein Passwort gehört nicht in Links.
  • Das Setzen wird ignoriert, wenn die URL keinen Host hat oder das Schema file: ist, zum Beispiel bei mailto:-Links. Auch bei ungültigem oder fehlendem href hat die Zuweisung keine Wirkung, und der Lesewert ist \"\".
  • Der Rückgabewert ist prozentkodiert. Den lesbaren Namen erhält man mit decodeURIComponent(area.username).
  • Relative href-Werte werden gegen die Basis-URL des Dokuments aufgelöst.
  • Kompatibilität: wird von allen aktuellen Browsern unterstützt. Ältere Versionen von Internet Explorer kennen die Eigenschaft nicht.