Direct integration
In this scheme, an online store has its own payment page to collect card data natively through its web site.
First, you should subscribe to the following webhooks (see Webhooks for details):
-
payment.succeeded
- occurs when a payment succeeds. -
payment.failed
- occurs when a payment fails.
("/payments" request) activate PG PG -->> PG: Create Payment PG -->> OS: "payment.created" webhook OS ->> PG: HTTP Code = 200 PG -->> OS: Response rect rgb(191, 223, 255) alt 3 DS is required OS -->> C: Redirect to ACS for 3DS verification C ->> PG: Confirm Payment end end PG -->> PG: Process payment PG -->> OS: "payment.succeeded" webhook OS ->> PG: HTTP Code = 200 rect rgb(191, 223, 255) opt Retrieving Payment status OS ->> PG: Retrieve a Payment
("/payments/{id}" request) PG -->> OS: Payment with "status=succeeded" end end deactivate OS deactivate PG
- A customer selects a product in the online store, and then clicks Buy.
- The online store server receives a purchase request and opens a payment page.
- The customer enters their card details on the online store payment page.
-
The online store server sends
/payments
request to the Payment Gateway to create a Payment (see API Reference for details). The request should containamount
parameter (the amount of the payment in minor currency units, e.g. in cents) andcurrency
parameter (three-letter code of the payment currency, according to ISO 4217). Additionally, you should pass eitherpaymentMethod
block with card data orstoredPaymentMethodId
parameter (the identifier of a Stored Payment Method).Request example:
curl -X POST "https://dev.bpcbt.com/api2/payments" \ -H "X-Api-Key: 6HUXQFbeomV1zf5i8cgm5W8KfncENVEa5uh8RngB" \ -H "X-Version: 2023-10-31" \ -H "Content-Type: application/json" \ -d '{ "amount": 70000, "captureMethod": "automatic", "currency": "EUR", "customerDetails": { "address": { "city": "Test city", "country": "CY", "line1": "Test address1", "line2": "Test address2", "postalCode": "Test postal code", "state": "Test state" }, "email": "test@example.com", "name": "TEST CARDHOLDER", "phone": "+449998887766" }, "description": "Some description", "metadata": {}, "paymentMethod": { "type": "card", "card": { "cvc": "123", "expiryMonth": 12, "expiryYear": 2024, "holderName": "TEST CARDHOLDER", "number": "4444555511113333" } }, "paymentMethodOptions": { "card": { "threeDSecureMode": "automatic", "verify": false } }, "returnUrl": "https://mybestmerchantreturnurl.com/" }'
Payment Gateway creates a Payment.
Payment Gateway sends
payment.created
webhook to the online store.Online store server sends
HTTP Code = 200
in response.-
Payment Gateway sends the response for the
/payments
request.- If the response contains the
nextAction
block, this means that 3-D Secure is required. Steps 9 and 10 are performed. - If the response does not contain the
nextAction
block, 3-D Secure is not required. In this case, Steps 9 and 10 are omitted, go to Step 11. - If the payment was successfull, the response contains
status=succeeded
.
Response example:
{ "id": "p_HbtjsyTuig5SWYufjsFeTNAX3WisQFUSvbroA1C48Y5XN8Pstcdw", "amount": 70000, "amountCapturable": 0, "amountReceived": 70000, "captureMethod": "automatic", "created": "2024-03-31T23:40:24Z", "currency": "EUR", "customerDetails": { "address": { "city": "Test city", "country": "CY", "line1": "Test address1", "line2": "Test address2", "postalCode": "Test postal code", "state": "Test state" }, "email": "test@example.com", "name": "TEST CARDHOLDER", "phone": "+449998887766" }, "description": "Some description", "metadata": {}, "paymentMethod": { "card": { "expiryMonth": 12, "expiryYear": 2024, "holderName": "TEST CARDHOLDER", "maskedNumber": "444455**3333" }, "type": "card" }, "paymentMethodOptions": { "card": { "threeDSecureMode": "automatic", "verify": false } }, "returnUrl": "https://mybestmerchantreturnurl.com/", "status": "succeeded" }
- If the response contains the
Online store redirects the customer to the URL for 3-D Secure verification.
The customer confirms payment.
Payment Gateway processes payment.
Payment Gateway sends
payment.succeeded
webhook to the online store.-
Online store server sends
HTTP Code = 200
in response. Online store sends
/payments/{id}
request to retrieve a Payment.In response, Payment Gateway sends the Payment object with
status=succeeded
.