Skonfiguruj web3.js do używania blockchainu Ethereum w JavaScript

W tym samouczku zobaczymy, jak zacząć z web3.js (opens in a new tab), aby wejść w interakcję z blockchainem Ethereum. Web3.js może być używany zarówno we frontendach, jak i backendach do odczytywania danych z blockchaina, dokonywania transakcji, a nawet wdrażania smart kontraktów.

Pierwszym krokiem jest dołączenie web3.js do Twojego projektu. Aby użyć go na stronie internetowej, możesz zaimportować bibliotekę bezpośrednio za pomocą CDN, takiego jak JSDeliver.

1<script src="https://cdn.jsdelivr.net/npm/web3@latest/dist/web3.min.js"></script>

Jeśli wolisz zainstalować bibliotekę do użycia w backendzie lub w projekcie frontendowym, który używa kompilacji, możesz ją zainstalować za pomocą npm:

npm install web3 --save

Następnie, aby zaimportować Web3.js do skryptu Node.js lub projektu frontendowego Browserify, możesz użyć następującej linii JavaScriptu:

1const Web3 = require("web3")
Kopiuj

Teraz, gdy dołączyliśmy bibliotekę do projektu, musimy ją zainicjować. Twój projekt musi być w stanie komunikować się z blockchainem. Większość bibliotek Ethereum komunikuje się z węzłem poprzez wywołania RPC. Aby zainicjować naszego dostawcę Web3, utworzymy instancję Web3, przekazując jako konstruktor adres URL dostawcy. Jeśli masz węzeł lub instancję ganache działającą na twoim komputerze (opens in a new tab), będzie to wyglądać tak:

1const web3 = new Web3("http://localhost:8545")
Kopiuj

Jeśli chcesz uzyskać bezpośredni dostęp do hostowanego węzła, możesz znaleźć opcje w węzłach jako usłudze.

1const web3 = new Web3("https://cloudflare-eth.com")
Kopiuj

Aby przetestować, czy poprawnie skonfigurowaliśmy naszą instancję Web3, spróbujemy pobrać najnowszy numer bloku za pomocą funkcji getBlockNumber. Ta funkcja akceptuje callback jako parametr i zwraca numer bloku jako liczbę całkowitą.

1var Web3 = require("web3")
2const web3 = new Web3("https://cloudflare-eth.com")
3
4web3.eth.getBlockNumber(function (error, result) {
5  console.log(result)
6})
Kopiuj

Jeśli wykonasz ten program, po prostu wydrukuje on najnowszy numer bloku: szczyt blockchainu. Możesz również użyć wywołań funkcji await/async, aby uniknąć zagnieżdżania wywołań zwrotnych w swoim kodzie:

1async function getBlockNumber() {
2  const latestBlockNumber = await web3.eth.getBlockNumber()
3  console.log(latestBlockNumber)
4  return latestBlockNumber
5}
6
7getBlockNumber()
Kopiuj

Możesz zobaczyć wszystkie dostępne funkcje w instancji Web3 w oficjalnej dokumentacji web3.js (opens in a new tab).

Większość bibliotek Web3 jest asynchroniczna, ponieważ w tle biblioteka wykonuje wywołania JSON-RPC do węzła, który odsyła wynik.

Jeśli pracujesz w przeglądarce, niektóre portfele bezpośrednio wstrzykują instancję Web3 i powinieneś starać się jej używać, gdy tylko jest to możliwe, zwłaszcza jeśli planujesz wchodzić w interakcję z adresem Ethereum użytkownika w celu dokonywania transakcji.

Oto fragment kodu do wykrywania, czy portfel MetaMask jest dostępny, i próby jego włączenia, jeśli tak. Pozwoli to później na odczytanie salda użytkownika i umożliwi mu zatwierdzanie transakcji, które chcesz, aby wykonał na blockchainie Ethereum:

1if (window.ethereum != null) {
2  state.web3 = new Web3(window.ethereum)
3  try {
4    // W razie potrzeby poproś o dostęp do konta
5    await window.ethereum.enable()
6    // Konta są teraz ujawnione
7  } catch (error) {
8    // Użytkownik odmówił dostępu do konta...
9  }
10}
Pokaż wszystkoKopiuj

Istnieją alternatywy dla web3.js, takie jak Ethers.js (opens in a new tab), i są one również powszechnie stosowane. W następnym samouczku zobaczymy, jak łatwo nasłuchiwać nowych bloków przychodzących na blockchainie i zobaczyć, co zawierają (opens in a new tab).

Strona ostatnio zaktualizowana: 3 marca 2026

m (opens in a new tab)

c (opens in a new tab)

n (opens in a new tab)

+11

Zobacz współtwórców