Mobile Inline Gateway

From Barion Documentation
Jump to navigation Jump to search

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