Web3.js 以太坊开发速成：从入门到 DApp 实战，仅需 30 分钟！

目录： 资讯 阅读：26

Web3.js 以太坊开发教程：从入门到精通

Web3.js 是一个 JavaScript 库，允许你与以太坊区块链进行交互。通过 Web3.js，你可以读取链上数据、发送交易、部署智能合约，以及与已部署的智能合约进行交互。本教程将引导你学习 Web3.js 的基本概念和使用方法，从配置环境到智能合约交互，带你逐步成为以太坊开发专家。

第一章：Web3.js 配置与环境搭建

学习 Web3.js 的第一步是搭建一个合适的开发环境。这包括安装 Node.js 和 npm（Node Package Manager），并配置 Web3.js 库。

  1. 安装 Node.js 和 npm:
    访问 Node.js 官网 https://nodejs.org/ 下载并安装最新版本的 Node.js。npm 会自动包含在 Node.js 安装包中。
  2. 创建项目目录并初始化:
    在命令行中，创建一个新的项目目录并进入该目录： bash mkdir web3-tutorial cd web3-tutorial npm init -y
  3. 安装 Web3.js:
    使用 npm 安装 Web3.js 库： bash npm install web3
  4. 配置 Web3.js 连接:
    你需要配置 Web3.js 连接到以太坊节点。这可以通过几种方式实现：
    • Ganache 本地测试网络: Ganache 是一个快速、私有的以太坊区块链，用于本地开发和测试。下载并安装 Ganache https://www.trufflesuite.com/ganache。启动 Ganache 后，它会提供一个本地以太坊节点地址，例如 http://127.0.0.1:7545。
    • Infura API: Infura 提供了一个可靠的、可扩展的以太坊 API，你可以通过它连接到以太坊主网或测试网，而无需运行自己的节点。你需要注册一个 Infura 账户并创建一个项目，以获取 API 密钥。然后，你可以使用 API 密钥来连接到 Infura 节点。
    • Alchemy API: Alchemy 是另一个以太坊 API 提供商，类似于 Infura，提供强大的工具和基础设施，用于构建和扩展 Web3 应用。你需要注册一个 Alchemy 账户并创建一个应用，以获取 API 密钥。
  5. 初始化 Web3 实例:
    在你的 JavaScript 文件中，导入 Web3.js 库并创建一个 Web3 实例，连接到你选择的以太坊节点：

    javascript const Web3 = require('web3');

    // 连接到 Ganache const web3 = new Web3('http://127.0.0.1:7545');

    // 连接到 Infura (你需要替换 YOURINFURAAPIKEY) // const web3 = new Web3('https://mainnet.infura.io/v3/YOURINFURAAPIKEY');

    // 连接到 Alchemy (你需要替换 YOURALCHEMYAPIKEY) // const web3 = new Web3('https://eth-mainnet.alchemyapi.io/v2/YOURALCHEMYAPIKEY');

    // 现在你可以使用 web3 对象与以太坊区块链进行交互

第二章：智能合约交互与数据读取

配置好 Web3.js 环境后，就可以开始与智能合约进行交互了。这包括部署智能合约、调用智能合约函数，以及监听智能合约事件。

  1. 部署智能合约 (需要合约 ABI 和 bytecode):
    首先，你需要编译你的 Solidity 智能合约，获得合约的 ABI (Application Binary Interface) 和 bytecode。ABI 描述了合约的函数和数据结构，bytecode 是合约的编译后的代码。 你可以使用 Remix IDE ( https://remix.ethereum.org/ )来编译你的 Solidity 合约。

    javascript // 假设你已经有了合约的 ABI 和 bytecode const contractABI = [...]; // 你的合约 ABI const contractBytecode = '0x...'; // 你的合约 bytecode

    // 创建合约对象 const MyContract = new web3.eth.Contract(contractABI);

    // 部署合约 MyContract.deploy({ data: contractBytecode }) .send({ from: 'YOURACCOUNTADDRESS', // 你的以太坊账户地址 gas: 4700000 }) .then(function(newContractInstance){ console.log("Contract deployed at address: ", newContractInstance.options.address) // 保存合约地址，以便后续交互 });

    请务必替换 YOUR_ACCOUNT_ADDRESS 为你自己的以太坊账户地址。

  2. 调用智能合约函数:
    使用合约地址和 ABI 创建合约实例，然后就可以调用合约的函数了。

    javascript const contractAddress = 'YOURCONTRACTADDRESS'; // 你的合约地址

    // 创建合约实例 const myContractInstance = new web3.eth.Contract(contractABI, contractAddress);

    // 调用合约的 view 函数 (读取数据，不消耗 gas) myContractInstance.methods.myViewFunction().call() .then(function(result){ console.log("View function result: ", result); });

    // 调用合约的 transaction 函数 (修改数据，需要发送交易，消耗 gas) myContractInstance.methods.myTransactionFunction(param1, param2).send({ from: 'YOURACCOUNTADDRESS', gas: 200000 }) .then(function(receipt){ console.log("Transaction receipt: ", receipt); });

    请务必替换 YOUR_ACCOUNT_ADDRESS 和 YOUR_CONTRACT_ADDRESS 为你自己的以太坊账户地址和合约地址。

  3. 读取链上数据:
    可以使用 Web3.js 读取链上数据，例如区块信息、账户余额等。

    javascript // 获取最新区块号 web3.eth.getBlockNumber() .then(function(blockNumber){ console.log("Latest block number: ", blockNumber); });

    // 获取账户余额 web3.eth.getBalance('YOURACCOUNTADDRESS') .then(function(balance){ console.log("Account balance: ", web3.utils.fromWei(balance, 'ether') + " ETH"); });

第三章：数据监听与事件订阅

除了读取和写入数据，Web3.js 还允许你监听以太坊区块链上的事件，例如智能合约发出的事件。

  1. 监听智能合约事件:
    你可以订阅智能合约发出的特定事件，并在事件发生时执行相应的代码。

    javascript // 监听合约的 MyEvent 事件 myContractInstance.events.MyEvent({ filter: {myIndexedParam: [20,23]}, // Optional filter option fromBlock: 0 // 从哪个区块开始监听 }, function(error, event){ console.log(event); }) .on('data', function(event){ console.log(event); // 相同的事件可能多次触发 }) .on('changed', function(event){ // remove event from local database }) .on('error', console.error);

  2. 订阅区块头:
    你可以订阅新的区块头，并在新的区块产生时执行相应的代码。

    javascript const subscription = web3.eth.subscribe('newBlockHeaders', function(error, result){ if (!error) console.log(result);

    }) .on("data", function(blockHeader){ console.log(blockHeader); }) .on("error", console.error);

    // 取消订阅 // subscription.unsubscribe(function(error, success){ // if(success) // console.log('Successfully unsubscribed!'); // });

  3. 处理 pending 交易:

    javascript web3.eth.subscribe('pendingTransactions', (err, res) => { if (err) console.error(err); }) .on("data", (txHash) => { web3.eth.getTransaction(txHash) .then(console.log); });

掌握以上内容，你已经初步具备了使用 Web3.js 进行以太坊开发的能力。 想要更深入地学习，你可以参考优秀的Web3.js学习路径，以及以太坊官方文档。继续探索 Web3.js 的更多功能，并尝试构建自己的去中心化应用 (DApp)。

相关推荐：