Mobile Inline Gateway: Difference between revisions

From Barion Documentation
Jump to navigation Jump to search
No edit summary
 
(3 intermediate revisions by 2 users not shown)
Line 9: Line 9:
This page describes the integration for the inline mobile gateway.  
This page describes the integration for the inline mobile gateway.  


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


* '''Barion Gateway Plugin''': The whole UI is displayed by the Barion SDK and the process is controlled inside the SDK.
* '''Barion Gateway Plugins''': This is the fastest method for an integration. The UI elements can be customized, but the whole payment flow is executed by the SDK and cannot be changed.
* '''Barion Gateway Components:''' The SDK provides UI elements (payment methods) and the merchant can place them on their checkout screen and process.
* '''Barion Gateway Components:''' The SDK provides blocks of UI elements (e.g. list of payment methods, bank card payment method, etc.) and the merchant can place them on their checkout screen and process.
* '''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 Elements''': The SDK provides every element separately, the merchant has the freedom to arrange them. This provides the highest amount of control.


Line 54: Line 54:
'''6. Merchant's app initializes the Barion SDK'''
'''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 [https://github.com/barion/barion-ios Github library].
The merchant's mobile app initializes the Barion SDK. The detailed description of this step is written up in the Github library ([https://github.com/barion/barion-ios iOS] & [https://github.com/barion/barion-android Android]) .


'''7. The Barion SDK displays the payment methods'''
'''7. The Barion SDK displays the payment methods'''
Line 67: Line 67:
'''10. The Barion SDK calls back to the merchant's app code'''
'''10. The Barion SDK calls back to the merchant's app code'''


This step is also described in the [https://github.com/barion/barion-ios Github library].
This step is also described in the Github library ([https://github.com/barion/barion-ios iOS] & [https://github.com/barion/barion-android Android]).


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


'''15. The merchant processes the order'''
'''15. The merchant processes the order'''
== '''PCI Compliance Requirement''' ==
To use the native SDK, merchants must complete the Payment Card Industry (PCI) Data Security Standard [https://www.pcisecuritystandards.org/document_library/?category=saqs#results Self-Assessment Questionnaire A] and submit it to us. This ensures that the integration meets the necessary security requirements for handling payment information
== '''Tokenisation for future payments''' ==
'''In addition to one-time native payments, you can now build a fully integrated payment flow that supports saving cards for future one-click, MIT, or recurring payments.'''
'''Typical flow:'''
* The user enters their card details within the app using the '''customized SDK'''.
* You securely save the card via '''[[Token payment 3D Secure|tokenization]]'''.
* On future purchases, the card can be charged:
** '''Directly in-app''' for a '''one-click payment''', or
** Automatically via a '''MIT or recurring transaction''', with '''no user interaction required'''.

Latest revision as of 11:33, 13 May 2025

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 inline version into a mobile app:

  • Barion Gateway Plugins: This is the fastest method for an integration. The UI elements can be customized, but the whole payment flow is executed by the SDK and cannot be changed.
  • Barion Gateway Components: The SDK provides blocks of UI elements (e.g. list of payment methods, bank card payment method, etc.) and the merchant can place them on their checkout screen and process.
  • 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 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 (iOS & Android) .

7. The Barion SDK displays the payment methods

iOS plugin integration

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 (iOS & Android).

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

PCI Compliance Requirement

To use the native SDK, merchants must complete the Payment Card Industry (PCI) Data Security Standard Self-Assessment Questionnaire A and submit it to us. This ensures that the integration meets the necessary security requirements for handling payment information

Tokenisation for future payments

In addition to one-time native payments, you can now build a fully integrated payment flow that supports saving cards for future one-click, MIT, or recurring payments. Typical flow:

  • The user enters their card details within the app using the customized SDK.
  • You securely save the card via tokenization.
  • On future purchases, the card can be charged:
    • Directly in-app for a one-click payment, or
    • Automatically via a MIT or recurring transaction, with no user interaction required.