Host Foloosi on your Website
This online integration method allows for the use of Foloosi advanced technological integrations of real-time processing of QR code payments online. It is backed by a secure PCI DSS compliant payment gateway provider, use of which does not require you to have your own PCI compliance as card details are held only within the payment gateway.
This integration method uses HTML messages to pass information between your site and the payment gateway. It is the simplest and easiest method of integration and will work on just about any platform.
Once you have registered your business with Foloosi and have completed the steps required to receive your login credentials, then you are ready to accept payments online.
To register your business with Foloosi please proceed to: https://www.foloosi.com/users/business-signup
Before start this integration check your site enabled https with proper SSL certificate.
- Version 2 is better than Version 1, but how exactly is it better? Let me explain...
- In version 2, you can initialize the variable named "fp1" to call the function named "new Foloosipay(options)", after that call "fp1.open()" to open the widget and also call "fp1.close()" to close the widget. And also we improved some UI related parts.
- And also we improved the Success and Error Handlers in both Version 1 and Version 2.
Note : Both are supported versions, so upgrade to version 2 is not necessary. If you want to upgrade you can.
Step 1
Just copy these HTML snippets and paste it before closing of <body> tag.
<script type="text/javascript">
var options = {
"reference_token" : "REFERENCE_TOKEN", //which is get from step2
"merchant_key" : "YOUR_MERCHANT_KEY"
}
var fp1 = new Foloosipay(options);
</script>
<script type="text/javascript" src="https://www.foloosi.com/js/foloosipay.v2.js"></script>
Step 2(Initialize Payment Setup)
Post the following data's in below API link to requesting token for accessing the payment gateway.
POST API LINK :
https://foloosi.com/api/v1/api/initialize-setup
HEADERS:
merchant_key : YOUR_MERCHANT_KEY
BODY:
transaction_amount : YOUR_TRANSACTION_AMOUNT
currency : YOUR_CURRENCY_CODE
customer_name : OPTIONAL /*note : auto render in payment popup*/
customer_email : OPTIONAL /*note : auto render in payment popup*/
customer_mobile : OPTIONAL /*note : auto render in payment popup*/
customer_address : OPTIONAL /*note : minimize form fields in card detail page*/
customer_city : OPTIONAL /*note : minimize form fields in card detail page*/
{
"message": "Application setup successfully",
"data": {
"reference_token":
"U0sjdGVzdF8kMnkkMTAkM21LRi0xZGliVDhldTV4NHlZSm9tZXZobnZxWTNEVnZmay1MdHNndTNFenNBTDU0clhWYkccVE4jRkxTQVBJNWM3Njk2ZDkwOWIzNxxSVCMkMnkkMTAkQXZ4ay9wdjlpTFlYLzRSZ2FjSkxpZWhHb2o0U0wvTFpZNXAyVjRGOVFycWNQZ2lHQ3VEZ08="
}
}
Step 3
Just paste the following code to Open and Close the Payment Widget.
For Open a Widget, refer the code below.
fp1.open();
For Close a Widget, refer the code below.
fp1.close();
Step 4
When you click place order button our popup will be loaded so you can use below test card credentials to complete the order.
Use these details:
Card Number 4111 1111 1111 1111
Expiry 05/20
CVV 123
Card Number 4000 0000 0000 0002
Expiry 12/24
CVV 123
Step 5(Optional)
For Transaction List details, you can use the below Get request to get the transaction based on your merchant key.
GET API LINK:
https://foloosi.com/api/v1/api/transaction-list
HEADERS:
secret_key : YOUR_SECRET_KEY
Step 6(Optional)
For Transaction Details, you can use the below Get request to get the transaction detail.
GET API LINK:
http://foloosi.com/api/v1/api/transaction-detail/YOUR_TRANSACTION_ID
HEADERS:
secret_key : YOUR_SECRET_KEY
Step 7(Create QR code)
Post the following data's in below API link to requesting QR code.This option for foloosi customer can do scan and pay transaction
POST API LINK :
https://foloosi.com/api/v1/api/generate-qr-api
HEADERS:
secret_key : YOUR_SECRET_KEY
BODY:
amount : YOUR_TRANSACTION_AMOUNT
description : DESCRIPTION
{
"message": "QR created successfully",
"data": {
"payment_qr_data":
"UEgjODA1NjIyMTUyOBxBTSM1HE9GRiMcUFJPTU8jHERFUyN0ZXN0IGZyb20gYXBpHEFWX3YxOkZSTV9NHFBLIyQyeSQxMCRHNUU3VGpsalVyNE4zd3htOXRqeWEubjY2amU5R3BHLlFYM1QwMk5KRDdsMVM5dWFLNE5XcRxJUCMcTUFDIxxTVUIjMBxDT0RFIw==",
"payment_qr_url":
"https://api.qrserver.com/v1/create-qr-code/?size=400x400&data=UEgjODA1NjIyMTUyOBxBTSM1HE9GRiMcUFJPTU8jHERFUyN0ZXN0IGZyb20gYXBpHEFWX3YxOkZSTV9NHFBLIyQyeSQxMCRHNUU3VGpsalVyNE4zd3htOXRqeWEubjY2amU5R3BHLlFYM1QwMk5KRDdsMVM5dWFLNE5XcRxJUCMcTUFDIxxTVUIjMBxDT0RFIw==<@>scanpay"
}
}
Step 8(For Success and Error Handlers)
For Success and Error Handlers, you can use the below handler function to get the payment response.
foloosiHandler(response, function (e) {
if(e.data.status == 'success'){
//responde success code
//console.log(e.data.status);
//console.log(e.data.data.transaction_no);
}
if(e.data.status == 'error'){
//responde success code
//console.log(e.data.status);
//console.log(e.data.data.payment_status);
}
if(e.data.status == 'closed'){
//Payment Popup Closed
//console.log(e.data);
}
});


