Web3js 快速入门

JavaScript/前端
83
0
0
2024-09-06

安装

如果使用NPM作为包管理器,那可以使用下面的命令来安装web3.js:

$ npm i web3 

使用yarn包管理器的话:

$ yarn add web3

注意:使用上面的命令安装web3.js的话,将会安装web3.js的所有的子包。如果你只需要特定的包,那可以安装指定的包(例如,使用npm i web3-eth-contract来安装与交易相关的包)。

导入 Web3.js

Web3.js v4支持CommonJSCJS和原生ESM模块导入。要在CJS中导入主Web3 类,可以使用:

const { Web3 } = require('web3');

ESM风格的导入,可以使用:

import { Web3 } from 'web3';

使用指定的程序初始化Web3

Web3.js符合EIP-1193[2]标准,因此任何符合EIP-1193的provider都可以被注入到web3.js 中。HTTP、WebSocket和IPC provider也可作为web3.js包供使用。

警告 必须使用provider来初始化Web3对象,否则你无法使用完整的web3.js函数。下面是一个使用HTTP provider创建web3对象的示例。
import { Web3 } from 'web3';

//private RPC endpoint 
const web3 = new Web3('https://mainnet.infura.io/v3/YOUR_INFURA_ID'); 

//or public RPC endpoint
//const web3 = new Web3('https://eth.llamarpc.com'); 

web3.eth.getBlockNumber().then(console.log);
// ↳ 18849658n

区块链查询

在使用new Web3 provider实例化web3实例后,我们就可以使用web3.eth包来从区块链中获取数据:

// get the balance of an address
await web3.eth.getBalance('0xd8dA6BF26964aF9D7eEd9e03E53415D37aA96045');
// ↳ 114438180989009447638n

// get last block number
await web3.eth.getBlockNumber();
// ↳ 18849658n

// get the chain id of the current provider
await web3.eth.getChainId();
// ↳ 1n

// get the nonce of an address
await web3.eth.getTransactionCount('0x37826D8B5F4B175517A0f42c886f8Fca38C55Fe7');
// ↳ 7n

// get the current gas price
await web3.eth.getGasPrice();
// ↳ 23879160756n

创建钱包

如果你想在区块链上写入数据/与合约交互或发送交易,你必须拥有一个带有足够资金支付gas的账户。

Wallet对象是一个账户数组,它允许你保存多个账户,你可以使用web3.eth.sendTransaction从中发送交易 或使用web3.eth.contract.methods.contractfunction().send()与合约对象交互,当你执行这些操作时,Wallet对象会使用它所持有的账户来发送交易。

创建随机钱包

//create random wallet with 1 account
web3.eth.accounts.wallet.create(1)
/*  
Wallet(1) 
[
  {
    address: '0xcE6A5235d6033341972782a15289277E85E5b305',
    privateKey: '0x50d349f5cf627d44858d6fcb6fbf15d27457d35c58ba2d5cfeaf455f25db5bec',
    signTransaction: [Function: signTransaction],
    sign: [Function: sign],
    encrypt: [Function: encrypt]
  },
  _accountProvider: {
    create: [Function: createWithContext],
    privateKeyToAccount: [Function: privateKeyToAccountWithContext],
    decrypt: [Function: decryptWithContext]
  },
  _addressMap: Map(1) { '0xce6a5235d6033341972782a15289277e85e5b305' => 0 },
  _defaultKeyName: 'web3js_wallet'
]
*/

使用私钥创建钱包

//the private key must start with the '0x' prefix
const account = web3.eth.accounts.wallet.add('0x50d349f5cf627d44858d6fcb6fbf15d27457d35c58ba2d5cfeaf455f25db5bec');

console.log(account[0].address);
//↳ 0xcE6A5235d6033341972782a15289277E85E5b305

console.log(account[0].privateKey);
//↳ 0x50d349f5cf627d44858d6fcb6fbf15d27457d35c58ba2d5cfeaf455f25db5bec

发生交易

//add an account to a wallet
const account = web3.eth.accounts.wallet.add('0x50d349f5cf627d44858d6fcb6fbf15d27457d35c58ba2d5cfeaf455f25db5bec');

