# Shopware API & PayPal CardFields
**URL:** https://forum.shopware.com/t/shopware-api-paypal-cardfields/106301
**Category:** Shopware 6 (German)
**Tags:** programming
**Created:** [20. Januar 2025 um 07:22 UTC](https://forum.shopware.com/t/shopware-api-paypal-cardfields/106301 "2025-01-20T07:22:46Z")
**Posts on this page:** 3
**Page:** 1
### Author:  [@wb\_markus](https://forum.shopware.com/u/wb_markus)
#### Post date: [20. Januar 2025 um 07:22 UTC](https://forum.shopware.com/t/shopware-api-paypal-cardfields/106301/1 "2025-01-20T07:22:46Z")
Hi,
Langsam sind wir etwas am verzweifeln mit PayPal und der Shopware API.
Die PayPal Zahlung ansich funktioniert wunderbar, man erstellt eine Order, leitet das HandlePayment ein und der User wird zu PayPal weitergeleitet.
Schritte dafür:
```auto
const handlePayPalNativePayment = async () => {
order.value = await createOrder()
// creating the payment route
const SUCCESS_PAYMENT_URL = `${window?.location?.origin}/${locale.value}/checkout/order/${order.value.id}/paid`
const FAILURE_PAYMENT_URL = `${window?.location?.origin}/${locale.value}/checkout/order/${order.value.id}/unpaid`
// Shopware paypal payment
const handlePaymentResponse = await handlePayment(
SUCCESS_PAYMENT_URL,
FAILURE_PAYMENT_URL,
)
isLoading.value = false
const redirectUrl = handlePaymentResponse?.data?.redirectUrl
if (redirectUrl) {
window.location.href = redirectUrl
}
}
```
Allerdings bekommen wir es nicht gebacken die PayPal.CardFields ordentlich zu verwenden.
Zur Illustration ist hier unser Checkout:
Grundsätzlich rufen wir normal über die PayPal SDK
`paypal.CardFields` auf.
Die CreateOrder Funktion wäre folgende. (PS: Wir haben auch bereits probiert den Payment Flow komplett ohne Shopware zu erledigen.)
```auto
createOrder: async () => {
const response = await apiClient.invoke(
'payPalCreateOrder post /paypal/express/create-order',
{
body: {
product: 'acdc',
},
},
)
return response.data.token
},
```
onApprove (Funktioneirt aktuell mit diesem Code nicht)
```auto
await apiClient.invoke(
'payPalPrepare post /paypal/express/prepare-checkout',
{
body: { token: data.orderID },
},
)
```
Danach hat man die bezahlte Order ID von PayPal und wir können, theoretisch, die Shopware Order erstellen und ein HandlePayment initialisieren.
Das Problem, „handlePayment“ wirft uns dann einen Error mit „Transaction already Complete“. Macht möglicherweise auch Sinn, weil sie schon bezahlt ist.
```auto
const handledPaymentResponse = await apiClient.invoke(
'handlePayment post /handle-payment',
{
query: {
orderId: order.value.id,
finishUrl,
},
body: {
orderId: order.value.id,
// isPayPalSpbCheckout: false,
// paymentDetails,
product: 'acdc',
paypalOrderId: orderId,
},
},
)
```
Was wäre hier der richitge Weg um es zum funktionieren zu bekommen?
Danke im Voraus!!
LG
---
### Author:  [@wb\_markus](https://forum.shopware.com/u/wb_markus)
#### Post date: [20. Januar 2025 um 10:00 UTC](https://forum.shopware.com/t/shopware-api-paypal-cardfields/106301/2 "2025-01-20T10:00:03Z")
Okay für all jene die über Google auf diesen Beitrag stoßen.
So funktionierts:
1. PayPal CardFields über die PayPal SDK rendern
2. die CreateOrder Methode der PayPal SDK muss /paypal/express/create-order aufrufen
z.B (ob „product: „acdc“ sein muss oder nicht, weiß ich leider nicht“)
```auto
const response = await apiClient.invoke(
'payPalCreateOrder post /paypal/express/create-order',
{
body: {
product: 'acdc',
},
},
)
return response.data.token
```
1. Der Response von 2 ist die orderID von PayPal.
2. in onApprove von PayPal rufen createOrder von Shopware auf sowie handlePayment im Anschluss.
z.B
```auto
order.value = await createOrder({
orderId,
})
const finishUrl = `${window.location.origin}/${locale.value}/checkout/order/${order.value.id}/paid`
const errorUrl = `${window.location.origin}/${locale.value}/checkout/order/${order.value.id}/failed`
const handledPaymentResponse = await apiClient.invoke(
'handlePayment post /handle-payment',
{
query: {
orderId: order.value.id,
finishUrl,
},
body: {
orderId: order.value.id,
product: 'acdc',
paypalOrderId: orderId,
},
},
)
```
1. Danach muss die Transaktion in PayPal noch bestätigt bzw. „captured“ werden. Wir haben uns eine eigene Caputre Payment Backend Route geschaffen die das erledigt.
2. Der Response vomm Handlepayment aus SChritt 4 gibt eine „Finalize Transaction“ URL zurück. Die rufen wir mit einem GET Request auf.
3. Erledigt und die Bestellung sollte als Bezahlt markiert sein.
---
### Author:  [@system](https://forum.shopware.com/u/system)
#### Post date: [19. Februar 2025 um 10:00 UTC](https://forum.shopware.com/t/shopware-api-paypal-cardfields/106301/3 "2025-02-19T10:00:26Z")
Dieses Thema wurde automatisch 30 Tage nach der letzten Antwort geschlossen. Es sind keine neuen Antworten mehr erlaubt.