Medipass Checkout SDK
The Medipass Checkout SDK is a client-side TypeScript library which allows you to interact with Medipass from your web interface. It has full TypeScript support.
Table of Contents
Install
yarn add @medipass/checkout-sdk
or NPM:
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
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
}
});
const paymentRequestUrl = getPaymentRequestUrl();
await medipassCheckoutSDK.createCheckout({
paymentRequestUrl // the paymentRequestUrl returned after creating a Medipass invoice
});With a <script> tag
<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
}
});
const paymentRequestUrl = getPaymentRequestUrl();
medipassCheckoutSDK.createCheckout({
paymentRequestUrl // the paymentRequestUrl returned after creating a Medipass invoice
});
</script>
</body>
</html>Request To Update Patient Card Details
You can update a patient's payment details using the requestUpdatePaymentDetails function.
Example
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
});Using <script> tag
<html>
<head>
<script src="https://unpkg.com/@medipass/checkout-sdk/dist/umd/index.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
{
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
Object| required
{
paymentRequestUrl: string,
}