Wallet availability
Detect Apple Pay and Google Pay availability before rendering wallet controls with DEUNA Web, iOS, Android, and React Native SDKs.
On this page
Call getWalletsAvailable before rendering a merchant-owned wallet button. The SDK combines the merchant configuration returned by DEUNA with the capabilities of the current browser or device.
Availability decision#
Check by platform#
const wallets = await DeunaSDK.getWalletsAvailable({
orderToken,
userInfo: {email: 'ada@example.com'},
});
applePayButton.hidden = !wallets.includes('APPLE_PAY');
googlePayButton.hidden = !wallets.includes('GOOGLE_PAY');const wallets = await deunaSDK.getWalletsAvailable({orderToken, userInfo});
setApplePayVisible(wallets.includes('apple_pay'));
setGooglePayVisible(wallets.includes('google_pay'));deunaSDK.getWalletsAvailable(
params: GetWalletsAvailableParams(orderToken: orderToken, userInfo: userInfo)
) { wallets, error in
applePayButton.isHidden = !wallets.contains(.applePay)
if let error { showWalletRecovery(error) }
}val params = GetWalletsAvailableParams(orderToken = orderToken, userInfo = userInfo)
deunaSDK.getWalletsAvailable(this, params) { wallets, error ->
googlePayButton.isVisible = wallets.contains(WalletProvider.GOOGLE_PAY)
error?.let(::showWalletRecovery)
}Parameter modes#
| Call form | Use |
|---|---|
getWalletsAvailable() | Resolve configured wallets without order-specific transaction information. |
{orderToken, userInfo} | Resolve merchant credentials with order context before the customer clicks. Recommended for wallet checkout. |
Explicit APPLE_PAY / GOOGLE_PAY wallet config | Advanced integrations that supply approved credentials directly instead of fetching them from the DEUNA vault endpoint. |
Supplying the order before the click is especially important for Apple Pay: the later button handler can proceed immediately within the browser’s customer-gesture window.
Launch from the button#
applePayButton.addEventListener('click', async () => {
await DeunaSDK.initElements({
orderToken,
userInfo,
types: [{name: 'APPLE_PAY'}],
callbacks: {
onSuccess: verifyCredentialOrOrder,
onError: showWalletRecovery,
onClosed: restorePaymentMethods,
},
});
});Use GOOGLE_PAY for Google Pay. Keep the call directly in the click or tap handler; avoid timers, unrelated awaits, or background callbacks before opening the native sheet.
Caching and refresh#
The current SDKs cache resolved providers and credentials to make the later wallet launch fast. In the Web SDK, create DeunaSDK.newInstance() when a page genuinely needs isolated SDK state. In mobile applications, retain one initialized SDK instance for the active integration lifecycle.
Re-check when the customer changes to an order with different eligibility, switches merchant context, or starts a new application session. Never show a wallet only because it was available for a different order.
Why a wallet is absent#
Merchant or connection is not eligible
Confirm the wallet connection, environment, country, currency, and order are enabled for the account. Sandbox and production credentials are distinct.
The current browser or device cannot use the wallet
Apple Pay requires an eligible Apple device, browser, wallet setup, and merchant-domain configuration. Google Pay requires an eligible browser or Android device and supported Google services.
The availability call returns an error or empty list
Verify initialization, public API key, environment, network access, and order token. Treat an empty list as “do not render a wallet control,” not as an instruction to bypass the check.
The wallet sheet is blocked or opens too late
Run availability before the tap, cache the result through the SDK, and call initElements directly from the wallet button handler.
UX and accessibility#
- Use the provider’s approved button asset, label, sizing, and contrast rules.
- Hide unavailable wallets instead of leaving a disabled unexplained button.
- Keep a standard payment method available when the wallet cannot open.
- Announce launch errors and return focus to the wallet button after closure.
- Test device rotation, large text, screen readers, keyboard navigation, and narrow embedded layouts.