Nous traitons le bitcoin. Comment est organisée la page de paiement B2BinPay?

B2BinPay est un système de paiement de crypto-monnaie avec de nombreux backends associés pour les applications, les analyses, les nœuds, les files d'attente, mais une seule page d'interface utilisateur que l'utilisateur final voit. Il a des exigences élevées en matière de facilité d'utilisation. Malgré l'apparente simplicité de la page, l'équipe de développement serait intéressée à partager la façon dont elle est organisée de l'intérieur.

Pour comprendre les processus métier, vous devrez vous plonger dans le domaine. Pour les lecteurs qui ne savent pas encore ce que sont la crypto-monnaie, la blockchain et l'adresse, nous avons fait des définitions courtes et compréhensibles sous la coupe.



Pour comprendre les termes, voici quelques analogies avec le monde fiduciaire des paiements:
La blockchain est une base de données décentralisée (dans le cas idéal) qui stocke des informations sur les adresses, les transactions et les soldes. Il se compose de blocs, chacun d'eux contenant une quantité limitée d'informations. Les blocs sont générés grâce aux mineurs grâce à des calculs énergivores (PoW) ou à des preuves de participation (PoS). Chaque bloc suivant contient une liste de nouvelles transactions et un lien vers le précédent. Chaque crypto-monnaie a sa propre blockchain.

Marchand - le même que le propriétaire du magasin, louant un système de paiement pour recevoir les paiements des utilisateurs finaux.

Un portefeuille est identique à un compte dans le monde financier traditionnel.

Transaction - un enregistrement dans la blockchain que les fonds ont été envoyés d'un portefeuille à un autre. Le solde du portefeuille est constitué du montant des transactions.

L'adresse est la même que les détails du compte. La différence est que la plupart des chaînes de blocs vous permettent de générer un nombre infini d'adresses pour un portefeuille.

Une transaction confirmée est une transaction après laquelle un nombre sûr de blocs a été généré. Un bloc équivaut à une confirmation. Si la transaction n'a pas reçu 4 à 8 confirmations, elle n'est pas considérée comme terminée.

Système de paiement - logiciel qui permet d'accepter et de traiter les paiements en crypto-monnaie. Liens et agrège les commandes, paiements, transactions, retours, réapprovisionnement, retraits et autres informations. Il informe également le système marchand des changements dans le contexte des commandes et des paiements, et non des chaînes de blocs et des transactions.

Explorer - un service ou un site de navigateur pour les données entrant dans la blockchain. En utilisant ce service, vous pouvez facilement obtenir des informations sur les adresses, les transactions et les blocs.

Un nœud est un ordinateur sur lequel une copie de la base de données entière (blockchain) est stockée.

Schéma général de travail et exigences relatives au contenu de la page de paiement


Le cycle de paiement se déroule comme suit: sur le site Web du magasin, l'acheteur sélectionne le produit et la devise de paiement. Le système redirige l'utilisateur vers la page de paiement. Il contient les informations suivantes: devise, adresse, commentaires d'information. L'utilisateur envoie le montant requis à l'adresse spécifiée et attend un nombre suffisant de confirmations réseau pour reconnaître le paiement comme réussi. En attendant, l'acheteur peut suivre l'état du paiement sans quitter la page du site internet de l'explorateur. Une fois le paiement accepté, l'utilisateur est redirigé vers la page de paiement réussie sur le site Web du vendeur.



Le processus de paiement est divisé en plusieurs étapes. Chacun d'eux ne nécessite aucune action de l'utilisateur, sauf pour le transfert d'argent direct. Script réussi standard:

  1. Sur le site Web du vendeur, l'utilisateur sélectionne le mode de paiement et la devise B2BinPay
  2. L'IP du vendeur envoie une demande de création d'un nouvel ordre de paiement, en recevant un lien vers la page de paiement en réponse
  3. L'utilisateur redirige vers la page de paiement, qui contient des informations: devise, montant, adresse et champs supplémentaires, si nécessaire
  4. L'utilisateur paie pour l'achat
  5. Le système détecte qu'une nouvelle transaction est arrivée à l'adresse et la page passe en état de suivi
  6. L'état de la transaction est surveillé et les informations sont mises à jour sur la page jusqu'à ce qu'un nombre sécurisé de confirmations soit atteint.
  7. L'utilisateur est redirigé vers la page de paiement réussie sur le site Web du vendeur

En conséquence, la page de paiement peut être dans deux états: afficher les détails et attendre la confirmation. Lorsque vous affichez les détails, vous pouvez saisir l'adresse de deux manières: scannez le code QR ou copiez l'adresse sous forme de texte. En plus des informations de base, nous ajouterons une mini-instruction sous forme de texte, qui vous dira comment payer, où télécharger l'application de portefeuille et comment acheter des devises. En plus de ces champs, il y en a un autre dont la présence dépend de la devise choisie. Parfois, afin de comparer correctement la transaction, l'ordre de paiement et l'acheteur, il est nécessaire de connaître non seulement l'adresse, mais également des informations supplémentaires. Par exemple, pour la devise Ripple, lors de l'envoi, vous devez spécifier la balise de destination (commentaire sur la transaction).

