深入浅出，Web3示例代码解析与应用（web3官网）
原|2025-11-14 15:46:38|浏览:97
随着区块链技术的不断发展,Web3成为了新一代互联网的代名词，Web3旨在构建一个去中心化的网络，让用户能够直接与数据和服务进行交互，而无需通过第三方中介，本文将带您走进Web3的世界，通过一些示例代码，让您了解Web3的基本概念和应用。
什么是Web3？
Web3,即第三代互联网，是建立在区块链技术之上的去中心化网络，与Web2（如我们现在使用的互联网）相比，Web3更加注重用户隐私和数据主权，允许用户直接控制自己的数据。
Web3示例代码解析
智能合约
智能合约是Web3的核心概念之一,它是一种自动执行、控制或记录法律相关事件的计算机协议，以下是一个简单的智能合约示例代码，用于实现一个简单的存取款功能：
pragma solidity ^0.8.0; contract SimpleBank { mapping(address => uint) public balances; function deposit() public payable { balances[msg.sender] += msg.value; } function withdraw(uint amount) public { require(balances[msg.sender] >= amount, "Insufficient balance"); balances[msg.sender] -= amount; payable(msg.sender).transfer(amount); } }
非同质化代币（NFT）
非同质化代币（NFT）是Web3中的一种特殊代币，代表着独一无二的资产，以下是一个简单的NFT示例代码，用于创建一个基于ERC-721标准的NFT：
pragma solidity ^0.8.0; import "@openzeppelin/contracts/token/ERC721/ERC721.sol"; contract MyNFT is ERC721 { constructor() ERC721("MyNFT", "MFT") {} function mint(address recipient, uint256 tokenId) public { _mint(recipient, tokenId); } }
DApp前端
DApp（去中心化应用）的前端开发通常使用JavaScript框架，如React，以下是一个简单的DApp前端示例代码，用于连接到上述智能合约：
import React, { useState, useEffect } from 'react'; import Web3 from 'web3'; import SimpleBank from './contracts/SimpleBank'; const App = () => { const [web3, setWeb3] = useState(null); const [account, setAccount] = useState(null); const [balance, setBalance] = useState(0); useEffect(() => { const connectWeb3 = async () => { if (window.ethereum) { const web3 = new Web3(window.ethereum); await window.ethereum.request({ method: 'eth_requestAccounts' }); const accounts = await web3.eth.getAccounts(); setWeb3(web3); setAccount(accounts[0]); const simpleBank = new web3.eth.Contract(SimpleBank.abi, SimpleBank.address); const balance = await simpleBank.methods.balanceOf(accounts[0]).call(); setBalance(balance); } }; connectWeb3(); }, []); const deposit = async () => { const simpleBank = new web3.eth.Contract(SimpleBank.abi, SimpleBank.address); await simpleBank.methods.deposit().send({ from: account, value: web3.utils.toWei('1', 'ether') }); }; return ( <div> <h1>SimpleBank</h1> <p>Account: {account}</p> <p>Balance: {balance} ETH</p> <button onClick={deposit}>Deposit</button> </div> ); }; export default App;
通过以上示例代码,我们可以看到Web3在智能合约、NFT和DApp前端方面的应用，随着技术的不断成熟，Web3将为用户带来更加安全、自由和便捷的互联网体验。
