Steps to Integrate
Step 1: SDK Integration
To integrate PayU CheckoutPro with Flutter SDK:
- Step 1: Include the SDK in your app project
- Step 2: Initialize PayU Checkout Pro Flutter object
- Step 3: Setup PayU Checkout Pro protocol
- Step 4: Setup payment hashes
- Step 5: Build the Payment Parameters
- Step 6: Initiate payment
- Step 7: Configure AndroidManifest.xml
For IOS, refer to iOS Specific Integration and check Distributing Your App (App Store/ Ad-hoc) to deploy your application. For more information, refer to Explore iOS SDKs
Step 1: Include the SDK in your app project
The CheckoutPro SDK for Flutter is offered through Flutter pub.dev
- To add the PayU Checkout Pro Flutter plugin add the following dependency in your app:
$ flutter pub add payu_checkoutpro_flutter
import 'package:payu_checkoutpro_flutter/payu_checkoutpro_flutter.dart';
import 'package:payu_checkoutpro_flutter/PayUConstantKeys.dart';
- For iOS: Install the pod using the following command inside
ios
folder:$ pod install
Step2: Initialize PayU Checkout Pro Flutter object
- Create PayUCheckout Pro Flutter instance.
late PayUCheckoutProFlutter \_checkoutPro;
Initialize the PayUCheckoutProFlutter object using the current object.
@override
void initState()
{
_checkoutPro = PayUCheckoutProFlutter(this);
}
Note: Make sure your minimum deployment target is iOS 11.
Step3: Setup PayU Checkout Pro protocol
- Implement Checkout Pro protocol methods to get hash generation callback and transaction status callback from Checkout Pro SDK:
class MyClass extends SupeprClass implements PayUCheckoutProProtocol
- Implement the following methods in your class to get a callback from the SDK.
@override
generateHash(Map response) {
// Pass response param to your backend server
// Backend will generate the hash which you need to pass to SDK
// hashResponse: is the response which you get from your server
Map hashResponse = {};
_checkoutPro.hashGenerated(hash: hashResponse);
}
@override
onPaymentSuccess(dynamic response) {
//Handle Success response
}
@override
onPaymentFailure(dynamic response) {
//Handle Failure response
}
@override
onPaymentCancel(Map? response) {
//Handle Payment cancel response
}
@override
onError(Map? response) {
//Handle on error response
}
Step4: Setup payment hashes
This step describes how to pass the static and dynamic hashes. For detailed information, refer to Generate Hash.
Pass static hashes
To pass static hashes during integration, use the following code snippet:
var payUPaymentParams = {
“key”: "Merchant key",
...
...
...
“additionalParam”: {
“payment_related_details_for_mobile_sdk”: "payment_related_details_for_mobile_sdk hash",
“vas_for_mobile_sdk”: "vas_for_mobile_sdk hash",
“payment": "Payment Hash"
}
}
Pass dynamic hashes
To pass dynamic hashes, the merchant will receive a call on the generateHash method. In the method parameter, you will receive a dictionary or hashMap, then extract the value of hashString from that. Pass that value to the server to append the Salt at the end and generate the sha512 hash over it. The server gives that hash back to your app, and the app will pass that hash to PayU through a callback mechanism.
To pass the dynamic hashes during integration, use the following code snippet:
var hashName = response[PayUHashConstantsKeys.hashName];
var hashStringWithoutSalt = response[PayUHashConstantsKeys.hashString];
var hashType = response[PayUHashConstantsKeys.hashType];
var postSalt = response[PayUHashConstantsKeys.postSalt];
var hash = <Get Hash Backend with < hashString, merchantSalt , postSalt >
Call hashGenerated with HashResponse< hashName , Hash>
_checkoutPro.hashGenerated(hash: hashResponse);
We need the following type of hashes to be generated at your backend: V1 Hash, V2 Hashes, MCP Lookup, and Post Salt Hash.
Use the following code snippet to generate the required hashes:
if (hashType == “V2”) {
hash = <Get HmacSHA256Hash with (hashStringWithoutSalt, merchantSalt)>
} else if (hashName == “mcpLookup”) {
hash = <Get HmacSHA1Hash with (hashStringWithoutSalt, merchantSecretKey)>
} else if (postSalt != null)
{
//Add salt first then add post salt to create final hash string.
hash = <Get SHA512Hash with <hashStringWithoutSalt + merchantSalt + <postSalt)>>
}
else
{
hash = <Get SHA512Hash from Backend with <hashStringWithoutSalt > + <merchantSalt>>
}
Remember:
- Always generate the hashes on your server. Do not generate the hashes locally in your app, as it will compromise the security of the transactions.
- The CheckoutPro SDK uses hashes to ensure the security of the transaction and prevent any unauthorized intrusion or modification. The CheckoutPro SDK requires two types of hashes. For more information on the two types of hashes, refer to Generate Hash for CheckoutPro SDK.
Step 5: Build the payment parameters
To initiate the payment, your app needs to send transactional information to the Checkout Pro SDK.
Payment parameters
Parameter | Description |
---|---|
Key
|
|
transactionId
|
|
Amount
|
|
productInfo
|
|
firstName
|
|
Email
|
|
Phone
|
|
ios_surl
|
|
ios_furl mandatory |
|
android_surl
|
|
android_furl
|
|
Environment
|
|
User Credential
|
|
For details on Standing Instructions parameters, refer to PayU Standing Instruction Parameters.
Additional Parameters (Optional)
The additional parameters that are optional that can be passed for the SDK are udf parameters, static hashes, and other parameters. For more details on Static Hash generation and passing them, refer to Generate Hash. The following is a list of parameters that can be passed in additional parameters:
Parameter | Description |
---|---|
PayUCheckoutProConstants.CP_UDF1 | String User defined field, Merchant can store their customer id, etc. |
PayUCheckoutProConstants.CP_UDF2 | String User defined field, Merchant can store their customer id, etc. |
PayUCheckoutProConstants.CP_UDF3 | String User defined field, Merchant can store their customer id, etc. |
PayUCheckoutProConstants.CP_UDF4 | String User defined field, Merchant can store their customer id, etc. |
PayUCheckoutProConstants.CP_UDF5 | String User defined field, Merchant can store their customer id, etc. |
Static hashes | String The static hashes is specified in this parameter. For more information, refer to Hash Generation section. |
PayUCheckoutProConstants.SODEX_OSOURC_EID | String Sodexo Source ID, Merchant can store it from the third field of PayU response. |
PaymentParamConstant.walletUrn | String Pass this parameter if closed loop wallet (clw) payment mode is enabled for your account. |
The payment parameters and additional parameters can be passed using the following code snippet:
class PayUTestCredentials {
static const merchantKey = "<ADD YOUR MERCHANT KEY>";
static const iosSurl = "<ADD YOUR iOS SURL>";
static const iosFurl = "<ADD YOUR iOS FURL>";
static const androidSurl = "<ADD YOUR ANDROID SURL>";
static const androidFurl = "<ADD YOUR ANDROID FURL>";
static const merchantAccessKey = "<ADD YOUR MERCHNAT ACCESS KEY>"; // Optional
static const sodexoSourceId = "<ADD YOUR SODEXO SOURCE ID>"; // Optional
}
var siParams = {
PayUSIParamsKeys.isFreeTrial: true,
PayUSIParamsKeys.billingAmount: '1', //REQUIRED
PayUSIParamsKeys.billingInterval: '1', //REQUIRED
PayUSIParamsKeys.paymentStartDate: '2023-04-20', //REQUIRED
PayUSIParamsKeys.paymentEndDate: '2023-04-30', //REQUIRED
PayUSIParamsKeys.billingCycle:
'daily', //REQUIRED //Can be any of 'daily','weekly','yearly','adhoc','once','monthly'
PayUSIParamsKeys.remarks: 'Test SI transaction',
PayUSIParamsKeys.billingCurrency: 'INR',
PayUSIParamsKeys.billingLimit: 'ON', //ON, BEFORE, AFTER
PayUSIParamsKeys.billingRule: 'MAX', //MAX, EXACT
};
var additionalParam = {
PayUAdditionalParamKeys.udf1: "udf1",
PayUAdditionalParamKeys.udf2: "udf2",
PayUAdditionalParamKeys.udf3: "udf3",
PayUAdditionalParamKeys.udf4: "udf4",
PayUAdditionalParamKeys.udf5: "udf5",
PayUAdditionalParamKeys.merchantAccessKey:
PayUTestCredentials.merchantAccessKey,
PayUAdditionalParamKeys.sourceId: PayUTestCredentials.sodexoSourceId,
};
var spitPaymentDetails = [
{
"type": "absolute",
"splitInfo": {
"imAJ7I": {
"aggregatorSubTxnId": "Testchild123",
"aggregatorSubAmt": "5"
},
"qOoYIv": {
"aggregatorSubTxnId": "Testchild098",
"aggregatorSubAmt": "5"
},
}
}
];
var payUPaymentParams = {
PayUPaymentParamKey.key: ", //REQUIRED
PayUPaymentParamKey.amount: "1", //REQUIRED
PayUPaymentParamKey.productInfo: "Info", //REQUIRED
PayUPaymentParamKey.firstName: "Abc", //REQUIRED
PayUPaymentParamKey.email: "[email protected]", //REQUIRED
PayUPaymentParamKey.phone: "9999999999", //REQUIRED
PayUPaymentParamKey.ios_surl: PayUTestCredentials.iosSurl, //REQUIRED
PayUPaymentParamKey.ios_furl: PayUTestCredentials.iosFurl, //REQUIRED
PayUPaymentParamKey.android_surl:
PayUTestCredentials.androidSurl, //REQUIRED
PayUPaymentParamKey.android_furl:
PayUTestCredentials.androidFurl, //REQUIRED
PayUPaymentParamKey.environment: "0", //0 => Production 1 => Test
PayUPaymentParamKey.userCredential:
null, //Pass user credential to fetch saved cards => A:B - OPTIONAL
PayUPaymentParamKey.transactionId: "<ADD TRANSACTION ID>", //REQUIRED
PayUPaymentParamKey.additionalParam: additionalParam, // OPTIONAL
PayUPaymentParamKey.enableNativeOTP: true, // OPTIONAL
PayUPaymentParamKey.userToken:
"<Pass a unique token to fetch offers>", // OPTIONAL
PayUPaymentParamKey.payUSIParams: siParams, // OPTIONAL
PayUPaymentParamKey.splitPaymentDetails: spitPaymentDetails, // OPTIONAL
};
Step 6: Initiate payment
Initialize and launch the Checkout Pro SDK by calling the following code snippet:
_checkoutPro.openCheckoutScreen(
payUPaymentParams: < payUPaymentParams >,
payUCheckoutProConfig: <payUConfigParams>,
);
Step 7: Configure AndroidManifest.xml
To automatically fill OTP on bank pages, SDK requires the RECEIVE_SMS permission, configure the AndroidManifest.xml by adding receive sms permission as shown below.
<uses-permission android:name="android.permission.RECEIVE_SMS" />
IOS specific integration
Flutter SDK offers a few optional customizations for IOS as mentioned below:
Customization (Optional)
- For UPI Intent
Currently, PayU supports only PhonePe and GooglePay through Intent. Add the query schemes in the info.plist.
<key>LSApplicationQueriesSchemes</key>
<array>
<string>phonepe</string>
<string>paytm</string>
<string>tez</string>
<string>credpay</string>
<string>bhim</string.
</array>
- Card Scanner, Camera Permission
<key>NSCameraUsageDescription</key>
<string>Please mention the description to give user info</string>
Distributing your app (App Store / Ad-hoc)
What you get by default is a fat framework that allows you to test your app seamlessly on the device and simulator. But before archiving your app, you need to remove simulator slices from the framework. For detailed information on archiving your app with PayU ChekoutPro, refer to Releasing Apple App Store.
Step 2. Test the Integration and Go-live
Test the integration
After the integration is complete, you must test the integration before you go live and start collecting payment. You can start accepting actual payments from your customers once the test is successful.
CalloutThe UPI in-app and UPI intent flow is not available in the Test mode.
Testing checklistThings to remember while testing an integration:
- To test the integration make sure that you are making a transaction call to the test endpoint.
- Use your test key and salt for the transaction requests. See Genearate Test Key and Salt.
- Set the value of the
environment
parameters to1
.
Test cards only for Test environmentThese test cards, UPI, and Wallet credentials must only be used in the sandbox environment. Using these test cards in production environment may cause validation error.
You can make test payments using one of the payment methods configured at the Checkout.
Test credentials for supported payment methods
Following are the payment methods supported in PayU Test mode.
Test Credential for Card
Card Number | Expiry | CVV | OTP |
---|---|---|---|
5123456789012346 | 05/25 | 123 | 123456 |
Test credentials for Net Banking
Use the following credentials to test the Net Banking integration:
- user name: payu
- password: payu
- OTP: 123456
Test VPA for UPI
You can use either of the following VPAs to test your UPI-related integration:
For Testing the UPI Collect flow, Please follow the below steps:-
- Once you enter the VPA click on the verify button and proceed to pay.
- In NPCI page timer will start, Don't "CLICK" on click text. Please wait on the NPCI page.
- The below link opens in the browser Paste the transaction ID at the end of the URL then click on the success/failure simulator page. After that, your app will redirect to your app with the transaction response.
https://pgsim01.payu.in/UPI-test-transaction/confirm/<Txn_id>
For Android
You can add the below metadata under the application tag in the manifest file to test the UPI Collect flow on test env:-
Ensure to remove the code from the manifest file before going live.
<application>
<meta-data android:name="payu_debug_mode_enabled" android:value="true" /> // set the value to false for production environment
<meta-data android:name="payu_web_service_url" android:value="https://test.payu.in" /> //Comment in case of Production-->
<meta-data android:name="payu_post_url" android:value="https://test.payu.in"/> //Comment in case of Production-->
</application>
Test cards for EMI
You can use the following Debit and Credit cards to test EMI integration.
Bank/Card Type | Card Details |
---|---|
Kotak DC EMI |
|
AXIS DC EMI |
|
HDFC CC EMI |
|
ICICI CC EMI |
|
Test Wallets
You can use the following wallets and their corresponding credentials to test wallet integration.
Wallet | Mobile Number | OTP |
---|---|---|
PayTM | 7777777777 | 888888 |
PhonePe | Use the Phonepe Pre-Prod app for testing purposes as described in the following PhonePe doc. location: [https://developer.phonepe.com/v1/docs/setting-up-test-account](https://developer.phonepe.com/v1/docs/setting-up-test-account) Download the app and register your mobile number and follow the instructions as described in the above PhonePe docs. | NA |
AmazonPay | You can test using your original Amazon account details. |
Go-live Checklist
Ensure these steps before you deploy the integration in a live environment.
Collect Live Payments
After testing the integration end-to-end, once you are confident that the integration is working as expected, you can switch to live mode to start accepting payments from your customers.
Watch Out!Ensure that you are using the production merchant key and salt generated in the live mode.
Checklist 2: Configure environment() parameter
Set the value of the environment()
to 0
in the payment integration code. This enables the integration to accept live payments.
Checklist 4:- Remove/comment meta -data code from manifest file :-
For Android
You must be comment/remove the below metadata code from the manifest file to use the UPI Collect flow on Production env:-
<application>
<meta-data android:name="payu_debug_mode_enabled" android:value="true" /> // set the value to false for production environment
<meta-data android:name="payu_web_service_url" android:value="https://test.payu.in" /> //Comment in case of Production-->
<meta-data android:name="payu_post_url" android:value="https://test.payu.in"/> //Comment in case of Production-->
</appliction>
Checklist 5: Configure verify payment method
Configure the Verify payment method to fetch the payment status. We strongly recommend that you use this as a back up method to handle scenarios where the payment callback is failed due to technical error.
Checklist 6: Configure Webhook
We recommend that you configure Webhook to receive payment responses on your server. For more information, refer to Webhooks.
Updated about 3 hours ago