如何使用window.ethereum.request查询指定代币余额而非ETH余额

核心逻辑说明 #

原生ETH的余额可以直接通过RPC方法eth_getBalance查询，但以太坊上常规发行的加密代币基本都遵循ERC20标准，属于链上合约发行的资产，你需要调用对应代币合约的balanceOf方法才能获取指定地址的持币余额。

前置准备 #

你已经用到了ethers.js，直接用它封装的合约调用能力即可，不需要手动拼装RPC参数，提前准备两个信息：

• 你要查询的ERC20代币的合约地址、代币的小数位（decimals），这两个参数可以从对应链的区块浏览器上查到
• 提前准备ERC20的最小ABI片段，只需要用到balanceOf和decimals两个方法的ABI即可，不需要全量ABI

参考实现代码 #

首先定义ERC20最小ABI：

// ERC20 最小ABI，仅包含查询余额和小数位需要的方法
const ERC20_MIN_ABI = [
  "function balanceOf(address owner) view returns (uint256)",
  "function decimals() view returns (uint8)"
];

封装查询代币余额的方法：

const getErc20Balance = async (account, tokenContractAddress) => {
  try {
    // 初始化合约实例
    const provider = new ethers.providers.Web3Provider(window.ethereum);
    const tokenContract = new ethers.Contract(tokenContractAddress, ERC20_MIN_ABI, provider);
    // 查询原始余额和代币小数位
    const rawBalance = await tokenContract.balanceOf(account);
    const decimals = await tokenContract.decimals();
    // 格式化成人可读的余额
    const formattedBalance = ethers.utils.formatUnits(rawBalance, decimals);
    setUserBalance(formattedBalance);
  } catch (error) {
    setErrorMessage(error.message);
  }
};

调用示例 #

比如你要查询以太坊主网USDC的余额，直接传入对应合约地址即可：

// 以太坊主网USDC合约地址示例
const USDC_CONTRACT = "0xA0b86991c6218b36c1d19D4a2e9Eb0cE3606eB48";
getErc20Balance(userAccount, USDC_CONTRACT);

优化提示：如果你的应用固定只查询某一个代币，可以把小数位硬编码在代码里，省去每次查询decimals的请求，减少RPC调用次数。

内容的提问来源于stack exchange，提问作者Terkinas