Install SDK

yarn add @medipass/checkout-sdk

npm install @medipass/checkout-sdk

Create Checkout

A payment request URL is passed to the createCheckout function, which opens a secure pop-up window to Medipass to take the payment.

Basic Usage

Copy

Copied

 import medipassCheckoutSDK from'@medipass/checkout-sdk';
// or: const medipassCheckoutSDK = require('@medipass/checkout-sdk');

 medipassCheckoutSDK.init({
 env: 'stg',
 onSuccess: ({ transactionId }) =\> {
// handle success
 },
 onFailure: ({ transactionId }) =\> {
// handle failure
 },
 onCancel: ({ transactionId }) =\> {
// handle cancel
 },
 onClose: () =\> {
// handle close
 }
 });

fetch("https://stg-api-au.medipass.io/v3/transactions/invoices").then(response => response.json()).then(data => {
   medipassCheckoutSDK.createCheckout({
        paymentRequestUrl: data.paymentRequestUrl
   });
}); |

With a <script> tag

Copy

Copied

<html>
  <head>
    <script src="https://unpkg.com/@medipass/checkout-sdk/dist/umd/index.min.js"></script>
  </head>
  <body>
    <script>
      medipassCheckoutSDK.init({
        env: 'stg',
        onSuccess: ({ transactionId }) => {
            // handle success
        },
        onFailure: ({ transactionId }) => {
            // handle failure
        },
        onCancel: ({ transactionId }) => {
            // handle cancel
        },
        onClose: () => {
            // handle close
        }
      });

fetch("https://stg-api-au.medipass.io/v3/transactions/invoices").then(response => response.json()).then(data => {
   medipassCheckoutSDK.createCheckout({
        paymentRequestUrl: data.paymentRequestUrl
   });
});

    </script>
  </body>
</html>

Request To Update Patient Card Details

Partners can update a patient's payment details using the requestUpdatePaymentDetails function.

Example

Copy

Copied

import medipassCheckoutSDK from '@medipass/checkout-sdk';
// or: const medipassCheckoutSDK = require('@medipass/checkout-sdk');


await medipassCheckoutSDK.requestUpdatePaymentDetails({
  apiKey, // apiKey | undefined
  token, // token | undefined
  patientRefId, // patientRefId
  env, // 'stg' | 'prod'
  onSuccess, // Invoked when the payment method update has been successful
  onFailure, // Invoked when the payment method update has failed
  onCancel, // Invoked when the payment method update has been rejected
  onClose, // Invoked when the pop-up window has been closed by the user
  callbackOrigin // The origin of the window invoking the checkout SDK
});

With a <script> tag

Copy

Copied

<html>
  <head>
    <script src="https://unpkg.com/@medipass/checkout-sdk/umd/@medipass/checkout-sdk.min.js"></script>
  </head>
  <body>
    <script>

  medipassCheckoutSDK.requestUpdatePaymentDetails({
    apiKey, // apiKey | undefined
    token, // token | undefined
    patientRefId, // patientRefId
    env, // 'stg' | 'prod'
    onSuccess, // Invoked when the payment method update has been successful
    onFailure, // Invoked when the payment method update has failed
    onCancel, // Invoked when the payment method update has been rejected
    onClose, // Invoked when the pop-up window has been closed by the user
    callbackOrigin // The origin of the window invoking the checkout SDK
});
    </script>
  </body>
</html>

Take note of the following:

medipassCheckoutSDK.int() should not be called when using requestUpdatePaymentDetails

It is required that you pass either an apiKey or a token

API

sdk.init(config)

config

Object | required

Copy

Copied

 {
 env: 'stg' | 'prod',
 onSuccess: function({ transactionId }) {}, // Invoked when the payment has been successful
 onFailure: function({ transactionId }) {}, // Invoked when the payment has failed
 onCancel: function({ transactionId }) {}, // Invoked when the payment has been rejected
 onClose: function() {} // Invoked when the pop-up window has been closed by the user before approving or rejecting the payment
 }

sdk.createCheckout(config)

config

Copy

Copied

 {
 paymentRequestUrl: string,
 }