Start · Sprachen · JavaScript · Referenz · PaymentAddress.addressLine

PaymentAddress.addressLine

Eigenschaft

Schreibgeschütztes Array von Zeichenfolgen mit den Adresszeilen (Straße, Hausnummer, Zusätze) einer Liefer- oder Rechnungsadresse aus der Payment Request API.

seit JavaScript Veraltet; nur Chromium-Browser (Chrome/Edge), nich deprecated seit ja Kategorie: webapi

Signatur

PaymentAddress.addressLine

Beschreibung

Die schreibgeschützte Eigenschaft addressLine eines PaymentAddress-Objekts enthält ein Array von Zeichenfolgen. Jedes Element steht für eine Zeile des Adressblocks, der sich nicht über andere Felder abbilden lässt, etwa Straße und Hausnummer, Gebäude, Stockwerk, Apartment oder c/o-Zusätze.

Du bekommst ein PaymentAddress-Objekt über PaymentResponse.shippingAddress, sobald eine Zahlungsanfrage mit requestShipping: true abgeschlossen ist. Im Ereignis shippingaddresschange steht es außerdem über PaymentRequest.shippingAddress bereit. Die Reihenfolge der Zeilen folgt der Reihenfolge, in der sie in einer postalischen Adresse stehen.

Die Anzahl der Zeilen ist nicht festgelegt: Das Array kann leer sein, eine Zeile oder mehrere enthalten. Dein Code sollte deshalb jede Länge verarbeiten, statt fest mit addressLine[0] und addressLine[1] zu rechnen. Beim Serialisieren über toJSON() wird die Eigenschaft als normales Array übernommen.

Hinweis: Das Interface PaymentAddress wurde in neueren Fassungen der Spezifikation in ContactAddress umbenannt, und die Adressdaten-Funktionen der Payment Request API gelten als veraltet. Für neue Projekte empfiehlt sich ein eigenes Adressformular oder das Adressformular des Zahlungsanbieters.

Rückgabewert

Typ
ReadonlyArray<string>
Beschreibung
Ein eingefrorenes Array mit den Adresszeilen in postalischer Reihenfolge. Es kann auch leer sein ([]), wenn keine Zeilen vorhanden sind oder der Browser sie aus Datenschutzgründen entfernt hat.

Beispiele

Adresszeilen nach dem Bezahlvorgang auslesen

const methods = [{ supportedMethods: 'https://example.com/pay' }];
const details = {
  total: { label: 'Summe', amount: { currency: 'EUR', value: '19.99' } }
};

const checkout = async () => {
  const request = new PaymentRequest(methods, details, { requestShipping: true });
  const response = await request.show();
  const { addressLine, postalCode, city } = response.shippingAddress;

  console.log('Adresszeilen:', addressLine);
  console.log(`${addressLine.join(', ')}, ${postalCode} ${city}`);

  await response.complete('success');
};

document.querySelector('#buy').addEventListener('click', checkout);
Adresszeilen: ["Hauptstraße 12", "3. OG, Hinterhaus"] Hauptstraße 12, 3. OG, Hinterhaus, 10115 Berlin

Beliebig viele Zeilen für ein Versandetikett formatieren

const formatLabel = (address) => {
  const lines = [
    address.recipient,
    ...address.addressLine.filter((line) => line.trim() !== ''),
    `${address.postalCode} ${address.city}`,
    address.country
  ];
  return lines.filter(Boolean).join('\n');
};

// Aufruf, z. B. mit response.shippingAddress
// console.log(formatLabel(response.shippingAddress));
Erika Mustermann Hauptstraße 12 3. OG, Hinterhaus 10115 Berlin DE

Adresse bei shippingaddresschange prüfen

const request = new PaymentRequest(
  [{ supportedMethods: 'https://example.com/pay' }],
  { total: { label: 'Summe', amount: { currency: 'EUR', value: '49.00' } } },
  { requestShipping: true }
);

request.addEventListener('shippingaddresschange', (event) => {
  const { addressLine } = request.shippingAddress;
  const isPackstation = addressLine.some((line) => /packstation/i.test(line));

  event.updateWith({
    total: { label: 'Summe', amount: { currency: 'EUR', value: '49.00' } },
    error: isPackstation ? 'Lieferung an Packstationen ist nicht möglich.' : undefined
  });
});

// Wichtig · Fallstricke

  • Veraltet und kaum verfügbar: Die Eigenschaft wird praktisch nur in Chromium-Browsern unterstützt. Firefox und Safari bieten sie nicht an; in Safari laufen Adressen über Apple Pay. Prüfe vor der Nutzung, ob die API vorhanden ist, zum Beispiel mit 'PaymentRequest' in window, und plane immer ein normales Adressformular als Alternative ein.
  • Datenschutz: Im Ereignis shippingaddresschange liefern Browser die Adresse oft nur gekürzt. Dann ist addressLine ein leeres Array, und die vollständige Adresse gibt es erst in PaymentResponse.shippingAddress nach der Bestätigung durch den Nutzer.
  • Nicht auf feste Indizes verlassen: Straße und Hausnummer stehen nicht garantiert in getrennten Zeilen. Auch die Anzahl der Zeilen ist je nach Land und Eingabe unterschiedlich.
  • Schreibgeschützt: Das Array ist eingefroren. Aufrufe wie push() werfen im Strict Mode einen TypeError. Wenn du die Zeilen ändern willst, erstelle zuerst eine Kopie mit [...addressLine].
  • Nutzereingaben: Die Werte kommen vom Nutzer. Bereinige sie vor der Speicherung und maskiere sie vor der HTML-Ausgabe, zum Beispiel mit textContent statt innerHTML.
  • Nur in sicheren Kontexten verfügbar (HTTPS).