SDK Growin

This SDK comes to create a new, modular and designed payment process.
Our purpose is to give you an easy solution for online payments without having to redirect or open iframes that may not provide the best user experience and limit your overall flexibility.

📘

NOTE:

1. This SDK is designed to work in conjunction with the server-side ‘createPaymentProcess’ method that should be configured to work with a pageCode that is set to SDK wallet mode.
2. The payment is valid for 10 minutes from the moment the createPaymentProcess call was made
   That's why we recommend sending the call only after opening a payment form and not at an earlier stage of the process

Explanation of assimilation :

1. To use the SDK, you first need to load the SDK into your webpage in the following way:

   HTML

   <script>
      (function () {
        var s = document.createElement('script');
        s.type = 'text/javascript';
        s.async = true;
        s.src = 'https://cdn.meshulam.co.il/sdk/gs.min.js';
        s.onload = configureGrowSdk; //replace with your callback function
        var x = document.getElementsByTagName('script')[0];
        x.parentNode.insertBefore(s, x);
      })();
    </script>
   

   
   

2. The scripts ‘onload’ event should point to a function that configures the wallet:

   JavaScript

   function configureGrowSdk() {
   	let config = {
   		environment: "DEV",
   		version: 1,
   		events: {
   			onSuccess: (response) => {},
   			onFailure: (response) => {},
   			onError: (response) => {},
   			onTimeout: (response) => {},
   			onWalletChange: (state) => {},
   			onPaymentStart: (response) => {},
   			onPaymentCancel: (response) => {},
          }
      };
   	growPayment.init(config);
   }
   
   

   
   

Name	Type	Required	Options	Description	Response Examples
environment	String	required	“PRODUCTION”, “DEV”
version	String	required	Current stable version is 1	Target the preferred base version
events	Object	optional	onSuccess: Gets triggered on payment success, receives a response with information about the payment (confirmation number, payment method, and more). onFailure: Gets triggered on payment failure, receives a message describing what caused the failure. onError: Gets triggered on payment error, receives a message describing what caused the error. onWalletChange: Gets triggered on wallet state change, receives the current wallet state - open/closed. Note: useful for changing your loaders state. onPaymentStart: Gets triggered when a payment process starts, receives a response with the triggered paymentType and paymentName. onPaymentCancel: Gets triggered when a payment process is cancelled, receives a response with the triggered paymentType and paymentName.	Attach callback functions to handle each event type	onSuccess: { "status": 1, "data": { "payment_sum": "1", "full_name": "example example", "payment_method": "credit", "number_of_payments": 1, "confirmation_number": "12345678" } } onFailure: { "status": 0, "message": "תשלום נכשל" } onError: { "status": 0, "message": "לא ניתן לבצע עסקת תשלומים על כרטיס מסוג זה" } { "status": 0, "message": "התשלום סורב" } onWalletChange: open Close onPaymentStart: { "paymentType": 15, "paymentName": "bank_transfer" } onPaymentCancel: { "paymentType": 15, "paymentName": "bank_transfer" }

onSuccess payment method -

payment method	Response Examples
bit	{ "status": 1, "data": { "payment_sum": "1", "full_name": "example example", "payment_method": "bit", "number_of_payments": 1, "confirmation_number": "12345678" }
Google Pay	{ "status": 1, "data": { "payment_sum": "1", "full_name": "example example", "payment_method": "google", "number_of_payments": 1, "confirmation_number": "12345678" }
Apple Pay	"status": 1, "data": { "payment_sum": "1", "full_name": "example example", "payment_method": "apple", "number_of_payments": 1, "confirmation_number": "12345678" }
Credit Card	{ "status": 1, "data": { "payment_sum": "1", "full_name": "example example", "payment_method": "credit", "number_of_payments": 1, "confirmation_number": "12345678" }
Bank Trensfer	{ "status": 1, "data": { "payment_sum": "1", "full_name": "example example", "payment_method": "bank_transfer", "number_of_payments": 1, "confirmation_number": "12345678" }

Note: The init method can also be used to update the entire SDK configuration. However, this will reset all previously registered events and replace them with the new ones provided.
If you only need to update specific events, use the updateEvents method instead. This will preserve existing events and only override the ones you specify.

3. Once the payment process is triggered by the user (e.g user clicks checkout button) you need to run the server side ‘createPaymentProcess’ method which will return an authCode which you can use to open the wallet with the SDK’s ‘renderPaymentOptions’ method.

An example of how to initiate the method:

JavaScript

// response - the response you received from 'createPaymentProcess'
if (response.status && growPayment) {
   growPayment.renderPaymentOptions(response.authCode);
}

Once the wallet is opened, use the callback events to handle the rest of the flow.

Important: The wallet has a limited validity time which starts once you call the backend ‘createPaymentProcess’ api method. Therefore, it’s best to call the ‘createPaymentProcess’ backend api method right before you need to render the wallet to make sure users do not experience a wallet timeout during the payment process.

Note: Once renderPaymentOptions is called there will be a period in which the SDK must make an API call to Grow backend before the wallet is visually rendered. It is recommended to use the onWalletChange event to know when the wallet is about to open in order to handle your loader state.

Here is sample of response from the server:

JSON

{
  "status": 1,
  "err": "",
  "data": {
    "processId": 413133,
    "processToken": "92ab69240c00aa073eb818dc646e2c32",
    "authCode": "beb1064aa495042a69c9c5e2dc384180%NDEzMTM0"
  }
}

📘

Note

• The wallet will be invalid after 4 min.
• All scripts must be implemented in the frontend.