November: Procrastination Month

    directpay-ipg-js

    1.0.31 • Public • Published

    directpay-ipg-js

    DirectPay Internet payment gateway javascript plugin.

    Installation

    NPM packages

    JS

    $ npm install directpay-ipg-js

    React

    $ npm install react-directpay-ipg

    Angular

    $ npm install ng-direct-pay-ipg

    VUE

    $ npm install vue-directpay-ipg

    CDN

    <script src="https://cdn.directpay.lk/v3/directpayipg.min.js"></script>

    WooCommerce

    Download Plugin

    Usage

    package

    const DirectpayIpg = require('directpay-ipg-js')
    const dp = new DirectpayIpg.Init({
      signature: signature,
      dataString: encoded_payload,
      stage: 'DEV',
      container: 'card_container'
    })
    
    //popup IPG
    dp.doInAppCheckout().then((data) => {
      console.log('client-res', JSON.stringify(data))
    }).catch((error) => {
      console.log('client-error', JSON.stringify(error))
    })
    
    //open IPG inside page component
    dp.doInContainerCheckout().then((data) => {
      console.log('client-res', JSON.stringify(data))
    }).catch((error) => {
      console.log('client-error', JSON.stringify(error))
    })

    CDN

     <div id="card_container"></div>
    
    <script src="https://cdn.directpay.lk/v3/directpayipg.min.js"></script>
    <script>
      var dp = new DirectPayIpg.Init({
        signature: signature,
        dataString: encoded_payload,
        stage: 'DEV',
        container: 'card_container'
      });
    
      //popup IPG
      dp.doInAppCheckout().then((data) => {
        console.log("client-res", JSON.stringify(data));
        alert(JSON.stringify(data))
      }).catch(error => {
        console.log("client-error", JSON.stringify(error));
        alert(JSON.stringify(error))
      });
    
      //open IPG inside page component
      dp.doInContainerCheckout().then((data) => {
        console.log("client-res", JSON.stringify(data));
        alert(JSON.stringify(data))
      }).catch(error => {
        console.log("client-error", JSON.stringify(error));
        alert(JSON.stringify(error))
      });
    </script>

    How to make a payment?

    1. first select stage - DEV / PROD

    2. Create payment payload & signature from Server-side and parse signature and base64 encoded payload to * Plugin*

      Note: it's the best practice to create payload and signature from server side. otherwise, the data will be compromised.

    payload

    Payload is a base64 encoded string that created from JSON payload string. Here is a sample object,

    payload = {
      merchant_id: "xxxxxx",
      amount: "10.00",
      type: "ONE_TIME",
      order_id: "CP123456789",
      currency: "LKR",
      response_url: "https://test.com/response-endpoint",
      first_name: "Sam",
      last_name: "Perera",
      email: "user@email.com",
      phone: "0712345678",
      logo: "",
    };

    signature

    Signature is HmacSHA256 hash of the base64 encoded payload string. The secret for HmacSHA256 can be found at developer portal.

    createHmacSha256Hash(base64jsonPayload, secret);
    Signature generate in PHP
    $encode_payload = base64_encode(json_encode($json_payload));
    $signature = hash_hmac('sha256', $encode_payload, 'SECRET');
    Signature generate in JS
    var encode_payload = CryptoJS.enc.Base64.stringify(CryptoJS.enc.Utf8.parse(JSON.stringify(json_payload)));
    var signature = CryptoJS.HmacSHA256( encode_payload, 'SECRET');
    Signature generate in JAVA
    Mac mac = Mac.getInstance("HmacSHA256");
    SecretKeySpec secretKeySpec = new SecretKeySpec('SECRET'.getBytes(StandardCharsets.UTF_8), "HmacSHA256");
    mac.init(secretKeySpec);
    byte[] hmacSha256 = mac.doFinal(encode_payload.getBytes(StandardCharsets.UTF_8));
    signature = String.format("%032x", new BigInteger(1, hmacSha256));

    Response Security (Serverside Response Validation)

    Step 1: Fetch authorization header and request payload.
    // Request payload
    $requestBody = file_get_contents('php://input');
    // Authorization header
    $signature = $_SERVER['HTTP_AUTHORIZATION'];
    Step 2: Split Authorization header (signature) into two parts from space character and extract request hash received.
    $authArray = explode(' ', $signature);
    $receivedHash = $authArray[1]; // Received hash
    After splitting the authorization header, if there are two parts, it is a valid authorization header. Otherwise the header is invalid.
    if (count($authArray) == 2) {
    // Proceed signature verification
    } else {
        echo "Invalid Signature.";
    }
    Step 3: Generate hmac hash for received request payload using hmac secret key provided by DirectPay.

    Note: Received request payload is a json encoded and then base64 encoded data string.

    $secret = "vs6568s7v2aklsdv687a3dn8a6q92z";
    $generatedHash = hash_hmac('sha256', $requestBody, $secret);
    Step 4: Compare generated hash with the received hash.
    if (strcmp($receivedHash, $generatedHash) == 0) {
        echo "Signature Verified.";
    } else {
        echo "Signature Verification Failed.";
    }

    If two hashes are identical, then the signature is valid and the request is a valid request, hence the request can be authenticated. Otherwise, the request is invalid or fraud.

    Complete example code:
    // Request payload
    $requestBody = file_get_contents('php://input');
    
    // Authorization header
    $signature = $_SERVER['HTTP_AUTHORIZATION'];
    
    $authArray = explode(' ', $signature);
    $receivedHash = $authArray[1]; // Received hash
    
    $secret = "vs6568s7v2aklsdv687a3dn8a6q92z";
    
    if (count($authArray) == 2) {
        $generatedHash = hash_hmac('sha256', $requestBody, $secret);
        if (strcmp($receivedHash, $generatedHash) == 0) {
            echo "Signature Verified.";
        } else {
            echo "Signature Verification Failed.";
        }
    } else {
        echo "Invalid Signature.";
    }

    Parameters

    Field Type Description Allow values Mandatory Length
    merchant_id String Merchant identification code given form DirectPay YES
    amount String Transaction amount YES
    currency String Transaction currency code. USD, LKR
    type String Transaction Type ONE_TIME, RECURRING, CARD_ADD YES
    order_id String Every transaction need unique reference YES
    return_url String After transaction process redirect to given url NO
    response_url String Server-side response URL /HTTP POST request will be sent to the given endpoint NO
    first_name String Customer first name - Auto fill the IPG UI customer details NO
    last_name String Customer last name - Auto fill the IPG UI customer details NO
    email String Customer email - Auto fill the IPG UI customer details NO
    phone String Customer mobile number - Auto fill the IPG UI customer details NO
    logo String Merchant logo - need to provide secure image url of the logo. this will appear in the IPG UI NO
    start_date String Starting date of the recurring payment YYYY-MM-DD Mandatory when TYPE = RECURRING 10
    end_date String End date of the recurring payment YYYY-MM-DD NO 10
    do_initial_payment Integer Recurring initiate time transaction 1 = YES / 0 = NO Mandatory when TYPE = RECURRING
    interval Integer Frequency of payment 1 = MONTHLY, 2 = BIANNUALLY, 3 = ANNUALLY, 4 = QUARTERLY Mandatory when TYPE = RECURRING

    Install

    npm i directpay-ipg-js

    DownloadsWeekly Downloads

    11

    Version

    1.0.31

    License

    ISC

    Unpacked Size

    163 kB

    Total Files

    10

    Last publish

    Collaborators

    • pramitha1166
    • supunssw
    • hasithaj
    • sasindu88
    • nimeshc64