MoMo PWA Integration

Guidelines to Installing and testing partners PWA with the MoMo MicroSite

Journey Initialization

Receiving: START_JOURNEY

Automatically sent when your microsite loads in the mobile app
Token Validity & Refresh Requirements

• The micrositeToken is valid for 10 minutes.
• If no activity (no heartbeats) occurs within 10 minutes, the session ends and the user must restart.
• If heartbeats are continuously sent, the session continues beyond 10 minutes.
• Partners must implement token refresh logic:

At 9 minutes, restart the journey to obtain a new valid token.

Event Structure :

javascript window.addEventListener('MoMoWebViewEvent', (payload) => { const { event, msisdn } =
payload.detail; if (event === 'START_JOURNEY') { // Access the security token const token = window.micrositeToken; // Your
initialization code here startYourApplication(token, msisdn); } });

Heartbeat (Keep-Alive)

Sending: IS_STILL_ACTIVE

Keep the session alive and prevent automatic timeout/reload, every 50 seconds

• Actual timeout is 60 seconds, providing a 10‑second buffer.

• Recommended sending interval: every 45–50 seconds.
• Only IS_STILL_ACTIVE resets the session timer.
• Other events (AWAITING_FOR_APPROVAL, APPROVED, REJECTED) do not reset the heartbeat timer.

Message Format:

function sendHeartbeat() {
const message = {
event: 'IS_STILL_ACTIVE',
micrositeToken: window.micrositeToken
};
window.ReactNativeWebView.postMessage(JSON.stringify(message));
}
// Start automatic heartbeat
const heartbeatInterval = setInterval(sendHeartbeat, 50000);

Transaction Approval Flow

Sending: AWAITING_FOR_APPROVAL

Initiated a transaction and awaiting approval

Message Format :

function sendWaitingForApproval(transactionId) {
const message = {
event: 'AWAITING_FOR_APPROVAL',
transactionId: transactionId,
micrositeToken: window.micrositeToken
};
window.ReactNativeWebView.postMessage(JSON.stringify(message));
}

Send Approval/Rejection from Microsite

function sendApproved(transactionId) {
window.ReactNativeWebView.postMessage(JSON.stringify({
event: 'APPROVED',
transactionId: transactionId,
micrositeToken: window.micrositeToken
}));
}
function notifyRejected(transactionId) {
window.ReactNativeWebView.postMessage(JSON.stringify({
event: 'REJECTED',
transactionId: transactionId,
micrositeToken: window.micrositeToken
}));
}

Journey Completion
 

Sending: DONE

User successfully completes the journey
Message Format:
 

function completeJourney() {
// Stop heartbeat
if (heartbeatInterval) {
clearInterval(heartbeatInterval);
}
// Notify completion
const message = {
event: 'DONE',
micrositeToken: window.micrositeToken
};
window.ReactNativeWebView.postMessage(JSON.stringify(message));
}

Error Handling

Sending: ERROR

An error occurs that the mobile app (and user) should know about
Message Format:

function reportError(errorMessage) {
const message = {
event: 'ERROR',
message: errorMessage,
micrositeToken: window.micrositeToken
};
window.ReactNativeWebView.postMessage(JSON.stringify(message));
}

Testing Your Integration

Browser Testing

Since window.ReactNativeWebView is only available in the mobile app, test in browser with console logging:

function sendMessage(message) {
if (window.ReactNativeWebView) {
window.ReactNativeWebView.postMessage(JSON.stringify(message));
} else {
console.log('Would send to mobile app:', message);
}
}

FAQs

1. How long is the micrositeToken valid? 10 minutes.
2. Can the session continue beyond 10 minutes? Yes — only if the heartbeat continues.
3. Do partners need to implement token refresh logic? Yes — restart the journey at 9 minutes.
4. What resets the session timeout? Only IS_STILL_ACTIVE.
5. What is the real heartbeat timeout? 60 seconds (recommended send at 45–50 seconds).
6. Which postMessage API is supported? window.ReactNativeWebView.postMessage.
7. Can the microsite use device microphone APIs? No — must be implemented natively in the app

Find the link to the Micro-Site Below