合约尚未部署到检测到的网络（网络/工件不匹配）

Question

我在确定和连接正确的 MetaMask 网络时遇到了一些问题。

在 Ganache 中，我的 RPC 服务器是 127.0.0.1.7545，网络 ID 是 5777。但是，当我尝试使用此信息在 MetaMask 中创建自定义 RPC 时，出现以下错误：

The endpoint returned a different chain ID: 1337

这是我的 truffle-config.js：

module.exports = {
  networks: {
    development: {
      host: "127.0.0.1",
      port: 7545,
      network_id: "*" // Match any network id
    },
    develop: {
      port: 8545
    }
  }
};

我希望这与我指定的任何网络 ID 匹配，但控制台显示以下错误：

Contract has not been deployed to detected network (network/artifact mismatch)

我已经尝试过truffle migrate --reset ，但没有成功。 我还尝试在 truffle-config.js 中为 testrpc 创建一个显式网络 - 这也不起作用。

任何帮助将非常感激！

Answer 1

您看到该错误是因为您的合约已部署到 Ganache，但您连接到不同的网络。

您为加载合约而编写的代码应该在try/catch块内。

内部加载合约逻辑：

export const loadContract = async (name, provider) => {
  // Load the contract

  // set the provider

  let deployedContract = null;
  try {
    // Get the contract
    deployedContract = await _contract.deployed();
  } catch {
    console.error("You are connected to the wrong network");
  }

  return deployedContract;
};

在您使用loadContract的组件中，在useEffect内部调用它。

useEffect(() => {
      // Detect Provider

      if (provider) {
        // contract should be loaded when provider exists
        const contract = await loadContract("ContractName", provider);
       rLoaded: true,
       // Add More logic
      } else {
        console.error("Please, install Metamask.");
      }
    };
  }, []);

现在您需要确保如果您没有连接到 Ganache，请禁用该按钮，这样您的应用程序就不会崩溃。 为此创建一个状态变量

 // You probably already have logic to get account and contract
  const canConnectToContract = account && contract;

现在写一个合适的用户界面：

{!canConnectToContract && (
    <h2>Connect to Ganache</h2>
  )}

  <button
    disabled={!canConnectToContract}
 
  >
    Donate 1 Ethreum
  </button>