Signatur
Beschreibung
Die schreibgeschützte Eigenschaft sortingCode des PaymentAddress-Interfaces liefert einen postalischen Sortiercode. Das ist eine zusätzliche Angabe, die manche Postsysteme neben der Postleitzahl zur Sortierung von Sendungen verwenden. Typische Beispiele sind der französische CEDEX-Code (Courrier d'Entreprise à Distribution Exceptionnelle) für Großempfänger und vergleichbare Codes, etwa in der Elfenbeinküste.
Ein PaymentAddress-Objekt bekommst du im Rahmen der Payment Request API: entweder über PaymentRequest.shippingAddress, während der Nutzer eine Lieferadresse auswählt (Ereignis shippingaddresschange), oder nach Abschluss des Bezahlvorgangs über PaymentResponse.shippingAddress. Dafür musst du beim Erstellen des PaymentRequest die Option requestShipping: true setzen.
In den meisten Ländern gibt es keinen Sortiercode. Die Eigenschaft enthält dann einen leeren String. Behandle den Wert deshalb immer als optional und gib ihn in Versandetiketten nur dann aus, wenn er tatsächlich vorhanden ist. Bei französischen Adressen steht er üblicherweise hinter Postleitzahl und Ort (z. B. „75008 PARIS CEDEX 08“).
Rückgabewert
"" (leerer String), wenn keiner vorhanden ist bzw. der Browser ihn aus Datenschutzgründen nicht übermittelt.Beispiele
Sortiercode nach dem Bezahlvorgang auslesen
const methods = [{ supportedMethods: 'https://example.com/pay' }];
const details = {
total: { label: 'Gesamt', amount: { currency: 'EUR', value: '49.90' } }
};
const checkout = async () => {
const request = new PaymentRequest(methods, details, { requestShipping: true });
const response = await request.show();
const address = response.shippingAddress;
console.log('Land:', address.country);
console.log('PLZ:', address.postalCode);
console.log('Sortiercode:', address.sortingCode || '(keiner)');
await response.complete('success');
};
document.querySelector('#pay').addEventListener('click', checkout);
Adresse bei shippingaddresschange prüfen
const request = new PaymentRequest(
[{ supportedMethods: 'https://example.com/pay' }],
{ total: { label: 'Gesamt', amount: { currency: 'EUR', value: '20.00' } } },
{ requestShipping: true }
);
request.addEventListener('shippingaddresschange', (event) => {
const { country, sortingCode } = request.shippingAddress;
// Beispiel: CEDEX-Adressen werden vom Versanddienst nicht beliefert
const isCedex = country === 'FR' && /CEDEX/i.test(sortingCode);
event.updateWith({
total: { label: 'Gesamt', amount: { currency: 'EUR', value: '20.00' } },
...(isCedex && { error: 'Lieferungen an CEDEX-Adressen sind nicht möglich.' })
});
});
request.show().catch((err) => console.warn('Abgebrochen:', err.name));
Adresszeile für ein Versandetikett formatieren
// Funktioniert mit PaymentAddress oder einem Objekt mit gleicher Struktur
const formatCityLine = ({ postalCode, city, sortingCode }) =>
[postalCode, city.toUpperCase(), sortingCode].filter(Boolean).join(' ');
console.log(formatCityLine({ postalCode: '75008', city: 'Paris', sortingCode: 'CEDEX 08' }));
console.log(formatCityLine({ postalCode: '10115', city: 'Berlin', sortingCode: '' }));
// Wichtig · Fallstricke
- Veraltet: Die Abfrage von Lieferadressen (
requestShipping,PaymentAddress) wurde aus der Payment-Request-Spezifikation entfernt. Heute funktioniert sie praktisch nur noch in Chromium-basierten Browsern. Firefox und Safari unterstützenPaymentAddressnicht bzw. nicht vollständig. Neue Projekte sollten die Adresse lieber über ein eigenes Formular abfragen. Eine standardisierte Alternative istContactAddressaus der Contact Picker API. - Der Wert ist oft ein leerer String, nicht
null. Prüfe ihn deshalb mitif (address.sortingCode)statt mit!== null. - Datenschutz: Beim Ereignis
shippingaddresschangedürfen Browser die Adresse vor dem Abschluss unvollständig übermitteln („redacted“). Einzelne Felder, daruntersortingCode, können dann leer sein. Verlässliche Werte gibt es erst inPaymentResponse.shippingAddress. - Die API steht nur in sicheren Kontexten (HTTPS) zur Verfügung.
request.show()muss durch eine Nutzeraktion ausgelöst werden, z. B. einen Klick. - Der Inhalt wird nicht geprüft. Übernimm ihn also nicht ungefiltert in HTML (
innerHTML), sonst droht XSS. Verwende stattdessentextContent.