Disponibilité du portefeuille
Détectez la disponibilité d'Apple Pay et de Google Pay avant d'afficher les contrôles de portefeuille avec les SDK DEUNA Web, iOS, Android et React Native.
Sur cette page
Appeler getWalletsAvailable avant d'afficher un bouton de portefeuille de propriété du commerçant. Le SDK combine la configuration du commerçant fournie par DEUNA avec les capacités du navigateur ou de l'appareil actuel.
Décision de disponibilité#
Vérifiez par plateforme#
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)
}Modes de paramètres#
| Formulaire de paiement | Utilisation |
|---|---|
getWalletsAvailable() | Résoudre les portefeuilles configurés sans informations de transaction spécifiques à la commande. |
{orderToken, userInfo} | Résoudre les informations d'identification du commerçant avec le contexte de la commande avant que le client ne clique. Recommandé pour le paiement avec portefeuille. |
Explicite APPLE_PAY / GOOGLE_PAY Configuration du portefeuille | Intégrations avancées qui fournissent directement les informations d'identification approuvées au lieu de les récupérer à partir de l'endpoint DEUNA. |
L'affichage de la commande avant le clic est particulièrement important pour Apple Pay : le gestionnaire de bouton ultérieur peut fonctionner immédiatement dans la fenêtre de saisie du client du navigateur.
Lancer à partir du bouton#
applePayButton.addEventListener('click', async () => {
await DeunaSDK.initElements({
orderToken,
userInfo,
types: [{name: 'APPLE_PAY'}],
callbacks: {
onSuccess: verifyCredentialOrOrder,
onError: showWalletRecovery,
onClosed: restorePaymentMethods,
},
});
});Utilisation GOOGLE_PAY pour Google Pay. Conservez l'appel directement dans le gestionnaire de clic ou de tap ; évitez les timers, les attentes non liées ou les appels de rappel en arrière-plan avant d'ouvrir la feuille native.
Mise en cache et rafraîchissement#
Les SDK actuels mettent en cache les fournisseurs et les identifiants pour permettre au lancement rapide de la wallet ultérieur. Dans le SDK Web, créez DeunaSDK.newInstance() lorsqu'une page a réellement besoin d'un état SDK isolé. Dans les applications mobiles, conservez une seule instance SDK initialisée pour la durée de vie de l'intégration.
Vérifiez lorsque le client passe à une commande avec des critères différents, change de contexte de commerçant ou démarre une nouvelle session d'application. Ne montrez jamais une wallet simplement parce qu'elle était disponible pour une autre commande.
Pourquoi la wallet est absente#
Le commerçant ou la connexion n'est pas éligible
Vérifiez que la connexion, l'environnement, le pays, la devise et la commande sont activés pour le compte. Les identifiants de sandbox et de production sont distincts.
Le navigateur ou l'appareil actuel ne peut pas utiliser la wallet
Apple Pay nécessite un appareil Apple éligible, un navigateur, une configuration de wallet et une configuration du domaine du commerçant. Google Pay nécessite un navigateur ou un appareil Android éligible et des services Google pris en charge.
L'appel de disponibilité renvoie une erreur ou une liste vide
Vérifiez l'initialisation, la clé API publique, l'environnement, l'accès au réseau et le jeton de commande. Traitez une liste vide comme "ne pas afficher un contrôle de wallet", et non comme une instruction pour contourner la vérification.
La feuille de wallet est bloquée ou s'ouvre trop tard
Lancez la disponibilité avant le tap, mettez le résultat en cache via le SDK et appelez initElements directement à partir du gestionnaire de bouton de wallet.
Expérience utilisateur et accessibilité#
- Utilisez les actifs de bouton, les étiquettes, les tailles et les règles de contraste approuvés par le fournisseur.
- Cachez les wallets non disponibles au lieu de laisser un bouton désactivé et non expliqué.
- Gardez une méthode de paiement standard disponible lorsque la wallet ne peut pas s'ouvrir.
- Annoncez les erreurs de lancement et renvoyez le focus au bouton de wallet après la fermeture.
- Testez la rotation de l'appareil, le texte important, les lecteurs d'écran, la navigation au clavier et les mises en page intégrées étroites.