Bibliothèques d'API JavaScript
Pour qu'une application Web puisse interagir avec la blockchain Ethereum (c'est-à-dire lire les données de la blockchain et/ou envoyer des transactions sur le réseau), elle doit se connecter à un nœud Ethereum.
Dans ce but, chaque client Ethereum implémente la spécification JSON-RPC afin de former un ensemble uniforme de points de terminaison sur lesquels les applications peuvent s'appuyer.
Si vous voulez utiliser JavaScript pour vous connecter à un nœud Ethereum, il est possible d'avoir recours à Vanilla JavaScript, mais plusieurs bibliothèques de commodité existent à l'intérieur même de l'écosystème, ce qui rend les choses beaucoup plus simples. Avec ces bibliothèques, les développeurs peuvent rédiger des méthodes intuitives d'une seule ligne pour initialiser les demandes JSON RPC (pas directement visibles) qui interagissent avec Ethereum.
Prérequis
Il peut être utile de comprendre non seulement en quoi consiste JavaScript, mais aussi la pile Ethereum et les clients Ethereum.
Pourquoi utiliser une bibliothèque ?
Les bibliothèques suppriment une grande partie de la complexité de l'interaction directe avec un nœud Ethereum. Elles fournissent également des fonctions utilitaires (par ex. convertir des ETH en gwei) afin que vous puissiez, en tant que développeur, passer moins de temps à gérer les subtilités des clients Ethereum et plus de temps à vous consacrer aux fonctionnalités uniques de votre application.
Fonctionnalités d'une bibliothèque
Se connecter à des nœud Ethereum
En utilisant des fournisseurs, les bibliothèques vous permettent de vous connecter à Ethereum et de lire ses données, que ce soit sur JSON-RPC, INFURA, Etherscan, Alchemy ou Metamask.
Exemple Ether
1// Un Web3Provider enveloppe un fournisseur Web3 standard, qui est2// ce que Metamask injecte comme window.ethereum dans chaque page.3const provider = new ethers.providers.Web3Provider(window.ethereum)45// Le plugin Metamask permet également de signer des transactions pour6// envoyer de l'ether et payer pour changer l'état de la blockchain.7// Pour cela, nous avons besoin du signataire du compte...8const signer = provider.getSigner()9Copier
Exemple Web3js
1var web3 = new Web3("http://localhost:8545")2// ou3var web3 = new Web3(new Web3.providers.HttpProvider("http://localhost:8545"))45// changer de fournisseur6web3.setProvider("ws://localhost:8546")7// ou8web3.setProvider(new Web3.providers.WebsocketProvider("ws://localhost:8546"))910// Utiliser le fournisseur IPC en node.js11var net = require("net")12var web3 = new Web3("/Users/monutilisateur/Library/Ethereum/geth.ipc", net) // Chemin type mac os13// ou14var web3 = new Web3(15 new Web3.providers.IpcProvider(16 "/Users/monutilisateur/Library/Ethereum/geth.ipc",17 net18 )19) // Chemin type mac os20// sous windows le chemin est : "\\\\.\\pipe\\geth.ipc"21// sous linux le chemin est : "/users/monutilisateur/.ethereum/geth.ipc"22Afficher toutCopier
Une fois la configuration effectuée, vous pourrez interroger la blockchain pour :
- les numéros de blocs
- le carburant estimé
- les événements du contract intelligent
- l'ID du réseau
- et plus encore...
Fonctionnalités d'un portefeuille
Les bibliothèques vous permettent de créer des portefeuilles, gérer vos clés et signer des transactions.
Voici un exemple provenant de la bibliothèque Ethers :
1// Créer une instance de portefeuille à partir d'un mnémonique...2mnemonic =3 "announce room limb pattern dry unit scale effort smooth jazz weasel alcohol"4walletMnemonic = Wallet.fromMnemonic(mnemonic)56// ...ou à partir d'une clé privée7walletPrivateKey = new Wallet(walletMnemonic.privateKey)89walletMnemonic.address === walletPrivateKey.address10// true1112// Adresse Promise par le signataire de l'API13walletMnemonic.getAddress()14// { Promise: '0x71CB05EE1b1F506fF321Da3dac38f25c0c9ce6E1' }1516// Une adresse de portefeuille est aussi disponible de façon synchrone17walletMnemonic.address18// '0x71CB05EE1b1F506fF321Da3dac38f25c0c9ce6E1'1920// Composants cryptographiques internes21walletMnemonic.privateKey22// '0x1da6847600b0ee25e9ad9a52abbd786dd2502fa4005dd5af9310b7cc7a3b25db'23walletMnemonic.publicKey24// '0x04b9e72dfd423bcf95b3801ac93f4392be5ff22143f9980eb78b3a860c4843bfd04829ae61cdba4b3b1978ac5fc64f5cc2f4350e35a108a9c9a92a81200a60cd64'2526// Portefeuille mnémonique27walletMnemonic.mnemonic28// {29// locale: 'en',30// path: 'm/44\'/60\'/0\'/0/0',31// phrase: 'announce room limb pattern dry unit scale effort smooth jazz weasel alcohol'32// }3334// Remarque : Un portefeuille créé avec une clé privée ne comporte pas35// de mnémonique (la dérivation l'empêche)36walletPrivateKey.mnemonic37// null3839// Signature d'un message40walletMnemonic.signMessage("Hello World")41// { Promise: '0x14280e5885a19f60e536de50097e96e3738c7acae4e9e62d67272d794b8127d31c03d9cd59781d4ee31fb4e1b893bd9b020ec67dfa65cfb51e2bdadbb1de26d91c' }4243tx = {44 to: "0x8ba1f109551bD432803012645Ac136ddd64DBA72",45 value: utils.parseEther("1.0"),46}4748// Signature d'une transaction49walletMnemonic.signTransaction(tx)50// { Promise: '0xf865808080948ba1f109551bd432803012645ac136ddd64dba72880de0b6b3a7640000801ca0918e294306d177ab7bd664f5e141436563854ebe0a3e523b9690b4922bbb52b8a01181612cec9c431c4257a79b8c9f0c980a2c49bb5a0e6ac52949163eeb565dfc' }5152// La méthode de connexion retourne une nouvelle instance du53// portefeuille connecté à un portefeuille du fournisseur54wallet = walletMnemonic.connect(provider)5556// Interrogation du réseau57wallet.getBalance()58// { Promise: { BigNumber: "42" } }59wallet.getTransactionCount()60// { Promise: 0 }6162// Envoi d'Ether63wallet.sendTransaction(tx)64Afficher toutCopier
Une fois la configuration effectuée, vous pourrez :
- créer un compte ;
- envoyer des transactions ;
- signer des transactions ;
- et plus encore...
Interagir avec les fonctions d'un contrat intelligent
Les bibliothèques clientes javascript autorisent votre application à appeler des fonctions de contrat intelligent en lisant l'interface binaire-programme (ABI) d'un contrat compilé.
L'ABI explique principalement les fonctions du contrat au format JSON et vous permet de l'utiliser comme un objet JavaScript standard.
Ainsi, le contrat Solidity ci-dessous :
1contract Test {2 uint a;3 address d = 0x12345678901234567890123456789012;45 function Test(uint testInt) { a = testInt;}67 event Event(uint indexed b, bytes32 c);89 event Event2(uint indexed b, bytes32 c);1011 function foo(uint b, bytes32 c) returns(address) {12 Event(b, c);13 return d;14 }15}16Afficher toutCopier
Donnerait le JSON suivant :
1[{2 "type":"constructor",3 "payable":false,4 "stateMutability":"nonpayable"5 "inputs":[{"name":"testInt","type":"uint256"}],6 },{7 "type":"function",8 "name":"foo",9 "constant":false,10 "payable":false,11 "stateMutability":"nonpayable",12 "inputs":[{"name":"b","type":"uint256"}, {"name":"c","type":"bytes32"}],13 "outputs":[{"name":"","type":"address"}]14 },{15 "type":"event",16 "name":"Event",17 "inputs":[{"indexed":true,"name":"b","type":"uint256"}, {"indexed":false,"name":"c","type":"bytes32"}],18 "anonymous":false19 },{20 "type":"event",21 "name":"Event2",22 "inputs":[{"indexed":true,"name":"b","type":"uint256"},{"indexed":false,"name":"c","type":"bytes32"}],23 "anonymous":false24}]25Afficher toutCopier
Cela veut dire que vous pouvez :
- envoyer une transaction vers le contrat intelligent et exécuter sa méthode ;
- faire un appel afin d'estimer le carburant nécessaire pour exécuter une méthode quand exécutée par le EVM ;
- déployer un contrat ;
- et plus encore...
Fonctions utilitaires
Les fonctions utilitaires vous offrent des raccourcis pour améliorer le développement Ethereum.
Les valeurs ETH sont en wei par défaut. 1 ETH = 1 000 000 000 000 000 000 WEI – ça en fait, des chiffres à gérer ! web3.utils.toWei
convertit l'ether en wei pour vous.
Et dans l'Ethers cela ressemble à ce qui suit :
1// Obtenir le solde d'un compte (par l'adresse ou le nom ENS)2balance = await provider.getBalance("ethers.eth")3// { BigNumber: "2337132817842795605" }45// Vous devrez souvent formatter la sortie pour l'utilisateur6// qui préfère voir les valeurs en ether (plutôt qu'en wei)7ethers.utils.formatEther(balance)8// '2.337132817842795605'9Copier
Bibliothèques disponibles
Web3.js - Api JavaScript Ethereum
Ethers.js - Implémentation complète d'un portefeuille Ethereum, et utilitaires en JavaScript et TypeScript
The Graph - Protocole permettant d'indexer les données Ethereum et IPFS, et d'exécuter des requêtes sur celles-ci en utilisant GraphQL
light.js - Bibliothèque JS réactive de haut niveau optimisée pour les clients légers
Web3-wrapper - Alternative Typescript à Web3.js.
Alchemyweb3 - Enveloppe autour de Web3.js avec nouvelles tentatives automatiques et API améliorées.
Complément d'information
Une ressource communautaire vous a aidé ? Modifiez cette page et ajoutez-la !
Sujets connexes
Tutoriels connexes
- Configurer Web3js pour utiliser la blockchain Ethereum avec JavaScript - Instructions pour installer et intégrer Web3js à votre projet
- Appeler un contrat intelligent à partir de JavaScript - À l'aide du jeton DAI, découvrez comment appeler une fonction de contrat en utilisant JavaScript.
- Envoi des transactions en utilisant Web3 et Alchemy - Procédure étape par étape pour envoyer des transactions depuis le backend.