Mobile Inline Gateway

From Barion Documentation
Revision as of 13:40, 22 January 2025 by [email protected] (talk | contribs)
Jump to navigation Jump to search

Mobile Inline Gateway

There are different integration modes available for our merchants:

  • Redirect/Hosted gateway: The merchants redirect the customer to secure.barion.com and the payer uses the GUI there to conduct the payment
  • Inline gateway:
    • Inline web gateway: The merchant displays the payment methods on its website seamlessly like it was created by the merchant.
    • Inline mobile gateway: The merchant displays the payment methods in its mobile app seamlessly like it was created by the merchant.

This page describes the integration for the inline mobile gateway.

There are three ways to integrate the Barion Smart Gateway into a mobile app:

  • Barion Gateway Elements: The SDK provides every element separately, the merchant has the freedom to arrange them. This provides the highest amount of control.
  • Barion Gateway Components: The SDK provides UI elements (payment methods) and the merchant can place them on their checkout screen and process.
  • Barion Gateway Plugin: The whole UI is displayed by the Barion SDK and the process is controlled inside the SDK.

Barion Gateway Plugin

In case of Barion Gateway Plugin the Barion SDK handles all the heavy lifting and the full payment flow is controlled by it.

Payment flow

The participants in the process are:

  • Merchant: The entity that sells goods or provides services to purchase.
  • Payer: The customer who wants to buy said services or goods.
  • Merchant app: The mobile app of the merchant that is used for the payment
  • Barion SDK: The SDK that provides the inline functionality
  • Merchants' backend: The backend server of the merchant
  • Barion API: The Barion API

The payment process can be described in the following steps.

1. Payer clicks on checkout

The payer uses the merchant's mobile app to start the checkout.

2. Merchant app calls the merchant backend

This is necessary since only the backend can be trusted to communicate securely with the Barion API.

3. The merchant's backend calls the Barion API

The merchant's backend call the payment/start endpoint. In case there is already a Barion Smart Gateway integration in place, the merchant does not have to add any new information to the request.

4. Receives back a secret in the response

There is an additional property in the response, called ClientSecret. This is used to initiate the Barion inline SDK.

5. The merchant’s backend forwards the secret to the merchant’s mobile app

The merchant's backend needs to forward the ClientSecret to the merchant's mobile app.

6. Merchant's app initializes the Barion SDK

The merchant's mobile app initializes the Barion SDK. The detailed description of this step is written up in the Github library.

7. The Barion SDK displays the payment options

8. Customer inputs the card information or clicks on a wallet

9. Barion SDK forwards this to the Barion API

The Barion system processes the payment.

10. The Barion SDK calls back to the merchant's app code

This step is also described in the Github library.

11. The merchant's app receives the result of the payment

From the callback the app receives the result of the payment. It is up to the merchant whether they trust this or query the result from the merchant's backend. The most secure way is to let the backend query the payment state and forward that information to the mobile app.

12. Barion sends the instant payment notification request to the merchant's backend

The Barion backend notifies the merchant's backend via an IPN.

13. The merchant's backend request the state of the payment

The merchant's backend requests the state by calling the payment/state endpoint.

14. The payment state response contains the result of the process

This is the most secure way to decide whether to fulfill the order or not.

15. The merchant processes the order

Retrieved from "https://docs.barion.com/index.php?title=Mobile_Inline_Gateway&oldid=4647"