Weiter zum Inhalt
Konto erstellen oder anmelden
Das Logo der Stripe-Dokumentation
/
Konto erstellenAnmelden
ÜbersichtAktualisieren Sie Ihre Integration
Online-Zahlungen
ÜbersichtIhren Use case findenVerwenden Sie Managed Payments
Erstellen Sie eine benutzerdefinierte Integration mit Elements
Präsenzzahlungen
Zahlungsmethoden
Zahlungsszenarien
Mehr als Zahlungen

Versandoptionen dynamisch anpassen

Erfahren Sie, wie Sie unterschiedliche Versandkosten für Ihre Kund/innen erstellen.

Erfahren Sie, wie Sie Versandoptionen dynamisch aktualisieren können, basierend auf der Adresse, die Ihre Kundin oder Ihr Kunde bei Verwendung der eingebetteten Version von Checkout eingibt. Dynamische Aktualisierungen sind bei der von Stripe gehosteten Version von Checkout nicht verfügbar.

Anwendungsszenarien

  • Adresse validieren: Bestätigen Sie, ob Sie ein Produkt an die Adresse eines Kunden/einer Kundin senden können, indem Sie Ihre eigenen nutzerdefinierten Validierungsregeln verwenden. Sie können auch eine individuelle Nutzeroberfläche für Kundinnen/Kunden erstellen, um ihre bevorzugte Adresse zu bestätigen.
  • Relevante Versandoptionen anzeigen: Nur verfügbare Versandmethoden basierend auf der Kundenadresse anzeigen. Zeigen Sie beispielsweise den Versand über Nacht nur für Lieferungen in Ihrem Land an.
  • Versandraten dynamisch berechnen: Berechnen und Anzeigen der Versandkosten basierend auf der Lieferadresse eines Kunden/einer Kundin.
  • Versandkosten basierend auf der Bestellsumme aktualisieren: Bieten Sie Versandkosten basierend auf der Versandadresse oder der Bestellsumme an, z. B. kostenlosen Versand für Bestellungen über 100 USD. Informationen zu Bezahlvorgängen, bei denen Mengenänderungen oder Cross-Selling zulässig sind, finden Sie unter Dynamische Aktualisierung von Posten.

Beschränkungen

Payment Intents API

Wenn Sie die Payment Intents API verwenden, müssen Sie die Versandoptionen manuell aktualisieren und den Zahlung basierend auf einer ausgewählten Versandoption ändern oder einen neuen PaymentIntent mit angepassten Beträgen erstellen.

Aktualisierungsberechtigungen für die Checkout-Sitzung konfigurieren
Serverseitig

Legen Sie die shipping_address_collection.allowed_countries auf die Liste der Länder fest, in die Sie den Versand anbieten möchten.

Wenn Sie die Checkout-Sitzung erstellen, übergeben Sie die Option permissions.update_shipping_details=server_only, um die clientseitige Methode updateShippingAddress zu deaktivieren und die Aktualisierung der Versandadresse und der Versandoptionen von Ihrem Server zu aktivieren.

Command Line
cURL
Stripe CLI
Ruby
Python
PHP
Java
Node.js
Go
.NET
No results
curl https://api.stripe.com/v1/checkout/sessions \
  -u "
sk_test_BQokikJOvBiI2HlWgH4olfQ2
:" \
  -d ui_mode=custom \
  -d "permissions[update_shipping_details]"=server_only \
  -d "shipping_address_collection[allowed_countries][0]"=US \
  -d "line_items[0][price]"=
"{{PRICE_ID}}"
 \
  -d "line_items[0][quantity]"=1 \
  -d mode=payment \
  --data-urlencode return_url="https://example.com/return"

Versandoptionen anpassen
Serverseitig

Erstellen Sie einen Endpoint auf Ihrem Server, um die auf der jeweiligen Versandadresse der Kund/innen basierenden Versandoptionen zu berechnen.

  1. Rufen Sie die Checkout-Sitzung mit der checkoutSessionId aus dem Anfragekörper ab.
  2. Überprüfen Sie die Versanddetails der Kundin/des Kunden aus dem Anfragetext.
  3. Berechnen Sie die Versandoptionen basierend auf der jeweiligen Versandadresse der Kund/innen und den Posten in der Checkout-Sitzung.
  4. Aktualisieren Sie die Checkout-Sitzung mit den shipping_details der Kund/innen und den shipping_options.
Ruby
Python
PHP
Node.js
.NET
Go
Java
No results
require 'sinatra'
require 'json'
require 'stripe'

set :port, 4242

# Set your secret key. Remember to switch to your live secret key in production!
# See your keys here: https://dashboard.stripe.com/apikeys
Stripe.api_key = 
"sk_test_BQokikJOvBiI2HlWgH4olfQ2"


