web3基础知识点

321 阅读9分钟

主流公链特性和应用

主流公链特性

比特币

跨境支和价值存储付,因为安全性高

以太坊(Ethereum)公链

  • 特性
    • 智能合约功能强大:支持图灵完备的智能合约语言,开发者可以在以太坊上创建各种复杂的去中心化应用(DApp)。
    • 生态丰富:涵盖了去中心化金融(DeFi)、非同质化代币(NFT)、游戏等多个领域。
    • 采用权益证明(PoS)共识机制,网络成本低
    • Gas 费用机制:激励矿工
  • 应用
    • DeFi 应用:如借贷协议、去中心化交易所、稳定币等,用户可以在无需传统金融机构中介的情况下进行金融交易。
    • NFT 领域:以太坊是 NFT 的主要发行和交易平台,各种数字艺术品、收藏品、虚拟土地等 NFT 项目在以太坊上蓬勃发展。
    • 去中心化自治组织(DAO) :通过智能合约实现组织的治理和运营,成员可以通过持有代币参与组织的决策和管理。

币安智能链(Binance Smart Chain,BSC)

  • 特性

    • 与币安链兼容:与币安链实现了资产的跨链互通,用户可以在两条链之间方便地转移资产。
    • 高性能:采用委托权益证明(DPoS)共识机制,具有较高的交易处理速度和较低的交易费用,能够满足大规模商业应用的需求。
    • 支持智能合约:兼容以太坊的智能合约,使得以太坊上的 DApp 可以较为容易地迁移到 BSC 上。
  • 应用

    • DeFi 应用:迅速发展成为 DeFi 的重要平台之一,许多知名的 DeFi 项目在 BSC 上部署,吸引了大量用户参与流动性挖矿、交易等活动。
    • NFT 应用:也涌现出了许多 NFT 项目,包括数字艺术品、游戏道具等,为用户提供了更多的 NFT 创作和交易选择。

波卡(Polkadot)公链

跨链通信

怎么选择合适的公链

  • 功能需求
  • 若要开发智能合约应用,以太坊、币安智能链等支持智能合约的公链是较好选择;
  • 若注重去中心化存储,可考虑 IPFS 等相关公链;
  • 有跨链需求,则波卡、Cosmos 等跨链公链更为合适1。
  • 交易速度与吞吐量需求:如果是高频交易的项目或应用,如大规模的去中心化交易所,就需要选择像 Solana、波场等交易速度快、吞吐量高的公链;若是低频交易的场景,如一些艺术收藏品的交易平台,对交易速度要求不高,比特币公链等也能满足12。
  • 安全性需求:涉及大量资金存储和交易的应用,如金融类应用,需要选择安全性高的公链,像比特币、以太坊等经过长期实践检验、安全记录良好的公链12。

有了以太坊还出现币安智能链(BSC),主要有以下几方面原因:

解决以太坊性能痛点

  • 交易速度慢
  • 交易费用高

满足市场多样化需求和利用自身资源优势

币安最大的交易所,有技术用户业务等自己弄一条公链

实现以太坊兼容互补

  • 降低开发门槛:BSC 在设计上完全兼容以太坊虚拟机(EVM),以太坊生态系统中的智能合约和 DApp 可以无缝迁移到 BSC 上13。这使得开发者无需重新学习新的技术和语言,降低了开发成本和门槛,同时也促进了以太坊生态与 BSC 生态的融合。
  • 促进跨链互通:BSC 采用了类似于 ERC-20 的代币标准 BEP-20,便于代币的跨链流动。通过 Binance Bridge 等跨链解决方案,BEP-20 代币可以与其他区块链资产进行互换,增强了资产的流动性和跨链操作的可行性。

智能合约abi交互流程

交互流程

加载 ABI 和连接到区块链

const abi = require('./your_contract_abi.json');
const contractAddress = '0xYourContractAddress';
const web3 = new Web3('https://your-rpc-endpoint');
const contract = new web3.eth.Contract(abi, contractAddress);
  • 引入了 ABI 文件,指定了智能合约的地址,并创建了一个Web3实例连接到以太坊节点的 RPC 端点,最后通过web3.eth.Contract创建了一个合约对象,用于后续的交互。

调用合约函数

账户余额读取
const accountAddress = '0xYourAccountAddress'; 
contract.methods.balanceOf(accountAddress).call() .then(result => { -- });
转账
const fromAccount = '0xYourAccountAddress';
const toAccount = '0xRecipientAccountAddress';
const amount = web3.utils.toWei('1', 'ether');
contract.methods.transfer(toAccount, amount).send({ from: fromAccount })
 .on('transactionHash', hash => {
    console.log(`Transaction Hash: ${hash}`);
  })
 .on('receipt', receipt => {
    console.log('Transaction Receipt:', receipt);
  })
 .on('error', error => {
    console.error('Error:', error);
  });

监听了Transfer事件,指定了事件的过滤条件为从特定账户转出,并设置了查询事件的区块范围,当事件触发时,会打印出事件的相关信息。

contract.events.Transfer({ from: fromAccount }, { fromBlock: 0, toBlock: 'latest' })
 .on('data', event => {
    console.log('Transfer Event:', event);
  })
 .on('error', error => {
    console.error('Error:', error);
  });

智能合约ABI交互中,前端如何保证数据的准确性和一致性?

数据输入验证

  • 如果智能合约的某个函数要求输入的是以太坊地址,前端就需要检查用户输入的是否为有效的以太坊地址格式(以 0x 开头,后面跟 40 个十六进制字符)。可以使用正则表达式来进行此类格式验证。

