Solidity智能合约应用开发课件 项目8 Web3.js的使用与实践

Web3.js的使用与实践/Contents目录010203Web3.js概述Web3.js安装与测试使用Web3.js访问智能合约040506浏览器页面中的合约交互项目实践项目小结Web3.js概述01PARTWeb3.js定义Web3.js模块Web3.js是一个用于以太坊应用开发的JavaScript库，允许前端应用程序与以太坊区块链进行交互，包括调用智能合约、发送交易、查询区块信息等。Web3.js包含多个模块，如web3.eth用于与以太坊区块链和智能合约交互，web3.utils提供数据转换和格式化功能，web3.shh用于Whisper协议通信，web3.bzz用于与Swarm交互。Web3.js简介Web3.js安装与测试02PART在项目目录下，通过npm命令npminstallweb3安装Web3.js。安装完成后，项目目录下会生成node_modules目录，其中包含Web3.js及其依赖包。安装步骤使用npmlist命令查看已安装的软件包及其版本号，确认Web3.js安装成功。验证安装0102Web3.js安装01编写一个简单的JavaScript脚本testweb3.js，使用Web3.js连接Ganache私有测试链，获取账户列表并打印。测试脚本编写02在终端中运行nodetestweb3.js，验证Web3.js是否能正常连接Ganache并获取账户信息。测试脚本执行Web3.js测试使用Web3.js访问智能合约03PARTABI接口获取ABI是智能合约的接口描述，可通过Remix编译、Truffle编译或使用solcjs编译器生成。01合约实例创建使用合约的ABI和部署地址，通过web3.eth.Contract方法创建合约实例，然后调用合约中的方法。02调用合约方法使用call方法调用合约中的只读函数，使用send方法调用合约中的状态更改函数。03通过脚本访问智能合约在合约中触发事件，通过监听脚本接收并打印事件中的参数。事件触发与接收02编写JavaScript脚本，使用web3.eth.Contract().events模块监听合约中的事件，并通过回调函数处理事件数据。事件监听脚本编写01监听合约中的事件使用web3.eth.sendTransaction函数，指定转出账户、转入账户和转账金额，完成账户之间的转账。向外部账户转账可通过web3.eth.sendTransaction函数向合约账户转账，或调用合约中的payable修饰的函数进行转账。向合约账户转账通过Web3.js进行转账浏览器页面中的合约交互04PART使用VSCode快速创建HTML文件，搭建页面的基本框架。HTML框架搭建在HTML文件中通过<script>标签引入Web3.js库，以便在页面中使用Web3.js。Web3.js引入HTML页面创建在HTML页面中，通过合约的ABI和部署地址初始化合约实例。通过按钮、输入框等控件，调用合约中的方法，实现页面与智能合约的交互。合约实例初始化页面控件与合约交互合约交互实现页面展示使用VSCode的“OpenInDefaultBrowser”插件，在浏览器中打开HTML页面，查看页面效果。交互测试在页面中进行投票、查询得票数、猜数等操作，测试页面与智能合约的交互功能。页面展示与测试项目实践05PART编写投票合约及与合约交互的HTML页面，实现投票、查询得票数等功能。任务目的创建Truffle项目，编写投票合约，部署合约到Ganache，编写HTML页面实现与合约的交互。任务步骤投票合约HTML页面开发任务目的编写猜数游戏合约及与合约交互的HTML页面，实现开始游戏、猜数、查看目标数等功能。任务步骤创建Truffle项目，编写猜数游戏合约，部署合约到Ganache，编写HTML页面实现与合约的交互。0102猜数游戏HTML页面开发项目小结06PART开发流程回顾回顾Web3.js开发库的使用方法，包括合约部署、前端页面编写、Web3.js库函数调用等流程。应用案例分析分析投票合约、猜数游戏等应用案例，总结Web3.js在去中心化应用开发中的应用。We