Why paymentID is null after PayPal transaction?

Question

I'm using PayPal in sandbox mode and @paypal/react-paypal-js in my React application and I'm using .NET 5 as my REST API. Here is my payload when I want to create an order:

{
  "totalAmount": 102,
  "tax": 0,
  "fee": 2,
  "paymentMethod": 1,
  "items": [
    {
      "amount": 100,
      "reciver": "vala",
      "phone": "0912351231",
      "email": "vala@gmail.com",
      "sender": "ali",
      "count": 1
    }
  ]
}

And here is part of my react code that call PayPal API:

<BoxPayment isRtl={isRtl}>
    <Text as="h3">{translations.buyPage.paymentMethodTitle}</Text>
    <Text as="p">{translations.buyPage.paymentMethodSubTitle}</Text>
    <div style={{ 'paddingTop': '.5rem' }}>
        <PayPalScriptProvider options={initialOptions}>
        <PayPalButtons createOrder={(data, actions) => createOrder(data, actions)}
            onApprove={(data, actions: any) => {
            console.log('data', data);
            console.log('actions', actions);
            return actions.order.capture().then((details: any) => {
                console.log('details', details);
                const name = details.payer.name.given_name;
            });
            }} />
        </PayPalScriptProvider>
    </div>
</BoxPayment>

But after successful payment here's what I receive when I console.log data object:

{
    "orderID": "48G91901G2470590C",
    "payerID": "NBPJH63GK5H5Q",
    "paymentID": null,
    "billingToken": null,
    "facilitatorAccessToken": "A11VAJ-tUcUqKkJgAhnyfVGVYg6Z57SvqHfspQqB8vtUDjDzBMIBlvO6rDvwdIjW7aJwvQQYeMAGyWitChtVZ8LyBzCw"
}

What I am missing?

Answer 1

Within onApprove , the order hasn't been captured when you are printing that data. Capture the order first. When an order is captured, its transaction ID will be in the response's purchase_units[0].payments.captures[0]

---

If you need to do anything important with that ID, such as store it in a database, used a server-side integration ( not actions.order.capture nor actions.order.create, client-side code is not for database operations). See the optional step #5 in the 'Add and modify the code' section of the guide for Integrate Checkout , and be sure to use the client-side error handling code in its linked demo pattern example .