数据存储与同步

利用区块链节点提供的事件监听功能,实时获取智能合约状态的变化更新

contract.events.SomeEvent()
   .on('data', (event) => {
        // 根据事件数据更新前端界面
    })
   .on('error', (error) => {
        // 处理错误
    });

异常处理

前端要捕获可能出现的各种错误,并给用户提供明确的错误提示。例如,网络连接错误、交易失败、合约调用异常等。
try {
    const result = await contract.methods.someFunction().call();
    // 处理结果
} catch (error) {
    console.error('智能合约调用出错:', error);
    alert('与智能合约交互时出现错误,请稍后再试。');
}

如何处理智能合约ABI交互中的错误和异常情况?

识别常见错误类型

  • 网络连接错误:与区块链节点的网络连接不稳定或中断,导致无法发送交易或获取数据。例如,节点服务器故障、本地网络问题等。

如网络连接错误,可以实现重试机制

  • ABI 编码和解码错误:如果传递给智能合约的参数类型与 ABI 中定义的不一致,或者返回的数据无法正确解码,就会出现此类错误。比如,将字符串类型的参数传递给了要求为整数类型的函数。
  • 交易失败:交易可能因各种原因失败,如余额不足、gas 费用设置不合理、合约执行时发生异常(如条件不满足、越界访问等)。
  • 合约地址和 ABI 不匹配:使用了错误的合约地址或 ABI 文件,会导致无法正确调用合约函数。

EIP标准

ERC(Ethereum Request for Comments)
  • 概述:是 EIP 的一个子集,专注于以太坊应用层的标准制定,特别是智能合约接口标准,使得不同的智能合约可以实现互操作性。

  • 常见标准

    • ERC - 20:定义了以太坊代币的基本标准接口,包括代币的名称、符号、总供应量、余额查询、转账等功能。它是最广泛使用的以太坊代币标准,众多基于以太坊的代币都遵循 ERC - 20 标准,如 USDT(以太坊版本)、DAI 等。
    • ERC - 721:非同质化代币(NFT)的标准,每个代币都是独一无二的,具有不同的属性和价值。该标准广泛应用于数字艺术品、游戏道具、虚拟土地等领域,例如 CryptoPunks、Bored Ape Yacht Club 等知名 NFT 项目都基于 ERC - 721 标准。
    • ERC - 1155:多代币标准,允许在一个智能合约中创建多种类型的代币,既可以是同质化代币,也可以是非同质化代币。这种标准在游戏开发中具有很大优势,能够更高效地管理和交易多种类型的游戏资产。

钱包授权

基于 WalletConnect(支持多类型钱包)的前端授权处理

基于 MetaMask(浏览器扩展钱包)的前端授权处理

1. 检测 MetaMask 是否安装
2. 请求用户授权
async function connectWallet() {
    try {
        const accounts = await window.ethereum.request({ method: 'eth_requestAccounts' });
        // 处理授权成功的逻辑
    } catch (error) {
        if (error.code === 4001) {
            alert('您已拒绝授权,请重新操作或检查您的授权意愿。');
        } else if (error.message.includes('Network Error')) {
            alert('网络连接出现问题,请检查网络设置并稍后重试。');
        } else {
            alert('授权过程中出现未知错误,请联系客服获取帮助。');
        }
    }
}
#### 3. 监听账户变化
```js
window.ethereum.on('accountsChanged', (accounts) => {
    if (accounts.length > 0) {
        const newAccount = accounts[0];
        console.log('账户已切换为:', newAccount);
        // 更新前端界面显示新的账户信息
    } else {
        console.log('未连接任何账户');
    }
});
  • 监听账户和网络变化:使用 window.ethereum.on() 方法监听 accountsChanged 和 chainChanged 事件,当用户切换账户或网络时,及时更新界面显示。

跨链业务

用第三方的 跨链 API ,如 Chainlink、Anyswap 等 钱包检测与连接获取用户钱包的授权,以便进行跨链交易签名等操作。 通过调用跨链 API 或区块链节点的 RPC 接口,查询用户在不同区块链上的资产信息

钱包连接库

Wagmi和Web3.js 和 Ethers.js

综上所述,如果项目需要全面深入地与以太坊交互,对底层机制有定制需求,可选择 Web3.js;若追求轻量级和简洁的 API,注重性能和快速开发,Ethers.js 更合适;而对于基于 React 的项目,希望利用 React Hooks 进行高效开发,且注重状态管理和用户体验,Wagmi 是不错的选择。

  • 用途:处理账户连接、交易发送、合约调用等操作,管理以太坊交互过程中的状态。
WalletConnect钱包连接库

跨域

CORS(跨域资源共享),前端不用管

  • 灵活配置:服务器端可通过设置多个响应头(如 Access-Control-Allow-OriginAccess-Control-Allow-Methods 等)精确控制跨域访问,包括允许的源、请求方法和请求头。 缺点:兼容性差。

一般安全需求、现代浏览器、快速开发、小型项目

代理服务器软件(如 Nginx、Apache)

缺点:配置复杂维护成本高

高安全需求、高并发、大型复杂项目,有专业运维团队

后端代理

高安全需求、配置简单,功能少,适用小项目,注重后端逻辑定制

JSONP

兼容性好,只支持get请求,存在xss攻击,适合对安全性要求不高且只需要进行简单数据获取的和需要兼容浏览器

WebSocket

频繁交互场景

开发阶段:vite代理服务器

性能优化 Promise.all并行请求