//create transaction object to send 1 eth to '0xa32...c94' address from the account[0]
const tx = 
{ 
    from: account[0].address,
    to: '0xa3286628134bad128faeef82f44e99aa64085c94', 
    value: web3.utils.toWei('1', 'ether')
};
//the `from` address must match the one previously added with wallet.add

//send the transaction
const txReceipt = await web3.eth.sendTransaction(tx);

console.log('Tx hash:', txReceipt.transactionHash)
// ↳ Tx hash: 0x03c844b069646e08af1b6f31519a36e3e08452b198ef9f6ce0f0ccafd5e3ae0e

与智能合约进行交互

实例化合约

与智能合约交互的第一步就是实例化合约,这需要ABI和合约地址:

//Uniswap token address in mainnet
const address = '0x1f9840a85d5af5bf1d1762f925bdaddc4201f984'

//you can find the complete ABI in etherscan.io
const ABI = 
[
    {
      name: 'symbol',
      outputs: [{ type: 'string' }],
      type: 'function',
    },
    {
      name: 'totalSupply',
      outputs: [{ type: 'uint256' }],
      type: 'function',
    },
];

//instantiate the contract
const uniswapToken = new web3.eth.Contract(abi, address);

读方法

//make the call to the contract
const symbol = await uniswapToken.methods.symbol().call();

console.log('Uniswap symbol:',symbol);
// ↳ Uniswap symbol: UNI

//make the call to the contract
const totalSupply = await uniswapToken.methods.totalSupply().call();

console.log('Uniswap Total supply:', totalSupply);
// ↳ Uniswap Total Supply: 1000000000000000000000000000n

//use web3 utils to format the units
console.log(web3.utils.fromWei(totalSupply, 'ether'))
// ↳ 1000000000

写方法

//address to send the token
const to = '0xcf185f2F3Fe19D82bFdcee59E3330FD7ba5f27ce';

//value to transfer (1 with 18 decimals)
const value = web3.utils.toWei('1','ether');

//send the transaction => return the Tx receipt
const txReceipt = await uniswapToken.methods.transfer(to,value).send({from: account[0].address});

console.log('Tx hash:',txReceipt.transactionHash);
// ↳ Tx hash: 0x14273c2b5781cc8f1687906c68bfc93482c603026d01b4fd37a04adb6217ad43

查询post事件

//get past `Transfer` events from block 18850576
const eventTransfer = await uniswapToken.getPastEvents('Transfer', { fromBlock: 18850576 });

console.log(eventTransfer);
// ↳ [{...},{...}, ...] array with all the events emitted
//you can only query logs from the previous 100_000 blocks 

监听实时事件

警告 你必须使用WebSocket端点初始化Web3 provider来订阅实时事件
import { Web3 } from 'web3';

//WebSocket provider
const web3 = new Web3('wss://ethereum.publicnode.com');

//instantiate contract
const uniswapToken = new web3.eth.Contract(abi, address)

//create the subcription to all the 'Transfer' events
const subscription = uniswapToken.events.Transfer();

//listen to the events
subscription.on('data',console.log);
// ↳ [{...},{...}, ...] live events will be printed in the console
声明:本作品采用署名-非商业性使用-相同方式共享 4.0 国际 (CC BY-NC-SA 4.0)[3]进行许可,使用时请注明出处。 Author: mengbin[4] blog: mengbin[5] Github: mengbin92[6] cnblogs: 恋水无意[7] 腾讯云开发者社区:孟斯特[8]

References

[1] 这里: https://docs.web3js.org/ [2] EIP-1193: https://eips.ethereum.org/EIPS/eip-1193 [3] 署名-非商业性使用-相同方式共享 4.0 国际 (CC BY-NC-SA 4.0): https://creativecommons.org/licenses/by-nc-sa/4.0/deed.zh [4] mengbin: mengbin1992@outlook.com [5] mengbin: https://mengbin.top [6] mengbin92: https://mengbin92.github.io/ [7] 恋水无意: https://www.cnblogs.com/lianshuiwuyi/ [8] 孟斯特: https://cloud.tencent.com/developer/user/6649301