# Aktualisiert initCheckout, sodass es synchron ausgeführt wird

## Das ändert sich

Die Methode [stripe.initCheckout](https://docs.stripe.com/js/custom_checkout/init) ist jetzt synchron statt asynchron.

## Warum ist dies eine wichtige Änderung?

Diese grundlegende Änderung betrifft Sie, wenn Ihre Integration [Elements mit der Checkout Sessions API](https://docs.stripe.com/payments/quickstart-checkout-sessions.md) verwendet.

#### HTML + JS

Um zu migrieren, müssen Sie:

1. Entfernen Sie alle mit `initCheckout` verknüpften Aufrufe von `await` oder `.then()`.
1. Ersetzen Sie Ihre `fetchClientSecret`-Funktion durch eine Client-Geheimnis-Zeichenfolge oder ein Promise, das in eine Client-Geheimnis-Zeichenfolge aufgelöst wird.
1. Rufen Sie die neue asynchrone Funktion `checkout.loadActions()` auf, um auf Aktionen wie `getSession()` zuzugreifen, die `session()` ersetzt oder `confirm()`. Sie müssen `loadActions()` nur einmal aufrufen.
1. Wenn Sie zuvor `initCheckout` in einen `try...catch`-Block eingebunden haben, sollten Sie stattdessen den aufgelösten `type`-Wert von `loadActions()` prüfen, um Fehler zu erkennen.

```javascript
const clientSecret = fetch("/create-checkout-session", {
  method: "POST",
  headers: { "Content-Type": "application/json" },
})
  .then((r) => r.json())
  .then((r) => r.clientSecret);
const checkout = stripe.initCheckout({
  clientSecret
});
const paymentElement = checkout.createPaymentElement();
paymentElement.mount("#payment-element");
const loadActionsResult = await checkout.loadActions();
if (loadActionsResult.type === 'success') {
  const session = loadActionsResult.actions.getSession();
}
```

#### React

Ihre `@stripe/react-stripe-js`-Abhängigkeit auf mindestens Version 5.0.0 aktualisieren. Wenn Sie von einer Version vor 4.0.0 aktualisieren, lesen Sie unbedingt die [Release Notes](https://github.com/stripe/react-stripe-js/releases/tag/v4.0.0), um die Änderungen nachzuvollziehen.

Wenn Sie ein Upgrade von Version 4.0.0 oder höher durchführen, müssen Sie Ihre `fetchClientSecret`-Funktion durch eine Client-Geheimnis-Zeichenfolge oder ein Promise ersetzen, das in eine Client-Geheimnis-Zeichenfolge aufgelöst wird. Sie können jedes Element auch rendern, ohne zuvor zu prüfen, ob `useCheckout` `type: 'success'` zurückgegeben hat, um die Latenz in Ihrer Integration zu reduzieren und Elements zu ermöglichen, ihre Skeleton-Loader früher anzuzeigen.

```jsx
const App = () => {
  const promise = useMemo(() => {
    return fetch('/create-checkout-session', {
      method: 'POST',
      headers: { "Content-Type": "application/json" },
    })
      .then((res) => res.json())
      .then((data) => data.clientSecret);
  }, []);

  return (
    <CheckoutProvider 
      stripe={stripePromise}
      options={{clientSecret: promise
      }}
    >
      <CheckoutPage />
    </CheckoutProvider>
  );
}

const CheckoutPage = () => {
  const {type, ...rest} = useCheckout();

  return (
    <div><PaymentElement />
    </div>
  );
}
```

## Auswirkungen

Die synchrone Natur von `initCheckout` ermöglicht es Ihnen, Elements früher zu verbinden, was die Renderlatenz aller Elements verringert, die Sie direkt nach `initCheckout` verbinden. Dadurch kann Elements auch die Nutzeroberfläche des Skelett-Loaders anzeigen, sobald diese verbunden ist, aber der Sitzungsstatus noch nicht vollständig geladen wurde.

## Zugehörige Änderungen

- [Entfernt die Postleitzahl für Kartenzahlungen in bestimmten Regionen in Checkout und Payment Element](https://docs.stripe.com/changelog/clover/2025-09-30/postal_code_in_card_form_for_non_us_countries.md)
- [Entfernt das Feld für Währungsumrechnung aus Checkout-Sitzungen](https://docs.stripe.com/changelog/clover/2025-09-30/remove-checkout-session-currency-conversion-field.md)
- [Entfernt Support für die redirectToCheckout-Methode](https://docs.stripe.com/changelog/clover/2025-09-30/remove-redirect-to-checkout.md)
- [Fügt Support für die Erfassung der Namen von Unternehmen und Einzelpersonen in Checkout-Sessions hinzu](https://docs.stripe.com/changelog/clover/2025-09-30/checkout-name-collection.md)
- [Fügt die Möglichkeit hinzu, Zahlungsmethoden von Checkout Sessions und Payment Intents auszuschließen](https://docs.stripe.com/changelog/clover/2025-09-30/exclude-payment-methods-checkout-sessions.md)
- [Fügt Support zum Festlegen der Erfassungsmethode für einzelne Zahlungsmethoden mit der Checkout Sessions API hinzu](https://docs.stripe.com/changelog/clover/2025-09-30/checkout-capture-method-per-payment-method.md)
- [Fügt Support für die Konfiguration von Branding-Einstellungen für Checkout-Sitzungen hinzu.](https://docs.stripe.com/changelog/clover/2025-09-30/checkout-sessions-branding-settings.md)
- [Ermöglicht die Angabe von Maßeinheiten für Produkte](https://docs.stripe.com/changelog/clover/2025-09-30/product-data-unit-label.md)