Mobile Inline Gateway: Difference between revisions

From Barion Documentation
Jump to navigation Jump to search
(Created page with "== Payment flow == frameless|800x800px === 1. Payer clicks on checkout === === 2. Merchant app calls the merchant backend === This is necessary since only the backends can be trusted to communicate securely. === 3. The merchant's backend calls the Barion API === The endpoint is the ususal payment/start. The merchant does not have to add any new information to the request. === 4. Receives back the <code>Client...")
 
Line 15: Line 15:


=== 6. Merchant's app intializes the Barion SDK ===
=== 6. Merchant's app intializes the Barion SDK ===
<syntaxhighlight lang="swift">
The merchant's app should request access to the camera. In the Barion SDK customers can scan their cards instead of typing them by hand. Add this key to your app's Info.plist:<syntaxhighlight lang="swift">
NSCameraUsageDescription
</syntaxhighlight>The simplest and fastest integration of the Barion SDK looks like this:<syntaxhighlight lang="swift" line="1">
import BarionSDK
import BarionSDK
...
...
let fastpayment = FastPayment(paymentClientSecret: paymentClientSecret, options: options)
let fastPayment = FastPayment(paymentClientSecret: paymentClientSecret)
fastpayment.present(from: self){ result in
fastPayment.present(from: self){ result in
   switch result {
   switch result {
     case let .success(paymentResult):
     case .success(let paymentResult):
       // TODO handle successful payment result and validate it on your backend
       // TODO handle successful payment result and validate it on your backend
       print("successful payment")
       print("successful payment")
     case let .failure(error):
     case .failure(let paymentError):
       // TODO handle the error
       // TODO handle the error
       print(error.errorCode)
       print(error.errorCode)

Revision as of 17:19, 15 January 2025

Payment flow

1. Payer clicks on checkout

2. Merchant app calls the merchant backend

This is necessary since only the backends can be trusted to communicate securely.

3. The merchant's backend calls the Barion API

The endpoint is the ususal payment/start. The merchant does not have to add any new information to the request.

4. Receives back the ClientSecret in the response

5. The merchant’s backend forwards the ClientSecret to the merchant’s mobile appp

6. Merchant's app intializes the Barion SDK

The merchant's app should request access to the camera. In the Barion SDK customers can scan their cards instead of typing them by hand. Add this key to your app's Info.plist:

NSCameraUsageDescription

The simplest and fastest integration of the Barion SDK looks like this:

import BarionSDK
...
let fastPayment = FastPayment(paymentClientSecret: paymentClientSecret)
fastPayment.present(from: self){ result in
  switch result {
    case .success(let paymentResult):
      // TODO handle successful payment result and validate it on your backend
      print("successful payment")
    case .failure(let paymentError):
      // TODO handle the error
      print(error.errorCode)
  }
}

The structure of the options parameter

{
  "merchantOwnedPaymentData": {
    "methods": [
      {
        "method": "card",
        "token": "sdafsfrRTYS556y7fdFG",
        "title": "My private card",
        "data": {
          "cardNr": "4578"
        }
      },
      {
        "method": "balance",
        "token": "sdafsfrRTYS556y7fdFG",
        "title": "My company card",
        "data": {
        }
      },
      {
        "token": "sdafsfrRTYS556y7fdFG",
      }
    ]
  },  
  "renderOptions": {
    "paymentMethodOrder": [
      "apple-pay",
      "card",
      "google-pay",
      "barion-wallet"
    ],  
    "gwOptions":{
      "arrowColor": "green",
    }
    "paymentMethodOptions": [
      {
        "method": "barion-wallet",
        "options": {
          "title": "Fizess Barionnal!",
          "background": "white"
        }
      },
      {
        "method": "apple-pay",
        "options": {
          "border": "black"
        }
      }
    ]
  }
}

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 backend and the payment is processed.

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

11. The Barion backend calls the IPN endpoint of the merchant

12. The merchant's app has to request the result from the merchant's backend

13. The result is communicated in the response

14. The result is displayed to the customer