Iframe checkout
Embed Mobile Money payment using a merchant public key.
The eTulip checkout displays only operators enabled for your account. Its dedicated public key creates short-lived sessions without exposing your private API credential.
Public key
et_pk_… key cannot read balances or administer your account. Register your parent origin through POST /v1/merchant/checkout-key from your authenticated server. The key is shown once.Flow
Register your domain
Send {"allowed_origin":"https://your-site.example"} to POST /v1/merchant/checkout-key using your private server credential.
Create an intent on your server
Call POST /v1/merchant/checkout-intents with your private API credential and the order amount/reference. Keep the returned intent_token.
Open the iframe
Load checkout with ?parent_origin=https%3A%2F%2Fyour-site.example and wait for ETULIP_FRAME_READY.
Create a session
Send ETULIP_INIT with public_key and intent_token. Checkout calls POST /v1/checkout/sessions and shows enabled operators.
Follow the payment
Once the phone number is entered, POST /v1/checkout/checkoutpay starts a collection. Checkout polls status and sends ETULIP_SUCCESS or ETULIP_FAILURE to the parent.
const origin = window.location.origin;
const frame = document.querySelector('#etulip-checkout');
frame.src = `https://checkout.etulip.example/?parent_origin=${encodeURIComponent(origin)}`;
window.addEventListener('message', (event) => {
if (event.origin !== 'https://checkout.etulip.example' || event.source !== frame.contentWindow) return;
if (event.data?.type === 'ETULIP_FRAME_READY') {
frame.contentWindow.postMessage({ type: 'ETULIP_INIT', payload: {
public_key: 'et_pk_YOUR_KEY', intent_token: 'et_ci_SERVER_TOKEN'
}}, 'https://checkout.etulip.example');
}
if (event.data?.type === 'ETULIP_SUCCESS') console.log(event.data.payload.transaction_id);
});Verify on your server