PaymentRequest: PaymentRequest() Konstruktor
Limited availability
This feature is not Baseline because it does not work in some of the most widely-used browsers.
Sicherer Kontext: Diese Funktion ist nur in sicheren Kontexten (HTTPS) in einigen oder allen unterstützenden Browsern verfügbar.
Der PaymentRequest()
Konstruktor erstellt ein neues PaymentRequest
Objekt, das verwendet wird, um den Prozess zum Erstellen, Validieren und Absenden einer Zahlungsanforderung zu handhaben.
Syntax
new PaymentRequest(methodData, details)
new PaymentRequest(methodData, details, options)
Parameter
methodData
-
Enthält ein Array von Bezeichnern für die Zahlungsmethoden, die die Händler-Website akzeptiert, sowie alle zugehörigen zahlungsmethodenspezifischen Daten. Jedes Element im Array enthält die folgenden Felder:
supportedMethods
-
Ein String, der eine Zahlungsmethoden-Bezeichner enthält. Dies ist entweder eine URL oder einer der standardisierten Zahlungsmethoden-Bezeichner. Der Wert und die Struktur des
data
-Feldes variieren je nach dem Wert imsupportedMethods
-Feld. data
-
Ein JSON-serialisierbares Objekt, das optionale Informationen bietet, die von den unterstützten Zahlungsmethoden benötigt werden könnten. Dies muss dem vom Zahlungshandler erwarteten Typ entsprechen, der durch
supportedMethods
angegeben wird. Entwickler müssen diejenigen konsultieren, die die Zahlungsmethoden kontrollieren, um die erwartete Struktur des Datenobjekts zu erfahren. WennsupportedMethods
secure-payment-confirmation
ist, mussdata
demSecurePaymentConfirmationRequest
Wörterbuch entsprechen.
details
-
Bietet Informationen über die angeforderte Transaktion. Dieser Parameter enthält die folgenden Felder:
total
-
Der Gesamtbetrag der Zahlungsanforderung.
id
Optional-
Ein frei gestaltbarer Bezeichner für diese Zahlungsanforderung. Wenn kein Wert angegeben wird, wird der Browser einen erstellen.
displayItems
-
Ein Array von optionalen Positionen für die Zahlungsanforderung, die vom User-Agent angezeigt werden können, wie Produktdetails, Steuern und Versand.
shippingOptions
-
Die Versandoptionen, die der Benutzer auswählen kann. Wenn diese Sequenz leer ist, zeigt dies an, dass der Händler nicht an die aktuelle Versandadresse liefern kann. Die Standardversandoption kann in dieser Sequenz angegeben werden.
modifiers
-
Modifikatoren für spezifische Zahlungsmethoden; zum Beispiel, um den Gesamtbetrag basierend auf der Zahlungsmethode anzupassen. Dieser Parameter enthält die folgenden Felder:
additionalDisplayItems
-
Ein Array von Elementen, die an die Eigenschaft
details.displayItems
angehängt werden sollen. Diese Eigenschaft wird häufig verwendet, um eine Rabatt- oder Zuschlagposition hinzuzufügen, die den unterschiedlichen Betrag indetails.modifiers.total
anzeigt. data
-
Ein JSON-serialisierbares Objekt, das optionale Informationen bietet, die für die unterstützten Zahlungsmethoden benötigt werden könnten.
total
-
Ein Gesamtbetrag für die Zahlungsanforderung, der den Wert in
details.total
überschreibt. Dies wird typischerweise verwendet, wenndetails.modifiers.additionalItems
einen Rabatt oder einen Kauf zur Anforderung hinzufügt.
options
Optional-
Ermöglicht es Ihnen, Optionen einzustellen, die das Verhalten des User-Agent steuern. Dieser Parameter enthält die folgenden Felder:
requestPayerName
-
Ein Boolean, der angibt, ob der User-Agent den Namen des Zahlers sammeln und mit der Zahlungsanforderung einreichen soll. Der Standardwert ist
false
. requestPayerEmail
-
Ein Boolean, der angibt, ob der User-Agent die E-Mail-Adresse des Zahlers sammeln und mit der Zahlungsanforderung einreichen soll. Der Standardwert ist
false
. requestPayerPhone
-
Ein Boolean, der angibt, ob der User-Agent die Telefonnummer des Zahlers sammeln und mit der Zahlungsanforderung einreichen soll. Der Standardwert ist
false
. requestShipping
-
Ein Boolean, der angibt, ob der User-Agent die Versandadresse des Zahlers sammeln und mit der Zahlungsanforderung einreichen soll. Wenn Sie diesen Wert auf
true
setzen, sollten Sie einen geeignetenshippingType
auswählen. Der Standardwert istfalse
. shippingType
-
Ermöglicht es Ihnen, zu spezifizieren, wie die Benutzeroberfläche auf den Versand Bezug nimmt, wenn das Wort 'Versand' nicht für Ihren Anwendungsfall geeignet ist. Zum Beispiel würde man in englischsprachigen Ländern "pizza delivery" und nicht "pizza shipping" sagen. Gültige Werte sind
"shipping"
,"delivery"
und"pickup"
. Anführungszeichen müssen eingeschlossen werden. Der Standardwert ist"shipping"
.
Rückgabewert
Ein neues PaymentRequest
Objekt, das basierend auf den Eingabeparametern konfiguriert ist.
Ausnahmen
SecurityError
DOMException
-
Die Nutzung dieses Features wurde durch eine Permissions Policy blockiert.
Beispiele
Das folgende Beispiel zeigt die minimale Funktionalität und konzentriert sich stattdessen darauf, den vollständigen Kontext der Instanziierung eines PaymentRequest
Objekts zu zeigen.
const supportedInstruments = [
{
supportedMethods: "https://example.com/pay",
},
];
const details = {
total: { label: "Donation", amount: { currency: "USD", value: "65.00" } },
displayItems: [
{
label: "Original donation amount",
amount: { currency: "USD", value: "65.00" },
},
],
shippingOptions: [
{
id: "standard",
label: "Standard shipping",
amount: { currency: "USD", value: "0.00" },
selected: true,
},
],
};
const options = { requestShipping: true };
try {
const request = new PaymentRequest(supportedInstruments, details, options);
// Add event listeners here.
// Call show() to trigger the browser's payment flow.
request
.show()
.then((instrumentResponse) => {
// Do something with the response from the UI.
})
.catch((err) => {
// Do something with the error from request.show().
});
} catch (e) {
// Catch any other errors.
}
Spezifikationen
Specification |
---|
Payment Request API # constructor |
Browser-Kompatibilität
BCD tables only load in the browser