Déployer rapidement des pages de paiement adaptées aux mobiles avec Stripe Checkout

Stripe Checkout est Rayure Stripe Checkout fournit une solution de page de paiement hébergée qui prend en charge une variété de méthodes de paiement et un design adapté aux appareils pour aider les développeurs à intégrer rapidement des solutions qui ne nécessitent pas la construction d'une interface utilisateur de paiement complexe. Cet article décrit comment utiliser Stripe Checkout pour créer rapidement une page de paiement adaptée aux téléphones portables, de la configuration de base à l'interface utilisateur.Paramètres personnalisésLe déploiement se fait progressivement.

Image [1] - Déployer rapidement des pages de paiement adaptées aux mobiles avec Stripe Checkout

I. Qu'est-ce que Stripe Checkout ?

Stripe Checkout est un service fourni par Stripe.Page des paiements hébergésCela peut se faire par une simple configuration :

  • Adaptation des pages à tous les appareils (y compris les téléphones mobiles et les tablettes)
  • Prise en charge automatique du multilinguisme, du multidevise, du multimode de paiement(cartes de crédit, Apple Pay, Google Pay, etc.)
  • Validation intégrée des paiements (3D Secure, conforme à la norme PCI)
  • Prise en charge de multiples scénarios tels que les paiements uniques, les abonnements, les coupons, etc.

Son plus grand avantage -Au lieu de rédiger votre propre formulaire de paiement frontal, il vous suffit de créer une session et d'y accéder pour terminer le processus de paiement..

Image [2] - Déployer rapidement des pages de paiement adaptées aux mobiles avec Stripe Checkout

Scénarios typiques pour Stripe Checkout

Stripe Checkout est particulièrement adapté aux scénarios d'application suivants :

  • vente rapideProduits numériquesou un service unique (par exemple, téléchargements, cours, réservations)
  • Pourcentage élevé d'utilisateurs mobiles, nécessité d'offrir une page de paiement propre.
  • Vous souhaitez mettre en place rapidement un système de paiement, mais vous ne disposez pas des capacités nécessaires à la mise en place d'un système de gestion des paiements.
  • Vous n'avez pas besoin d'une interface utilisateur entièrement personnalisable, mais vous souhaitez simplement recevoir des paiements rapidement et en toute sécurité.

Processus d'intégration avec Stripe Checkout

L'ensemble du processus peut être divisé en deux parties :Créer une session de paiement dans le backend + Page de paiement de saut frontale.

