lyra.com
Rechercher
Catégories
Tags
France
France
Espagne
Europe (English)
Inde
Implémentation
Formulaire embarqué (client Javascript)
Formulaire par redirection
APIs REST de paiement
Paiement par échanges de fichiers
Paiement mobile
Web Services
Faciliter l'intégration
Modules de paiement gratuits
Exemples de code
Marketplace
Back Office
Back Office Marchand
Back Office Expert
Guides
Aide
FAQ
Tutoriels vidéos
Support

Démarrer : paiement simple

3 étapes sont nécessaires pour intégrer un formulaire de paiement sur le site marchand:

  • L'initialisation du formulaire embarqué
  • L'affichage du formulaire embarqué
  • La vérification du statut de la transaction en fin de paiement

L'intégration du formulaire embarqué décrite ici concerne les sites marchand ayant un rendu côté serveur (PHP, Java, etc.).

Dans le cas où votre site s'appuie sur JavaScript pour mettre à jour son affichage, veuillez consulter la page sur les applications web monopages

Le schéma suivant détaille les interactions entre les différents acteurs (formulaire embarqué, serveur marchand, plateforme de paiement) pour chacune de ces étapes :

Serveur Marchand

Formulaire embarqué (Navigateur)

Serveur de la Plateforme de paiement

1. Initialiser le formulaire

Avant d'afficher un nouveau formulaire de paiement sur le site marchand, vous devez initialiser le formulaire en générant un token de formulaire (ou formToken ) qui synthétise toutes les options liées au paiement.

Le formToken contient les informations nécessaires à la génération du formulaire (prix, champs du formulaire, options de paiement, ...). Il peut atteindre une taille de 8Ko.

Pour créer un formToken, il faut appeler le Web Service REST Charge/CreatePayment depuis votre serveur :

Étape Description
1 Appel du Web Service REST Charge/CreatePayment depuis les serveurs du marchand.
2 Réception du résultat contenant le formToken .

Le formToken est valide pendant 15 minutes.

Consultez la liste des cas d'utilisation pour vous aider à initialiser votre formulaire.

2. Afficher le formulaire

Pour afficher le formulaire de paiement, vous devez inclure notre librairie JavaScript dans le header de votre page de paiement .

Il est impératif que la librairie principale soit chargée très tôt, bien avant les autres librairies JS utilisées sur votre page .

Le formToken est à ajouter au code d'intégration. Il sera utilisé par la librairie JavaScript pour afficher le formulaire à partir du formToken défini à l'étape précédente :

Étape Description
3 Téléchargement de la librarie JavaScript. Requête effectuée depuis le navigateur de l'acheteur.
4 Récupération du JavaScript, puis affichage de la page contenant le formulaire de paiement.

Pour un site utilisant un framework Javascript (Angular, React, Vue.js, ...), le concept est légèrement différent : voir checkout en une page ou SPC (Single Page Checkout)

Une fois le formulaire affiché, l'acheteur peut entrer ses données bancaires. Si le paiement est refusé, l'acheteur reste sur le site marchand. Si le paiement est accepté, les informations de la transaction sont envoyées sur le serveur marchand.

3. Vérifier le statut de la transaction

Lorsque la transaction est acceptée ou que le nombre maximum de tentatives est atteint, le client JavaScript effectue un POST du formulaire de paiement. Il se déroule exactement comme s'il s'agissait d'un formulaire HTML classique. Vous récupérez les informations de paiement dans les paramètres POST envoyés à votre serveur.

Étape Déscription
5 L'acheteur a cliqué sur le bouton "payer" : soumission du formulaire depuis le navigateur de l'acheteur vers nos serveurs. Cet appel est effectué automatiquement par notre client JavaScript.
6 Une fois la transaction traitée, nous effectuons un appel depuis nos serveurs vers une URL que vous avez déterminée. L'objet Transaction complet sera envoyé pour vous permettre de mettre à jour votre système d'information avant le retour navigateur. C'est l'IPN (Instant Payment Notification).
7 Nos serveurs renvoient le résultat du paiement au client JavaScript.
8 Le client JavaScript POSTe le formulaire de paiement sur vos serveurs.

Pour les sites dynamiques (qui utilisent AngularJS, React ou Vue.js), il est également possible de récupérer les informations de paiement en JavaScript : Application web monopage

Traiter l'IPN vous permet de mettre à jour votre système d'information de manière plus sécurisée et vous garantit de ne perdre aucun paiement dans le cas où l'acheteur perdrait sa connexion internet. Pour plus d'informations, veuillez consulter l'article dédié à l'IPN ici : Ipn: Présentation

C'est parti !

Après cet entremet théorique, il est temps de passer aux choses concrètes : Créer un formToken

Nous recrutons

Head Office :

LYRA NETWORK
109, rue de l’innovation
31670 Labège
FRANCE