3

我正在学习关于 DApp 创建的在线课程，我目前正在尝试设置将在教程中使用的应用程序。

Dapp 是在 Chrome 上使用 Truffle 和 Metamask 设置的。所有 Dapp 文件都由课程提供（实际上是提供了一个 Ubuntu linux 实例以在虚拟机中使用），但很快就很明显，由于 Metamask 最新版本的变化（我认为课程日期为 2017 年），网络与帐户地址相关的前端控件（显示它们的下拉列表和调用将帐户地址发送到合约的函数的按钮）被破坏。作为整个生态系统的新手，我遵循了一个同学的建议，修改了这个initWeb3函数

  initWeb3: function() {
        // Is there is an injected web3 instance?
    if (typeof web3 !== 'undefined') {
      App.web3Provider = web3.currentProvider;
    } else {
      // If no injected web3 instance is detected, fallback to the TestRPC
      App.web3Provider = new Web3.providers.HttpProvider('http://127.0.0.1:9545');
    }
    web3 = new Web3(App.web3Provider);
    App.populateAddress();
    return App.initContract();
  }

对此

  initWeb3: function() {

            // Is there is an injected web3 instance?

            if (typeof web3 !== 'undefined') {
            ethereum.enable().then(() => {
            App.web3Provider = web3.givenProvider;
            });

            } else {

            // If no injected web3 instance is detected, fallback to the TestRPC
            App.web3Provider = new Web3.providers.HttpProvider(App.url);
            }

            web3 = new Web3(App.web3Provider);
            App.populateAddress();
            return App.initContract();

            }

我知道关键的区别是ethereum.enable()电话。这确实使相关控件出现在（Chrome）网页中，现在 Metamask 还显示一个弹出窗口，要求用户批准其与帐户的通信。问题是当网页加载时，Chrome 记录如下错误：

Uncaught Error: Invalid provider passed to setProvider(); provider is null
    at Function.setProvider (truffle-contract.js:308)
    at Object.success (app.js:61)
    at i (jquery.min.js:2)
    at Object.fireWith [as resolveWith] (jquery.min.js:2)
    at y (jquery.min.js:4)
    at XMLHttpRequest.c (jquery.min.js:4)

我认为这与app.js文件中的更改有关，但我找不到解决方案。我尝试用 原始版本中存在App.web3Provider = new Web3.providers.HttpProvider(App.url)的“新”版本替换App.web3Provider = new Web3.providers.HttpProvider('http://127.0.0.1:9545');，但这没有任何区别。与givenProvider和相同currentProvider。

我和其他同学已经与课程背后的工作人员签订了合同以寻求帮助，但没有提供任何帮助（我也与他们讨论了这个问题）。我用谷歌搜索了这个错误并花了很多时间读回结果，但到目前为止还没有提供解决方案——一些结果表明这实际上是一个 Web3 错误，但我不能确定。如果有人可以帮助解决这个问题，我们将不胜感激。

谢谢

4

2 回答 2

1

我在 Truffle 网站上的教程之后遇到了这个问题：https ://trufflesuite.com/tutorial/index.html 。我解决它的方式略有不同，但顺序相似。

initWeb3: async function() {

    // Modern dapp browsers...
    if (window.ethereum){
      web3 = new Web3(web3.currentProvider);
      try {
        //Request account access
        await window.ethereum.request({ method: "eth_requestAccounts" });
      } catch (error) {
        // User denied account access...
        console.error("User denied account access");
      }
      App.web3Provider = web3.currentProvider;
      console.log("modern dapp browser");
    }
    // Legacy dapp browsers...
    else if (window.web3) {
      App.web3Provider = window.web3.currentProvider;
      console.log("legacy dapp browser");
    }
    // if no injected web3 instance is detected, fall back to Ganache
    else {
      App.web3Provider = new Web3.providers.HttpProvider('http://localhost:7545');
    }
    web3 = new Web3(App.web3Provider);

    return App.initContract();
    
  },

于 2022-01-06T05:00:14.440 回答
0

我已经解决了这个问题 - 我已经使用Ethereum Javascript API 页面中的代码在 if..else 块中启动我的 web3 实例，然后将App.web3Provider提供者设置为实例的提供者

initWeb3: function() {

			// Is there is an injected web3 instance?

			if (typeof web3 !== 'undefined') {

			ethereum.enable().then(() => {
			web3 = new Web3(web3.currentProvider);

			});

			} else {

			// If no injected web3 instance is detected, fallback to the TestRPC

			web3 = new Web3(new Web3.providers.HttpProvider("http://localhost:8545"));			
			}

			App.web3Provider=web3.currentProvider;

			App.populateAddress();

			return App.initContract();

			},

于 2019-12-29T12:37:49.170 回答