部署智能合約時出錯，無法讀取未定義的“已部署”屬性？

Question

我正在為 Dapp 制作前端，因此在制作智能合約的實例並設置提供者后，我嘗試部署合約，獲取令牌余額並將其顯示在網頁上，但出現錯誤： Cannot read property 'deployed' of undefined在我的瀏覽器Cannot read property 'deployed' of undefined 。

請注意，正如我在 FixedSupplyToken.json 文件中看到的那樣，我的 FixedSupplyToken.sol 部署在測試 RPC 上，它有一個地址。 以為這是問題所在，但沒有這樣的運氣......

app.js:

    // Import libraries we need.
    import { default as Web3} from 'web3';
    import { default as contract } from 'truffle-contract'
    
    // Import our contract artifacts and turn them into usable abstractions.
    import exchange_artifacts from '../../build/contracts/Exchange.json'
    import token_artifacts from '../../build/contracts/FixedSupplyToken.json'
    
    
    var accounts;
    var account;
    
    var ExchangeContract = contract(exchange_artifacts);
    var TokenContract = contract(token_artifacts);
    window.App = {
      start: function() {
       //bootstrap everything
       
       ExchangeContract = web3.setProvider(web3.currentProvider);
       TokenContract = web3.setProvider(web3.currentProvider);

},

 //update balance function

 updateTokenBalance: function() {
    var tokenInstance;
    **TokenContract.deployed().then(function (instance) { // getting the Uncaught TypeError: Cannot read property 'deployed' of undefined**
        tokenInstance = instance;
        return tokenInstance.balanceOf.call(account);
    }).then(function (value) {
        
        var balance_element = document.getElementById("balanceTokenInToken");
        balance_element.innerHTML = value.valueOf();
    }).catch(function (e) {
        console.log(e);
        App.setStatus("Error getting balance; see log.");
    });
  },

所以我試過：

即使我取消注釋 web3.setProvider(web3.currentProvider) 我也會收到 setProvider undefined 錯誤。

感謝您的任何反饋:)

Answer 1

在start函數中，您正在重新分配TokenContract變量。

嘗試改變

ExchangeContract = web3.setProvider(web3.currentProvider);
TokenContract = web3.setProvider(web3.currentProvider);

到：

ExchangeContract.setProvider(web3.currentProvider);
TokenContract.setProvider(web3.currentProvider);

根據評論編輯：

問題的根源在於web3.setProvider方法返回 void 或undefined ，所以在語句TokenContract = web3.setProvider(web3.currentProvider); 您將undefined分配給TokenContract ，因此出現錯誤。 設置 web3 提供者和 Truffle 合約提供者是兩個不同的操作。 不確定//bootstrap everything是否有更多代碼，但如果出於某種原因您需要顯式設置提供程序，請嘗試將代碼更改為：

web3.setProvider(web3.currentProvider);
ExchangeContract.setProvider(web3.currentProvider);
TokenContract.setProvider(web3.currentProvider);

但是，如果 Web3 配置正確，則不需要第一行。 我建議為此閱讀這篇文章，因為這樣做的方式發生了變化： https : //medium.com/@awantoch/how-to-connect-web3-js-to-metamask-in-2020-fee2b2edf58a 。

它的要點是：

window.web3 = new Web3(window.ethereum);
window.ethereum.enable();

Answer 2

這一行：

import token_artifacts from '../../build/contracts/FixedSupplyToken.json'

我猜您的本地網絡服務器植根於您的 HTML 頁面所在的位置。 因此，任何將內容拉出 Web 服務器根目錄（即從..文件夾）的嘗試都將被拒絕。

使用 F12 工具運行顯示網絡流量重新加載您的頁面。 我懷疑當頁面嘗試執行GET ../../build/contracts/FixedSupplyToken.json時，您會得到 404 結果

因此， token_artifacts未定義，其他所有由它創建的東西也未定義。

快速的技巧是將 FixedSupplyToken.json 移動到您的 Web 根目錄並適當調整導入語句。

我的 python Web 服務器遇到的另一個問題是，即使在我將 json 移動到 Web 根目錄之后，我正在運行的python -m http.server東西在Content-Type標頭中返回了一個 mime 類型，但被 javascript 拒絕進口商。 我所做的快速黑客只是將 json 聲明粘貼到 .js 文件中，並給它一個變量賦值，如下所示：

window.FizzBuzzContract =    // added this line
{
  "contractName": "FizzBuzz",
  "abi": [...