Signatur
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
[]), 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);
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));
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
shippingaddresschangeliefern Browser die Adresse oft nur gekürzt. Dann istaddressLineein leeres Array, und die vollständige Adresse gibt es erst inPaymentResponse.shippingAddressnach 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 einenTypeError. 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
textContentstattinnerHTML. - Nur in sicheren Kontexten verfügbar (HTTPS).