Etape 1 : Préparer votre compte Stripe

  1. Inscrivez-vous et connectez-vous à votre compte Stripe :https://dashboard.stripe.com
  2. Obtenir la clé APIPour ce faire, vous devez vous rendre sur la page Developer→ API Keys (Clés API).
  3. Clé publique (pour utilisation frontale)
  4. Clé (pour l'utilisation en arrière-plan)
Image [3] - Déploiement rapide de pages de paiement adaptées aux mobiles avec Stripe Checkout

Étape 2 : Installer le SDK officiel de Stripe

En fonction du langage backend utilisé sur le site (par exemple Node.js, PHP,Python etc.), installer le kit de développement officiel Stripe (SDK).

Image [4] - Déploiement rapide de pages de paiement adaptées aux mobiles avec Stripe Checkout

Étape 3 : Création d'une session de paiement dans le backend

Créer une session de paiement sur le serveur en fonction des informations relatives au produit (nom, prix, quantité, etc.) et des paramètres de paiement (devise, taxes incluses ou non, code de réduction activé ou non, etc.)

Image [5] - Déployer rapidement des pages de paiement adaptées aux mobiles avec Stripe Checkout

Étape 4 : Renvoyer l'utilisateur à la page de paiement Stripe

Le bouton "Acheter" sur votre site web ou votre application doit être lié à la carte Stripe générée à l'étape 3. Page de paiementStripe Checkout. Lorsque l'utilisateur clique sur le bouton, il est redirigé vers la page Stripe Checkout.

Image [6] - Déployer rapidement des pages de paiement adaptées aux mobiles avec Stripe Checkout

Étape 5 : Le client effectue le paiement et retourne sur votre site web

Les utilisateurs peuvent compléter un paiement sur la page de paiement Stripe après qu'il a été effectué sur cette page :

  • Afficher le message de réussite du paiement
Image [7] - Déployer rapidement des pages de paiement adaptées aux mobiles avec Stripe Checkout

Avantages de l'expérience mobile de Stripe Checkout

1. la conception adaptative

Page de paiement StripeS'adapte automatiquement aux téléphones portables, aux tablettes et aux ordinateurs de bureauL'application est conçue pour être très fluide et facile à utiliser, sans que les développeurs aient besoin de faire des ajustements supplémentaires au niveau du style. Les utilisateurs peuvent ouvrir le lien de paiement dans leur navigateur mobile et bénéficier d'une expérience fluide semblable à celle d'une application.

Image [8] - Déployer rapidement des pages de paiement adaptées aux mobiles avec Stripe Checkout

2. la prise en charge des méthodes de paiement mobile

La page de paiement affiche automatiquement la méthode de paiement appropriée en fonction de l'appareil de l'utilisateur :

  • Écran de l'iPhone Apple Pay
  • Android Show Google Pay
  • Prise en charge des paiements WeChat, Alipay (en fonction de l'ouverture du compte)

V. Essais et recommandations pour la mise en service

1. tester les cartes avec Stripe

Stripe propose une série de numéros de cartes d'essai pour tester l'ensemble du processus sans avoir à effectuer un paiement réel :

type de cartenuméro de carteinstructions
Paiement général réussi4242 4242 4242 4242le plus courant
Défaut de paiement4000 0000 0000 9995déclenchera un événement de défaillance
3D Secure4000 0027 6000 3184Test de la page de vérification de la sécurité 3D

2) Activation des Webhooks

Afin d'effectuer un envoi automatique ou d'envoyer une notification une fois le paiement effectué, vous pouvez écouter les événements suivants :

  • checkout.session.completedPaiement effectué : Paiement effectué
  • payment_intent.succeededPaiement effectué avec succès

VI. problèmes courants et solutions

Puis-je personnaliser l'interface utilisateur de Stripe Checkout ?

Il n'est pas entièrement personnalisable, mais il peut être doté d'une image de marque et d'un logo.Configuration des paramètresModifiez la palette de couleurs et l'affichage des éléments. Si vous avez besoin de personnaliser complètement l'interface, envisagez d'utiliser l'option Éléments de rayures.

Image [9] - Déployer rapidement des pages de paiement adaptées aux mobiles avec Stripe Checkout

Puis-je ouvrir la page de paiement dans une application WeChat ?

La page Stripe Checkout peut être chargée dans une WebView et il est recommandé de l'ouvrir dans un navigateur pour s'assurer qu'Apple Pay, Google Pay, etc. fonctionnent correctement.

Comment s'interfacer avec le système d'adhésion ou le système de commande ?

Lors de la création de la Session de contrôle Lorsque le métadonnées Les champs sont transmis avec l'identifiant de l'utilisateur, le numéro de commande, etc. et sont ensuite lus et traités après un webhook ou un saut réussi.

VII. résumé

Rayure Checkout convient aux commerçants et aux développeurs qui n'ont pas besoin de compétences élevées en matière de développement frontal et qui souhaitent offrir une expérience de paiement professionnelle, sécurisée et adaptée aux téléphones portables. Il peut être configuré de manière simple :

  • Adaptation mobile
  • Modes de paiement multiplessoutenir qqch.
  • Garantie de conformité à la sécurité
  • Administration de back-office mature et soutien à la réconciliation


Contactez nous
Vous n'arrivez pas à lire le tutoriel ? Contactez-nous pour une réponse gratuite ! Aide gratuite pour les sites personnels et les sites de petites entreprises !
Service clientèle WeChat
Service clientèle WeChat
Tel : 020-2206-9892
QQ咨询:1025174874
(iii) Courriel : info@361sale.com
Horaires de travail : du lundi au vendredi, de 9h30 à 18h30, jours fériés.
© Déclaration de reproduction
Cet article a été écrit par Millie
LA FIN
Si vous l'aimez, soutenez-le.
félicitations795 partager (joies, avantages, privilèges, etc.) avec les autres
commentaires achat de canapé

Veuillez vous connecter pour poster un commentaire

    Pas de commentaires