---
page_title: 2. Initialize SDK
product: Hypercheckout
platform: Cordova
page_source: https://juspay.io/in/docs/hyper-checkout/cordova/base-sdk-integration/initiating-sdk
llms_txt: https://juspay.io/in/docs/llms.txt
product_llms_txt: https://juspay.io/in/docs/hyper-checkout/llms.txt
---


# 2. Initiating the SDK



To initialise the SDK, client needs to call the `initiate` SDK function. The initiate function call boots up the Hypercheckout SDK and makes it ready for all other operations

Follow the below steps to make an initiate SDK call


### Step 2.1. Create an instance of HyperServices


The Hypercheckout SDK exposes the `HyperSDKPlugin` object. This object can be accessed via `cordova.plugins.HyperSDKPlugin`

> **Warning**
> The HyperSDKPlugin instance should be created only after the [onDeviceReady event](https://cordova.apache.org/docs/en/4.0.0/cordova/events/events.deviceready.html) is fired.





#### Code Snippets: -

#### Javascript Code Snippet:

```javascript
hyperSDKRef = cordova.plugins.HyperSDKPlugin
```



### Step 2.2. Create Initiate payload


Initiate takes two parameters as input. One of the parameter is a JSON object referred as `InitiatePayload`. This payload contains certain key value pairs used by the SDK to perform a successful initiate

Refer to the following table for information about the description and sample payload.


### Payload
- **RequestId**:
  - Description: Unique uuid-v4 string
  - Value: $requestId
  - Tags: String, Mandatory
- **Service**:
  - Description: Value: in.juspay.hyperpay
  - Tags: String, Mandatory
- **Payload**:
  - Description: Parameters
  - Value:
    - **Action**:
      - Description: Value: initiate
      - Tags: String, Mandatory
    - **MerchantId**:
      - Description: Unique merchant id shared during onboarding
      - Tags: String, Mandatory
    - **ClientId**:
      - Description: Unique Client id shared during onboarding
      - Tags: String, Mandatory
    - **Environment**:
      - Description: Environment to be used for the session. Accepted value is “production” / “sandbox“.
      - Tags: String, Mandatory
  - Tags: JSON, Mandatory




#### Code Snippets: -

#### Javascript Code Snippet:

```javascript
//Function to generate random requestId 
function uuidv4() {
  return ([1e7]+-1e3+-4e3+-8e3+-1e11).replace(/[018]/g, c =>
    (c ^ crypto.getRandomValues(new Uint8Array(1))[0] & 15 >> c / 4).toString(16)
  );
}


function createInitiatePayload() {
    return {
        requestId: uuidv4(),
        service: "in.juspay.hyperpay",
        payload: {
            action: "initiate",
            merchantId: "<your_merchant_id>",
            clientId: "<your_client_id>",
            xRoutingId: "<x_routing_id>",
            environment: "production"
        }
    };
}
```



### Step 2.3. Create CallbackHandler


During its lifecycle, SDK emits multiple events to communicate about the transaction status. All of these events are received by the `hyperSDKCallback` function.

This callback handler is passed as the second argument to the initiate call.



#### Code Snippets: -

#### Javascript Code Snippet:

```javascript
var hyperSDKCallback = function (response) {
  try {
    const data = JSON.parse(resp);
    var event = data.event || '';

    switch (event) {
      case "show_loader": {
        // Show some loader here
        
      }
      break;
      case "hide_loader": {
        // Hide Loader

      }
      break;
      case "initiate_result": {
        // Get the payload
      
        let payload = parsedData["payload"];
        console.log("initiate result: ", parsedData)
      }
      break;

      //block:start:handle-process-result
      
      case "process_result": {
        // Get the payload
        
        let payload = parsedData["payload"];
        console.log("process result: ", parsedData)
        const error = data.error || false;
        const innerPayload = data.payload || {};
        const status = innerPayload.status || '';
        const pi = innerPayload.paymentInstrument || '';
        const pig = innerPayload.paymentInstrumentGroup || '';

        if (!error) {
            // txn success, status should be "charged"

            //block:start:check-order-status

            // call orderStatus once to verify (false positives)

            //block:end:check-order-status

            //block:start:display-payment-status

            //Naivgate to success page

            //block:end:display-payment-status
        } else {
            const errorCode = data.errorCode || '';
            const errorMessage = data.errorMessage || '';
            switch (status) {
                case 'backpressed':
                    // user back-pressed from PP without initiating any txn
                    break;
                case 'user_aborted':
                    // user initiated a txn and pressed back
                    // poll order status
                    // navigate back
                    break;
                case 'pending_vbv':
                case 'authorizing':
                    // txn in pending state
                    // poll order status until backend says fail or success
                    break;
                case 'authorization_failed':
                case 'authentication_failed':
                case 'api_failure':
                    // txn failed
                    // poll orderStatus to verify (false negatives)
                    //block:start:display-payment-status

                    //navigate to failure page

                    //block:end:display-payment-status
                    break;
                case 'new':
                    // order created but txn failed
                    // very rare for V2 (signature based)
                    // also failure
                    // poll order status
                    
                    //navigate to failure page
                    break;
                default:
                    // unknown status, this is also failure
                    // poll order status
                    
                    //navigate to failure page
            }
            // if txn was attempted, pi and pig would be non-empty
            // can be used to show in UI if you are into that
            // errorMessage can also be shown in UI
        }
        break;


      }
      break;

      //block:end:handle-process-result

      default:
        //Error handling

        let payload = parsedData;
        console.log("process result: ", payload)
      break;
    }
  } catch (error) {
    //Error handling
    console.log(error);
  }
}
```



### Step 2.4. Call initiate


The final step is to call the `Initiate`function.

The initiate method takes stringified `InitiatePayload` as argument. Use the functions created in the above steps to create the parameters

> **Warning**
> Initiate is a fire-and-forget call. For every HyperService instance you should **call initiate only once.** 





#### Code Snippets: -

#### Javascript Code Snippet:

```javascript
hyperSDKRef.initiate(JSON.stringify(createInitiatePayload()), hyperSDKCallback);
```


---

## Complete Code Reference

The following code files are referenced in the steps above:

### snippets.txt

```
//block:start:add-merchant-config-android

clientId = <clientId> shared by Juspay Team

//block:end:add-merchant-config-android


//block:start:create-hyper-services-instance

hyperSDKRef = cordova.plugins.HyperSDKPlugin

//block:end:create-hyper-services-instance


//block:start:create-initiate-payload

//Function to generate random requestId 
function uuidv4() {
  return ([1e7]+-1e3+-4e3+-8e3+-1e11).replace(/[018]/g, c =>
    (c ^ crypto.getRandomValues(new Uint8Array(1))[0] & 15 >> c / 4).toString(16)
  );
}


function createInitiatePayload() {
    return {
        requestId: uuidv4(),
        service: "in.juspay.hyperpay",
        payload: {
            action: "initiate",
            merchantId: "<your_merchant_id>",
            clientId: "<your_client_id>",
            xRoutingId: "<x_routing_id>",
            environment: "production"
        }
    };
}

//block:end:create-initiate-payload


//block:start:create-hyper-callback

var hyperSDKCallback = function (response) {
  try {
    const data = JSON.parse(resp);
    var event = data.event || '';

    switch (event) {
      case "show_loader": {
        // Show some loader here
        
      }
      break;
      case "hide_loader": {
        // Hide Loader

      }
      break;
      case "initiate_result": {
        // Get the payload
      
        let payload = parsedData["payload"];
        console.log("initiate result: ", parsedData)
      }
      break;

      //block:start:handle-process-result
      
      case "process_result": {
        // Get the payload
        
        let payload = parsedData["payload"];
        console.log("process result: ", parsedData)
        const error = data.error || false;
        const innerPayload = data.payload || {};
        const status = innerPayload.status || '';
        const pi = innerPayload.paymentInstrument || '';
        const pig = innerPayload.paymentInstrumentGroup || '';

        if (!error) {
            // txn success, status should be "charged"

            //block:start:check-order-status

            // call orderStatus once to verify (false positives)

            //block:end:check-order-status

            //block:start:display-payment-status

            //Naivgate to success page

            //block:end:display-payment-status
        } else {
            const errorCode = data.errorCode || '';
            const errorMessage = data.errorMessage || '';
            switch (status) {
                case 'backpressed':
                    // user back-pressed from PP without initiating any txn
                    break;
                case 'user_aborted':
                    // user initiated a txn and pressed back
                    // poll order status
                    // navigate back
                    break;
                case 'pending_vbv':
                case 'authorizing':
                    // txn in pending state
                    // poll order status until backend says fail or success
                    break;
                case 'authorization_failed':
                case 'authentication_failed':
                case 'api_failure':
                    // txn failed
                    // poll orderStatus to verify (false negatives)
                    //block:start:display-payment-status

                    //navigate to failure page

                    //block:end:display-payment-status
                    break;
                case 'new':
                    // order created but txn failed
                    // very rare for V2 (signature based)
                    // also failure
                    // poll order status
                    
                    //navigate to failure page
                    break;
                default:
                    // unknown status, this is also failure
                    // poll order status
                    
                    //navigate to failure page
            }
            // if txn was attempted, pi and pig would be non-empty
            // can be used to show in UI if you are into that
            // errorMessage can also be shown in UI
        }
        break;


      }
      break;

      //block:end:handle-process-result

      default:
        //Error handling

        let payload = parsedData;
        console.log("process result: ", payload)
      break;
    }
  } catch (error) {
    //Error handling
    console.log(error);
  }
}

//block:end:create-hyper-callback


//block:start:initiate-sdk

hyperSDKRef.initiate(JSON.stringify(createInitiatePayload()), hyperSDKCallback);

//block:end:initiate-sdk


// block:start:fetch-process-payload

    //Fetching the process payload from your server. Please refer to the session API section of docs to know more.
      async function getProcessSDKPayload() {
        var serverResponse = await fetch("https://your_server_endpoint/");
        return serverResponse;
      }
// block:end:fetch-process-payload


//block:start:process-sdk

var processPayload = await fetch getProcessSDKPayload();

hyperSDKRef.process(processPayload);

//block:end:process-sdk
```


---

## See Also

- [1. Getting SDK](https://juspay.io/in/docs/hyper-checkout/cordova/base-sdk-integration/getting-sdk)
- [3. Open Hypercheckout Screen](https://juspay.io/in/docs/hyper-checkout/cordova/base-sdk-integration/open-hypercheckout-screen)
