Custom UI- iOS – PayU Documentation

Custom UI iOS

Pre-requisites

1. A mobile app to accept payments.

Steps Involved

 

  1. Import the .a file as a module.
  2. Collect all common parameters to send it to the SDK.
  3. Make an API call.
  4. Collect additional parameters depending on the mode chosen by user.
  5. Create payment param object and submit it to web view.
  6. Accept payment response as provided by SDK.

Importing the .a file as a module

 

You need to follow the below mentioned steps to import the .a file.

Collecting all common parameters

 

Following are some common  parameters, common to all the payment modes,  to get a transaction initiated

 

Parameters Description Data type Character Limit Example
key Unique key provided by Payu varchar  20 characters gtKFFx
txnid Transaction id/ reference id generated at your end Varchar 25 characters gabv45312vm
amount Amount payable by customer Number, Float type 2 digits after decimal 101.00
productinfo Small description of product, a string defining your product Varchar 100 characters Jacket
firstname First name of customer Varchar 60 characters Umang
email                          Email id of customer Varchar 50 umangarya336@gmail.com
phone Phone number of customer Varchar 50 (numeric) 09876543210
surl Redirect URL (your site) in case of a successful transaction  HTTP url  mediumtext https://payu.herokuapp.com/success
furl Redirect URL (your site) in case of a failed transaction  HTTP url  mediumtext https://payu.herokuapp.com/failure
hash Security parameter to avoid tampering  SHA512  varchar(256)

 

How to generate Hash?

 

Hash is a security parameter to avoid tampering. You have to  calculate it from  your server and post it to PayU server for each transaction and for each API call.

Sample code to generate hash at app’s end:

 

For API, you need to calculate the hash in following manner:

Make an API call

 

You will have to make an API call to fetch all the available payment options for you. To call payment_related_details_for_mobile_sdk API you need to create an object of class {PayUWebServiceResponse} and call the method {getPayUPaymentRelatedDetailForMobileSDK:}, you will get the result in completion handler of the method. If there is any error in the parameters passed by merchant then it will give the error in errorMessage string else you will get the parsed object.

POST

In order to retrieve all the payment options, you need to make a server to server call on the following URL with certain parameters:

 

Environment URL
Test https://test.payu.in/merchant/postservice.php?form=1
Live https://info.payu.in/merchant/postservice.php?form=1

Parameters:

Parameter Description Sample value
key Your key provided by payu gtKFFx
command Name of web service call payment_related_details_for_mobile_sdk
hash Security parameter e54de882e2b14c13424c91a4855fea2dc9b2a3a9525531408beec97564dd336460e22d72770ba37a5fcb6bad76d042582e87cc26b34741b6b6747e6b5b71b2cc
user_credentials Identification parameter of customer gtKFFx:payutest@payu.in

You would need to send all the parameters in the following mentioned format

Make Payment

 

To make a payment first we need to get request object and to get request object just create an object of class PayUCreateRequest as below:

After a customer chooses a mode of payment among all the payment options returned by PayU. here are the scenarios

 If Credit Card/ Debit Card is chosen as the mode of payment

 

Along with the other chosen parameters,following additional parameters are required to be sent to payu:

 

Parameter Description Data type Character limit Example
ccnum Credit/ debit card number as entered by customer for transaction string  20  CC
ccname Name on card- as entered by customer string  20  5123456789012346
ccvv Cvv number of the card- as entered by the customer string  4  123
ccexpmon Card’s expiry month- as entered by customer  string 2 digits 06
ccexpyr Card’s expiry year- as entered by customer  string 4 digits 2018

Lines of code that should be appended in the main code:

Sample form (complete) for CC/DC flow will be look like:

If Net Banking is chosen as the mode of payment

 

Along with the other chosen parameters, following additional parameters are required to be sent to payu:

Parameter Description Data type Character limit Example
bankCode Bank code of selected Bank (details recieved form API response)  string  8 ICIB

 

Lines of code that should be appended in the main code:

Sample form (complete) for NB flow will be look like this:

If cash card is chosen as the mode of payment

Along with the other chosen parameters, following additional parameters are required to be sent to payu:

 

Parameter Description Data type Character limit Example
bankCode Bank code of selected Bank (details recieved form API response)  string  8 ICIB

Lines of code that should be appended in the main code

Sample form (complete) for CashCard flow will be look like this

If EMI is chosen as the mode of payment

 

Along with the other chosen parameters, following additional parameters are required to be sent to PayU:

 

Parameter Description Data type Character limit Example
bankCode Bank code of selected Bank (details recieved form API response)  string  8 EMI03
ccnum Credit/ debit card number as entered by customer for transaction  string  20   5123456789012346
ccname Name on card- as entered by customer  string  20  ABC XYZ
ccvv Cvv number of the card- as entered by the customer  string 4 digits  123
ccexpmon Card’s expiry month- as entered by customer  string 2 digits 06
ccexpyr Card’s expiry year- as entered by customer  string 4 digits 2018

Lines of code that should be appended in the main code

Sample form (complete) for EMI flow will be look like this

If PayUmoney is chosen as the mode of payment

 

For this payment option you don’t need to send us any more parameters, but you will need to append some lines of code in the main code.

Creating a web

In each of these transactions no matter what has been chosen as the mode of payment, after the “Pay Now” button has been clicked, customer has to be directed to the bank’s page. In order to do that you would need to create a viewController and add a webview.

Code for creating webview (complusory code, no changes required):

Response

 

After the transaction is done, depending on the status of transaction, the customer would be redirected to surl/furl and PayU response will come under PayUSuccessResponse: or PayUFailureResponse: method.

From this method you can redirect to success or failure page of your sample app.

Still have questions?

Our team will be more than happy to help you out. You can reach out to them at mobile-integration@payu.in