# Return a boolean indicating whether the shipping details are valid
def validate_shipping_details(shipping_details)
  # TODO: Remove error and implement...
  raise NotImplementedError.new(<<~MSG)
    Validate the shipping details the customer has entered.
  MSG
end

# Return an array of the updated shipping options or the original options if no update is needed
def calculate_shipping_options(shipping_details, session)
  # TODO: Remove error and implement...
  raise NotImplementedError.new(<<~MSG)
    Calculate shipping options based on the customer's shipping details and the
    Checkout Session's line items.
  MSG
end

post '/calculate-shipping-options' do
  content_type :json
  request.body.rewind

Client-SDK aktualisieren
Clientseitig

Initialisieren Sie Stripe.js mit dem Beta-Header custom_checkout_server_updates_1.

checkout.js
const stripe = Stripe(
'pk_test_TYooMQauvdEDq54NiTphI7jx'
, {
  betas: ['custom_checkout_server_updates_1'],
});

Server-Aktualisierungen anfordern
Clientseitig

Erstellen Sie eine asynchrone Funktion, die eine Anfrage an Ihren Server stellt, um die Versandoptionen zu aktualisieren, und schließen Sie sie in runServerUpdate ein. Wenn die Anfrage erfolgreich ist, wird das Sitzungsobjekt mit den neuen Versandoptionen aktualisiert.

Im folgenden Codebeispiel wird gezeigt, wie die Versandoptionen mit dem AddressElement aktualisiert werden.

index.html
<div id="shipping-form">
    <!-- Shipping Address Element will be mounted here -->
    <div id="shipping-address-element"></div>
    <button id="save-button">Save</button>
    <div id="error-message"></div>
  </div>

  <div id="shipping-display" style="display: none">
    <div id="address-display"></div>
    <button id="edit-button">Edit</button>
  </div>
checkout.js
// mount the Shipping Address Element
const shippingAddressElement = checkout.createShippingAddressElement();
shippingAddressElement.mount('#shipping-address-element');

const toggleViews = (isEditing) => {
  document.getElementById('shipping-form').style.display = isEditing ? 'block' : 'none';
  document.getElementById('shipping-display').style.display = isEditing ? 'none' : 'block';
}

const displayAddress = (address) => {
  const displayDiv = document.getElementById('address-display');
  displayDiv.innerHTML = `
    <div>${address.name}</div>
    <div>${address.address.line1}</div>
    <div>${address.address.city}, ${address.address.state} ${address.address.postal_code}</div>
  `;
}

const updateShippingOptions = async (shippingDetails) => {
  const response = await fetch("/calculate-shipping-options", {
    method: "POST",
    headers: { 'Content-type': 'application/json' },
    body: JSON.stringify({
      checkout_session_id: 'session_id',
      shipping_details: shippingDetails
    })
  });

  const result = await response.json();

Integration testen

Befolgen Sie diese Schritte, um Ihre Integration zu testen und sicherzustellen, dass Ihre nutzerdefinierten Versandoptionen korrekt funktionieren.

  1. Richten Sie eine Sandbox-Umgebung ein, die die Einrichtung Ihrer Produktionsumgebung widerspiegelt. Verwenden Sie Ihre Sandbox-API-Schlüssel von Stripe für diese Umgebung.

  2. Simulieren Sie verschiedene Versandadressen, um zu überprüfen, ob Ihre Funktion calculateShippingOptions verschiedene Szenarien korrekt verarbeitet.

  3. Überprüfen Sie die serverseitige Logik, indem Sie Log- oder Debugging-Tools verwenden, um zu bestätigen, dass Ihr Server Folgendes tut:

    • Ruft die Checkout-Sitzung ab.
    • Überprüft die Versanddetails.
    • Berechnet die Versandoptionen.
    • Aktualisiert die Checkout-Sitzung mit den neuen Versanddetails und -optionen. Stellen Sie sicher, dass die Aktualisierungsantwort die neuen Versanddetails und -optionen enthält.

  4. Überprüfen Sie die clientseitige Logik, indem Sie den Bezahlvorgang mehrmals in Ihrem Browser abschließen. Achten Sie darauf, wie die Nutzeroberfläche aktualisiert wird, nachdem Sie die Versanddetails eingegeben haben. Stellen Sie sicher, dass:

    • Die Funktion runServerUpdate wird erwartungsgemäß aufgerufen.
    • Die Versandoptionen werden basierend auf der angegebenen Adresse korrekt aktualisiert.
    • Fehlermeldungen werden ordnungsgemäß angezeigt, wenn der Versand nicht verfügbar ist.

  5. Geben Sie ungültige Versandadressen ein oder simulieren Sie Serverfehler, um den Umgang mit Fehlern sowohl serverseitig als auch clientseitig zu testen.

War diese Seite hilfreich?
JaNein