升级ethers至6.8.0后无法从智能合约获取房产数据的解决问询

问题背景 #

开发房产交易dApp时，使用Ethers 5.7.2版本可正常从智能合约获取并展示房产数据；升级至6.8.0版本并改用BrowserProvider后，页面无法获取数据，控制台无输出，回退至5.7.2版本恢复正常。

原Ethers 5.7.2 合约连接代码 #

//FETCH CONTRACT
const FETCH_CONTRACT = (PROVIDER) =>
  new ethers.Contract(REAL_ESTATE_ADDRESS, REAL_ESTATE_ABI, PROVIDER);

//CONNECTING WITH CONTRACT
const connectingWithSmartContract = async () => {
  try {
    const web3modal = new Web3Modal();
    const connection = await web3modal.connect();
    const provider = new ethers.providers.Web3Provider(connection);
    const PROVIDER = provider.getSigner();

    const contract = FETCH_CONTRACT(PROVIDER);

    return contract;
  } catch (error) {
    console.log(error);
  }
};

问题根源 #

Ethers v6对核心API做了重构，关键差异包括：

• 命名空间调整：ethers.providers.Web3Provider 替换为 ethers.BrowserProvider
• Signer获取方式变更：getSigner() 从同步方法改为异步方法，必须加await
• 合约返回数据的结构处理逻辑与v5存在差异，直接沿用v5的解析逻辑会导致无法读取数据

修复后的Ethers v6 合约连接代码 #

//FETCH CONTRACT
const FETCH_CONTRACT = (SIGNER_OR_PROVIDER) =>
  new ethers.Contract(REAL_ESTATE_ADDRESS, REAL_ESTATE_ABI, SIGNER_OR_PROVIDER);

//CONNECTING WITH CONTRACT
const connectingWithSmartContract = async () => {
  try {
    const web3modal = new Web3Modal();
    const connection = await web3modal.connect();
    // 使用v6的BrowserProvider替代原Web3Provider
    const provider = new ethers.BrowserProvider(connection);
    // v6中getSigner为异步方法，必须添加await
    const signer = await provider.getSigner();

    const contract = FETCH_CONTRACT(signer);

    return contract;
  } catch (error) {
    console.error("合约连接失败:", error);
  }
};

后续调整要点 #

• 调整合约数据解析逻辑：针对v6返回的数据结构，修改原v5中读取components等字段的代码。例如部分复合类型返回值在v6中会封装为对象，需通过对应属性（如value）获取实际数据。
• 兼容Web3Modal：确保Web3Modal版本与Ethers v6兼容，若出现连接异常，升级Web3Modal至最新稳定版。

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