HTMLAnchorElement.username — Eigenschaft · JavaScript-Referenz

Signatur

HTMLAnchorElement.username

Beschreibung

Die Eigenschaft username des Interfaces HTMLAnchorElement ist ein String mit dem Benutzernamen aus der URL im href-Attribut, also dem Teil vor dem Doppelpunkt bzw. vor dem @ in https://benutzer:passwort@example.com/. Enthält die URL keinen Benutzernamen, ist der Wert ein leerer String "".

Die Eigenschaft ist lesbar und schreibbar. Weist man ihr einen Wert zu, wird das href-Attribut des Elements direkt angepasst. Sonderzeichen werden dabei nach den Regeln des WHATWG-URL-Standards prozentkodiert, beim Lesen erhält man also die kodierte Form.

Praktisch braucht man username vor allem, um Links zu analysieren oder zu bereinigen, etwa um eingebettete Zugangsdaten vor dem Anzeigen oder Weitergeben aus Links zu entfernen. Die Eigenschaft funktioniert genauso wie URL.prototype.username. Für reine URL-Verarbeitung ohne DOM ist das URL-Objekt meist die bessere Wahl.

Rückgabewert

Typ

string

Beschreibung

Der prozentkodierte Benutzername aus dem href oder "", wenn keiner vorhanden ist. Beim Setzen wird ein String erwartet.

Beispiele

Benutzernamen aus einem Link auslesen

const link = document.createElement('a');
link.href = 'https://anna:geheim@example.com/intern/';

console.log(link.username);
console.log(link.password);
console.log(link.host);

anna geheim example.com

Benutzernamen setzen – href wird angepasst

const link = document.createElement('a');
link.href = 'ftp://files.example.org/pub/';

link.username = 'max mustermann';
console.log(link.username);
console.log(link.href);

max%20mustermann ftp://max%20mustermann@files.example.org/pub/

Zugangsdaten aus allen Links einer Seite entfernen

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

document.body.innerHTML = '<a href="https://admin:1234@intranet.example.com/">Intranet</a>';
bereinigeLinks();
console.log(document.querySelector('a').href);

https://intranet.example.com/

Kein Benutzername vorhanden

const link = document.createElement('a');
link.href = 'https://example.com/';
console.log(JSON.stringify(link.username));

""

// Wichtig · Fallstricke

Sicherheit: Zugangsdaten in URLs (user:pass@host) sind veraltet und riskant. Sie landen in Verlauf, Logs und Referer-Headern. Viele Browser blockieren solche Unterressourcen oder warnen bei der Navigation, und Phishing-Links wie https://bank.de@boese.example/ nutzen diese Syntax zur Täuschung. Ist username nicht leer, ist die URL deshalb verdächtig.
Bei URLs ohne Host (z. B. mailto:, data:) oder mit dem Schema file: hat das Setzen keine Wirkung.
Bei relativen oder ungültigen href-Werten wird zuerst gegen die Basis-URL des Dokuments aufgelöst. Ist die URL ungültig, liefert die Eigenschaft "" und das Setzen wird ignoriert.
Der Wert ist prozentkodiert. Den lesbaren Klartext erhält man mit decodeURIComponent(link.username).
Kompatibilität: wird von allen aktuellen Browsern unterstützt. Der Internet Explorer kennt die Eigenschaft nicht.

Siehe auch

URL.username HTMLMeterElement.optimum HTMLOutputElement.name HTMLAnchorElement.hostname HTMLAnchorElement.pathname