Guide du programme Secure Remote Commerce
Secure Remote Commerce (SRC) est un moyen de paiement en ligne simple et sécurisé, optimisé par le secteur des paiements internationaux en vue de la protection des informations de paiement des utilisateurs. Les utilisateurs peuvent ajouter des cartes Visa, Mastercard, American Express et Discover pour activer la fonction Click to Pay de manière simple et sécurisée. La norme Secure Remote Commerce offre une expérience de paiement en ligne améliorée et prend en charge toutes les marques de réseau participant au standard SRC.
Note
Avant l’implémentation, veuillez vous référer aux exigences d’implémentation. En utilisant Secure Remote Commerce via Stripe, vous acceptez les Règles de fonctionnement. Veuillez noter que Mastercard propose le service SRC via sa plateforme Masterpass.
Intégration du bouton Secure Remote Commerce
Pour commencer, générez votre ID Checkout de Masterpass dans le Dashboard, et configurez votre bac à sable et vos URL de rappel du mode production. Notez que Mastercard propose le service SRC en tant que mise à jour de son service Masterpass. Vous observerez ainsi des références à Masterpass dans la documentation et le code.
Pour utiliser SRC sur votre site Web, ajoutez la balise de script suivante dans votre document HTML :
Paramètre | Description |
---|---|
locale | Pays (et langue) du marchand. en_US est actuellement la seule valeur valide, car SRC n’est disponible que pour les marchands américains. |
checkoutid | ID Checkout de Mastercard, copié à partir de la section Masterpass du Dashboard |
Pour afficher le bouton Masterpass, utilisez l’une des images suivantes :
Pour un bouton avec texte Masterpass en noir
Pour un bouton avec texte Masterpass en blanc
Paramètre | Description |
---|---|
locale | Pays (et langue) du marchand. en_US est actuellement la seule valeur valide, car SRC n’est disponible que pour les marchands américains. |
paymentmethod | Liste des marques de carte bancaire acceptées, séparée par des virgules (par exemple : “master,amex,visa,diners,discover,jcb,maestro”). |
checkoutid | ID Checkout de Mastercard, copié à partir de la section Masterpass du Dashboard |
Joignez un gestionnaire de clics à l’image et utilisez-le pour invoquer la fonction masterpass.checkout
avec les paramètres souhaités :
const button = document.getElementById('mpbutton'); button.addEventListener('click', (ev) => masterpass.checkout({ checkoutId: '{{MASTERPASS_CHECKOUT_ID}}', allowedCardTypes: ['master', 'amex', 'visa'], amount: '10.00', currency: 'USD', cartId: '{{UNIQUE_ID}}', callbackUrl: '{{CALLBACK_URL}}' }));
La fonction masterpass.checkout
requiert les paramètres suivants :
Paramètre | Description |
---|---|
checkoutId | ID Checkout pour votre projet Masterpass, copié à partir du Dashboard |
allowedCardTypes | Liste de prestataires de services de paiement compatibles avec Masterpass que vous voulez prendre en charge |
amount | Montant de la transaction, exprimé au format décimal |
currency | Devise à utiliser pour la transaction |
cartId | Chaîne unique que vous générez pour identifier l’achat |
callbackUrl | Ce paramètre facultatif peut être utilisé pour remplacer la callbackUrl par défaut configurée lors de l’activation de Masterpass. |
Pour plus d’informations sur la fonction masterpass.checkout
et les paramètres acceptés, consultez la documentation Mastercard.
Finalisation du paiement
Lorsque l’utilisateur clique sur le bouton Masterpass sur votre page de paiement, il est redirigé vers le site Web Masterpass où il peut sélectionner un moyen de paiement existant dans son compte, ou bien en saisir un nouveau. Lorsque l’utilisateur finalise le processus, Masterpass le redirige vers l’URL de rappel que vous avez configurée lors de l’activation de Masterpass, ou vers l’URL de rappel indiquée lorsque vous avez invoqué la fonction masterpass.checkout
. Il ajoute un paramètre de requête URL oauth_verifier
que votre application peut utiliser pour finaliser la transaction.
Dans le gestionnaire d’itinéraire pour la destination de redirection, extrayez le paramètre de requête URL et utilisez-le pour confirmer le PaymentIntent que vous avez créé en début de tunnel de paiement. Consultez la section Accepter un paiement pour en savoir plus sur la gestion de votre tunnel de paiement avec Payment Intents.
L’exemple de code suivant explique comment confirmer un PaymentIntent avec SRC dans Node.js dans le cadre Express :
app.get('/callback', async (req, res) => { // retrieve the PaymentIntent ID created at the beginning of the checkout flow. const payment_intent_id = '{{PAYMENT_INTENT_ID}}'; const payment_intent = await stripe.paymentIntents.confirm(payment_intent_id, { amount: 1000, currency: 'usd', payment_method_data: { type: 'card', card: { masterpass: { cart_id: '{{UNIQUE_ID}}', transaction_id: req.query.oauth_verifier, }, }, }, }); res.send('<h1>Charge succeeded</h1>'); });
Tester Secure Remote Commerce
Pour tester votre intégration SRC par rapport au bac à sable Mastercard, créez un nouveau compte utilisateur SRC au cours du processus de paiement sur votre site Web. Configurez le compte pour utiliser l’une des cartes test mentionnées dans la documentation Masterpass. Finalisez le processus de paiement comme d’habitude, en sélectionnant la carte test comme moyen de paiement. Si tout fonctionne correctement, Mastercard vous redirige vers votre application, qui crée le paiement comme convenu.
L’intégration SRC ne fonctionne correctement que sur les pages http ou https. Un traitement à partir du système de fichiers n’est pas pris en charge, même lors des tests.