Web3合约ABI，合约地址生成部署调用及创建，连接钱包，基础交易流程

一、Web3合约地址以及合约ABI生成，部署，交易等流程

查询区块各种信息，钱包对钱包交易；合约方面的交易，使用生成web3合约的ide工具生成合约，部署合约，调用已部署的合约方法

1. remix生成合约地址和合约ABI步骤如下

remix IDE工具

（1）在左侧文件面板中新建一个 Solidity 文件，合约代码如下（示例）：

// SPDX-License-Identifier: MIT
pragma solidity ^0.8.30;contract MyContract {uint256 public value;function setValue(uint256 _value) public {value = _value;}
}

（2）选择编译环境，并编译，拉到底部获取abi按钮，点击可复制合约ABI

（3）接下来是合约地址的生成

（4）合约校验及部署

能看到以下验证结果说明成功了

2. 合约校验及部署,吊起metamask钱包签约

点击verifyContract

3. 前端调用合约方法，并吊起钱包交互流程

（1）前端引入合约地址以及ABI,连接钱包，并调用合约写入方法

import React from "react";
import { useEffect } from "react";
import logo from "./logo.svg";
import "./App.css";
import { JsonRpcProvider, ethers, BrowserProvider } from "ethers";function App() {// 测试网地址var url = "https://apixx";var customHttpProvider = new JsonRpcProvider(url);// 测试合约交易async function testABIcontract() {// 合约地址const contractAddress = "0xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxa5";// 合约ABIconst contractAbi = [{inputs: [{internalType: "uint256",name: "_value",type: "uint256",},],name: "setValue",outputs: [],stateMutability: "nonpayable",type: "function",},{inputs: [],name: "value",outputs: [{internalType: "uint256",name: "",type: "uint256",},],stateMutability: "view",type: "function",},];if (window.ethereum) {// 连接 Provider 和 Signerconst provider = new ethers.BrowserProvider(aaa.ethereum); // 连接metamaskconst signer = await provider.getSigner(); // 获取signerconsole.log("连接 Provider 和 Signer");// 3. 创建合约实例const contract = new ethers.Contract(contractAddress, contractAbi, signer);// 4. 调用合约方法await contract.setValue(666); // 写入操作（需签名）console.log("调用合约方法");const currentValue = await contract.value(); // 读取操作console.log("当前值:", currentValue.toString());}}testABIcontract();return (<div className="App">合约查询，交易等流程</div>);
}export default App;

（2）运行代码，吊起MetaMask钱包进行交易

（3）点击确认，控制台即输出当前写入结果，成功会输出当前写入的值

（4）钱包可对应查询到交易记录

二、额外web3基础操作如下

1. 获取最新的区块号

import React from "react";
import { useEffect } from "react";
import logo from "./logo.svg";
import "./App.css";
import { JsonRpcProvider, ethers, BrowserProvider } from "ethers";function App() {// 测试网地址var url = "https://xxxxxxxx";var customHttpProvider = new JsonRpcProvider(url);// 获取最新的区块号async function getLatestBlockNumber() {try {const blockNumber = await customHttpProvider.getBlockNumber();console.log("Latest block number:", blockNumber);return blockNumber;} catch (error) {console.error("Error getting block number:", error);}}getLatestBlockNumber();return (<div className="App">web3基础操作如下</div>);
}export default App;

2. 查询平均 gas 价格

import React from "react";
import { useEffect } from "react";
import logo from "./logo.svg";
import "./App.css";
import { JsonRpcProvider, ethers, BrowserProvider } from "ethers";function App() {// 测试网地址var url = "https://xxxxxxxx";var customHttpProvider = new JsonRpcProvider(url);// 查询平均 gas 价格async function getAverageGasPrice() {const gasPrice = await customHttpProvider.getFeeData();console.log("Current average gas price: ", gasPrice);}getAverageGasPrice();return (<div className="App">web3基础操作如下</div>);
}export default App;

3. 指定要查询的区块号或哈希，获取区块信息

import React from "react";
import { useEffect } from "react";
import logo from "./logo.svg";
import "./App.css";
import { JsonRpcProvider, ethers, BrowserProvider } from "ethers";function App() {// 测试网地址var url = "https://xxxxxxxx";var customHttpProvider = new JsonRpcProvider(url);// 指定要查询的区块号或哈希const blockNumberOrHash = 4211566 as any; // 或者使用区块哈希: "0xabss..."// 获取区块信息async function getBlockInfo(blockNumberOrHash: any) {try {const block = await customHttpProvider.getBlock(blockNumberOrHash);console.log("获取区块指定要查询的区块号信息: ", block);} catch (error) {console.error("Error fetching block: ", error);}}getBlockInfo(blockNumberOrHash);return (<div className="App">web3基础操作如下</div>);
}export default App;

4. 钱包对钱包交易

import React from "react";
import { useEffect } from "react";
import logo from "./logo.svg";
import "./App.css";
import { JsonRpcProvider, ethers, BrowserProvider } from "ethers";function App() {// 测试网地址var url = "https://xxxxxxxx";var customHttpProvider = new JsonRpcProvider(url);async function metaToMetaTransation() {if (window.ethereum) {window.ethereum.request({ method: "eth_requestAccounts" }).then(async function (accounts: any) {// 连接钱包（如 MetaMask）const provider = new BrowserProvider(aaa.ethereum);const signer = await provider.getSigner(); // 获取签名者const address = accounts[0]; // 获取账户地址// 使用签名者查询余额provider.getBalance(address).then((balance) => {console.log(`余额: ${ethers.formatEther(balance)} ETH`);});// 构建交易const tx = {to: "0xxxxxxxsadasdasdadasdas", // 目标钱包地址value: ethers.parseEther("0.1"), // 转账金额（0.1 ETH）};// 发送交易const txResponse = await signer.sendTransaction(tx);console.log("交易哈希:", txResponse.hash);// 等待交易确认const receipt = await txResponse.wait();console.log("交易确认:", receipt.blockNumber);}).catch((error: any) => {console.error("Error connecting to MetaMask:", error);});} else {console.log("Please install MetaMask!");}}metaToMetaTransation();return (<div className="App">web3基础操作如下</div>);
}
export default App;

总结

测试网，主要用于协议开发、验证和质押测试，目前无法直接兑换成主网 ETH。 ‌

主要用途
专注于验证和质押功能测试，支持开发者在主网部署前测试协议升级。 ‌

代币限制
目前无官方兑换机制，开发者可通过该网络测试验证功能，但无法直接将测试币兑换为真实ETH。 ‌