Triggers the native checkout flow for payment processing.
Payment transaction details.
This method can return the following status_code values:
200 (OK): Checkout completed successfully. The result contains TriggerCheckoutResult.400 (Bad Request): Invalid request parameters.500 (Internal Server Error): An unexpected error occurred.501 (Not Implemented): Requires Grab app environment.You must create a transaction on your backend (via API POST https://partner-api.grab.com/grabpay/partner/v4/charge/init) before calling this method.
Pass the transaction parameters returned from that API call as the request argument.
Calling this method without a valid pre-created transaction will result in a checkout failure.
import { CheckoutModule, isSuccess, isError } from '@grabjs/superapp-sdk';
// Initialize the checkout module
const checkout = new CheckoutModule();
// Trigger checkout with response params
const transactionResponse = await createTransaction(); // Call POST /grabpay/partner/v4/charge/init from Grab API to create a transaction
const response = await checkout.triggerCheckout(transactionResponse);
// Handle the response
if (isSuccess(response)) {
console.log('Transaction ID:', response.result.transactionID);
switch (response.result.status) {
case 'success':
console.log('Transaction successful');
break;
case 'failure':
console.log('Transaction failed:', response.result.errorMessage, response.result.errorCode);
break;
case 'pending':
console.log('Transaction pending');
break;
case 'userInitiatedCancel':
console.log('User cancelled the checkout');
break;
}
} else if (isError(response)) {
switch (response.status_code) {
case 403:
console.log('No permission to trigger checkout');
// Trigger IdentityModule.authorize() for scope 'mobile.checkout', then reload via ScopeModule.reloadScopes() and try again
break;
default:
console.error(`Error ${response.status_code}: ${response.error}`);
}
} else {
console.error('Unhandled response');
}
SDK module for triggering native payment flows via
JSBridge.Remarks
Invokes the native Grab checkout/pay component to process payments. This code must run on the Grab SuperApp's WebView to function correctly.
Example
ES Module:
Example
CDN (UMD):