Pour ceux qui copient l'adresse sous forme de texte et ne scannent pas le code QR, un bouton de copie a été ajouté. De plus, le logo de la pièce doit être présent sur la page, car de nombreuses personnes identifient visuellement la monnaie, par la forme et la palette de couleurs du logo, et non par la désignation de la lettre.

Le changement d'état se produit au moment où une transaction entrante vers l'adresse de facturation est détectée. À ce moment, les détails disparaissent, car ils ne sont plus nécessaires; l'utilisateur passe en mode veille et la page a besoin d'un flux constant d'informations sur l'état de la transaction. Maintenant, sur la page, vous pouvez trouver: le délai avant la fin de la transaction, le nombre actuel de confirmations, un bref commentaire expliquant les actions supplémentaires.

La page doit être facile à comprendre, intuitive et en même temps suffisamment informative. Pour les acheteurs expérimentés, l'accent doit être mis sur l'adresse et le montant.

À partir des exigences ci-dessus, une mise en page pour la future page a été obtenue.



Backend


La première option pour implémenter le backend est de s'en passer! Lors de la génération de la page de paiement, on sait à l'avance à quelle adresse l'argent sera envoyé. Vous pouvez recevoir de nouvelles transactions à cette adresse de l'explorateur à l'aide des outils JS. Ainsi, la tâche consiste à écrire des connecteurs dans l'explorateur et à interroger périodiquement le nécessaire. Un diagramme de classe statique pourrait ressembler à ceci:



Avantages: il n'y a pas de charge sur nos capacités, il est facile à mettre en œuvre, il n'y a pas de menaces de sécurité potentielles.

Inconvénients: sources non fiables et réception intempestive de nouvelles informations, difficultés à fournir des mises à jour de base de code aux clients finaux (mise en cache incontrôlée). Moins décisif - de nombreuses devises n'ont pas d'explorateur stable avec une API développée.

La deuxième option (qui fonctionne) est son propre microservice, qui reçoit les informations directement du pool de nœuds, les filtre et les distribue sur les pages de paiement. L'utilisation d'événements côté serveur sur le client réduira la redondance et économisera le trafic. Les SSE s'intègrent dans le cas d'utilisation, car la page est passive dans son comportement - elle n'accepte que de nouvelles informations.

Inconvénients: beaucoup de coûts de mise en œuvre, charge supplémentaire sur l'équipement.

Avantages: haut niveau de fiabilité et d'indépendance par rapport aux services tiers; Le contexte de la commande, pas la transaction.
Schéma du circuit:



Lorsque la page de paiement s'ouvre dans le navigateur du client, une demande de création d'une connexion SSE est envoyée au backend asynchrone du microservice. La demande indique l'adresse à suivre, le montant du paiement, la durée de vie et d'autres paramètres mineurs. Sur le backend, cela est stocké dans le stockage noSQL en mémoire. Chaque fois qu'un nouveau bloc apparaît sur un nœud de la chaîne de blocs, l'application en reçoit et en extrait des informations utiles aux adresses et transactions stockées dans la base de données. Si le bloc suivant est utile, les mises à jour sont envoyées aux clients. Les connexions sont fermées à l'initiative du serveur lorsque suffisamment de confirmations sont reçues ou que TTL a expiré.

Ainsi, le backend effectue des opérations gourmandes en ressources et génère du trafic uniquement lorsque de nouvelles informations arrivent au nœud, et qu'il n'y a pas d '«interrogation» périodique pour de nouvelles informations. Grâce à l'asynchronie, nous obtenons une vitesse élevée avec des milliers de connexions simultanées.

Sachant que pour les pièces avec PoW, le délai de réception de nouvelles informations en une seconde est négligeable, la mise à l'échelle horizontale minimale d'un tel système entraînera une augmentation importante du débit. Les jours particulièrement actifs, comme le Black Friday, la charge augmente. En cas de défaillance du système ou de dysfonctionnement technique, le client a un état de secours dans lequel la page reste dans le mode d'affichage des détails pour toujours. Pour les pièces PoS, l'étape de surveillance du nombre de confirmations peut être ignorée, car la vitesse de transaction est souvent de 2 à 5 secondes.

La troisième option pour la mise en œuvre du backend est hybride, lorsque selon la vitesse de la transaction blockchain et les informations sur la disponibilité actuelle des services tiers, une interaction SSE ou HTTP avec les explorateurs est utilisée. C'est le plus efficace et le plus long en même temps.

La technologie frontale adaptée à la tâche est vue.js avec un rendu déclaratif et la possibilité de créer plusieurs états de composants. Il s'agit d'une bibliothèque légère avec une structure élégante et une modification réactive du DOM. La source de données est la connexion SSE qui s'ouvre lorsque le composant est initialisé.

La conception




Nous développons le produit et le rendons de haute qualité et fiable afin de rendre les paiements blockchain pratiques, massifs et abordables. Nous aimons non seulement l'argent, mais aussi les technologies les plus avancées, les tâches complexes et les solutions élégantes.

En développant le système de paiement B2BinPay, nous résolvons régulièrement des problèmes qui, malgré leur apparente simplicité, nécessitent une approche non standard ou un regard neuf. Nous serions reconnaissants pour vos commentaires, commentaires et suggestions. Si vous souhaitez apporter des idées nouvelles et audacieuses au service de paiement utilisé dans le monde entier, consultez les offres d'emploi actuelles .

Source: https://habr.com/ru/post/fr447418/


All Articles