Einzelposten dynamisch aktualisieren

Erfahren Sie, wie Sie die Preise und den Inhalt eines Warenkorbs während des Bezahlvorgangs ändern können.

Private Vorschau

Dynamische Rabatte befinden sich in der privaten Vorschau. Zugriff auf dynamische Aktualisierungen des Bezahlvorgangs anfordern.

Erfahren Sie, wie Sie Einzelposten, die in einer Checkout-Sitzung enthalten sind, dynamisch hinzufügen, entfernen oder aktualisieren.

Anwendungsszenarien

In diesem Leitfaden wird beschrieben, wie Sie Posten aktualisieren, um Upselling für ein Abonnement zu erhalten. Sie haben aber auch folgende Möglichkeiten:

Bestand prüfen: Sie Bestandsüberprüfungen und -stopps durch, wenn Kundinnen und Kunden versuchen, Artikelmengen zu ändern.
Neue Produkte hinzufügen: Fügen Sie ein kostenloses Produkt hinzu, wenn die Bestellsumme einen bestimmten Betrag überschreitet.
Versandkosten ändern: Wenn sich die Summe der Bestellung ändert, aktualisieren Sie die Versandkosten, indem Sie die in diesem Leitfaden beschriebene Methode mit den Versandoptionen während des Bezahlvorgangs kombinieren.
Steuersätze ändern: Wenn Sie Stripe Tax nicht verwenden, können Sie die Steuersätze für Einzelposten basierend auf der eingegebenen Versandadresse dynamisch aktualisieren.

Payment Intents API

Wenn Sie die Payment Intents API verwenden, müssen Sie Aktualisierungen von Posten manuell verfolgen und den Zahlungsbetrag ändern oder einen neuen PaymentIntent mit angepassten Beträgen erstellen.

SDK einrichten
Serverseitig

Verwenden Sie unsere offiziellen Bibliotheken, um von Ihrer Anwendung aus auf die Stripe API zuzugreifen:

Server-SDK aktualisieren
Serverseitig

Um diese Beta zu verwenden, aktualisieren Sie zunächst Ihr SDK, um den Beta-Header checkout_server_update_beta=v1 zu verwenden.

Aktualisierungsberechtigungen für die Checkout-Sitzung konfigurieren
Serverseitig

Übergeben Sie beim Erstellen der Checkout-Sitzung die Option permissions.update_line_items=server_only, um clientseitige Aktualisierungen zu deaktivieren und die Aktualisierung von Posten, wie z. B. updateLineItemQuantity, von Ihrem Server aus zu aktivieren.

Einzelposten dynamisch aktualisieren
Serverseitig

Erstellen Sie einen Endpoint auf Ihrem Server, um die Posten für die Checkout-Sitzung zu aktualisieren. Sie rufen diesen in einem späteren Schritt über das Frontend auf.

Sicherheitshinweis

Client-seitiger Code wird in einer Umgebung ausgeführt, die von dem/der Nutzer/in kontrolliert wird. Böswillige Nutzer/innen können Ihre clientseitige Validierung umgehen, Anfragen abfangen und ändern oder neue Anfragen an Ihren Server erstellen.

Beim Erstellen eines Endpoints empfehlen wir Folgendes:

Erstellen Sie Endpoints für bestimmte Kundeninteraktionen, anstatt sie allgemein zu gestalten. Beispiel: „Cross-Selling-Posten hinzufügen“ statt einer allgemeinen „Aktualisieren“-Aktion. Spezifische Endpoints können beim Schreiben und Pflegen der Validierungslogik helfen.
Übergeben Sie Sitzungsdaten nicht direkt vom Client an Ihren Endpoint. Bösartige Clients können Anfragedaten ändern, was sie zu einer unzuverlässigen Quelle für die Bestimmung des Status der Checkout-Sitzung macht. Übergeben Sie stattdessen die Sitzungs-ID an Ihren Server und verwenden Sie diese, um die Daten sicher von der Stripe API abzurufen.

Wenn Sie Posten aktualisieren, müssen Sie das gesamte Array von Posten erneut übertragen.

Um einen bestehenden Posten beizubehalten, geben Sie seine id an.
Um einen bestehenden Posten zu aktualisieren, geben Sie seine id zusammen mit den neuen Werten der zu aktualisierenden Felder an.
Um einen neuen Posten hinzuzufügen, geben Sie einen price und eine quantity ohne id an.
Um einen vorhandenen Posten zu entfernen, lassen Sie die ID des Postens im erneut übertragenen Array weg.
Um einen Posten neu anzuordnen, geben Sie seine id an der gewünschten Position im erneut übertragenen Array an.

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

Senden Sie von Ihrem Frontend aus eine Aktualisierungsanfrage an Ihren Server und schließen Sie sie in runServerUpdate ein. Eine erfolgreiche Anfrage aktualisiert das Sitzungsobjekt mit den neuen Posten.

index.html
<button id="change-subscription-interval" role="switch" aria-checked="false">
  Save with a yearly subscription
</button>

checkout.js
document.getElementById('change-subscription-interval')
  .addEventListener("click", async (event) => {
    const button = event.target;
    const isCurrentSubscriptionMonthly =
      button.getAttribute("aria-checked") === "false";

    const updateCheckout = () => {
      return fetch("/change-subscription-interval", {
        method: "POST",
        headers: {
          "Content-type": "application/json",
        },
        body: JSON.stringify({
          checkout_session_id: actions.getSession().id,
          interval: isCurrentSubscriptionMonthly ? "yearly" : "monthly",
        })
      });
    };

    const response = await checkout.runServerUpdate(updateCheckout);
    if (!response.ok) {
      // Handle error state
      return;
    }

    // Update toggle state on success
    const isNewSubscriptionMonthly = !isCurrentSubscriptionMonthly;
    button.setAttribute("aria-checked", !isNewSubscriptionMonthly);
    button.textContent = isNewSubscriptionMonthly
      ? "Save with a yearly subscription"
      : "Use monthly subscription";
  });

Einzelposten dynamisch aktualisieren

Erfahren Sie, wie Sie die Preise und den Inhalt eines Warenkorbs während des Bezahlvorgangs ändern können.

Private Vorschau

Anwendungsszenarien

Payment Intents API

SDK einrichtenServerseitig

Server-SDK aktualisierenServerseitig

Aktualisierungsberechtigungen für die Checkout-Sitzung konfigurierenServerseitig

Einzelposten dynamisch aktualisierenServerseitig