Intracting mit dapp mit Frontend truffle petbox

App = {
  web3Provider: null,
  contracts: {},
  account: '0x0',

  init: function() {
    // Load pets.
    return App.initWeb3();
  },

  initWeb3: function() {
    if (typeof web3 !== 'undefined') {
      // If a web3 instance is already provided by Meta Mask.
      App.web3Provider = web3.currentProvider;
      web3 = new Web3(web3.currentProvider);
    } else {
      // Specify default instance if no web3 instance provided
      App.web3Provider = new Web3.providers.HttpProvider('http://localhost:7545');
      web3 = new Web3(App.web3Provider);
    }

    return App.initContract();
  },

  initContract: function() {
    $.getJSON("adding.json", function(addingdappfrontend) {

      App.contracts.Add = TruffleContract(addingdappfrontend);

      // we have to set provideer

        App.contracts.Add.setProvider(App.web3Provider);

       return App.render();

    });
  },

  render : function(){
    var addingInstance;

      // loading data
      web3.eth.getCoinbase(function(err, account) {
        if (err === null) {
          App.account = account;
          $("#accountAddress").html("Your Account: " + account);
        }
      });

      // Load contract data
      $("#add").click(function(){
      App.contracts.Add .deployed().then(function(i){
        app = i
        return app.add($("#fvalue").val() , $("#svalue").val());
      }).then(function(j){
        $("#total").val(j.total());
      });
    });
  }
};

$(function() {
  $(window).load(function() {
    App.init();
  });
});

Der folgende Code ist mein app.js-Code für die Benutzeroberfläche meiner Blockchain

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
    <title>Adding and Subracting  Twonumbers </title>

    <!-- Bootstrap -->
    <link href="css/bootstrap.min.css" rel="stylesheet">


  </head>
  <body>
    <div class="container">
      <div class="row">
        <div class="col-xs-12 col-sm-8 col-sm-push-2">
          <h1 class="text-center">adding Two Numbers</h1>
          <hr/>
          <br/>
          Firstvalue</br>
          <input type="number" name="fvalue"  id = "fvalue" value=""></br>
          second Value</br>
          <input type = "number"  name = "svalue"  id = "svalue" value = ""></br>
          Total</br>
          <input type = "number"  name= "total"  id = "total" value = ""> </br>
        </br><button name="add" id="add">Add</button>
        </div>
      </div>
      <p id="accountAddress" class="text-center"></p>
    </div>


    <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
    <!-- Include all compiled plugins (below), or include individual files as needed -->
    <script src="js/bootstrap.min.js"></script>
    <script src="js/web3.min.js"></script>
    <script src="js/truffle-contract.js"></script>
    <script src="js/app.js"></script>
  </body>
</html>

Ich habe meinen index.html-Code geschrieben, den ich mit meinem Backend-Solidity-Code verknüpfen möchte, und meine Add-Funktion aufrufen und das in meinem index.html-Code bereitgestellte Feld „total in total“ bereitstellen

pragma solidity ^0.4.23;

contract adding{

  uint256 public total;
  function  add(uint256 val1,uint256 val2) public returns(uint256){
    total = val1+val2;
    return total;
  }
}

Der obige Code gibt mir den folgenden Fehler Failed to load resource:

net::ERR_CONNECTION_REFUSED
app.js:54 14

    browser-sync-client.js?v=2.26.3:9 GET http://localhost:3000/browser-sync/socket.io/?EIO=3&transport=polling&t=MPxk1Re net::ERR_CONNECTION_REFUSED
    i.create @ browser-sync-client.js?v=2.26.3:9
    i @ browser-sync-client.js?v=2.26.3:9
    o.request @ browser-sync-client.js?v=2.26.3:9
    o.doPoll @ browser-sync-client.js?v=2.26.3:9
    n.poll @ browser-sync-client.js?v=2.26.3:9
    n.doOpen @ browser-sync-client.js?v=2.26.3:9
    n.open @ browser-sync-client.js?v=2.26.3:9
    n.open @ browser-sync-client.js?v=2.26.3:9
    n @ browser-sync-client.js?v=2.26.3:9
    n @ browser-sync-client.js?v=2.26.3:9
    n.open.n.connect @ browser-sync-client.js?v=2.26.3:9
    (anonymous) @ browser-sync-client.js?v=2.26.3:9
    browser-sync-client.js?v=2.26.3:9 GET http://localhost:3000/browser-sync/socket.io/?EIO=3&transport=polling&t=MPxk2fv net::ERR_CONNECTION_REFUSE
Sie haben hier zu viel Code eingefügt und nicht genügend Informationen über den Fehler. Haben Sie die Pet-Shop-App erfolgreich zum Laufen gebracht?
Ja, ich habe eine erfolgreiche Anwendung für eine Tierhandlung ausgeführt
Sie sollten ein Github-Repo mit dem genauen Status Ihrer App und Schritten zum Reproduzieren des Fehlers teilen, den Sie erhalten.
ja gib dir zeit ich mach das
Danke, ich habe es bekommen, nachdem ich es als reinen Wert gemacht habe, aber wie man mit dem Empfang in der Benutzeroberfläche umgeht, denke ich an eine Dokumentation dafür
Ich habe den Fehler gelöst, indem ich ihn einfach als reine Funktion gemacht habe. Bedeutet dies, dass mein Fehler zuvor Metamaskenfehler @ShawnTabrizi bedeutet
Dies bedeutet, dass Ihr Code zuvor nicht die korrekten Werte verarbeitet hat, die von Ihrem Vertrag zurückgegeben wurden. Zuvor wurde eine Transaktionsquittung zurückgegeben, nicht der Wert. Sie müssten den Wert separat abfragen, indem Sie eine Getter-Funktion erstellen oder den Wert in einem Ereignis ausgeben. Hierbei handelt es sich um intermediäre Auftragsentwicklungskonzepte. Im Allgemeinen sollten Sie immer separate Getter- und Setter-Funktionen erstellen, wobei Getter-Funktionen sichtbar sind.
Danke Jetzt habe ich verstanden, warum wir Ereignisse erstellen und sie in den Code schneiden

Antworten (2)

Es gibt oben viel Code, aber nicht genug Informationen, um Ihnen zu helfen

Erster Vorschlag, stellen Sie sicher, dass adding.jsonzugänglich ist

Nach der Lösung des aktuellen Problems können Sie mit Folgendem konfrontiert werden:

$("#add").click(function() {
    App.contracts.Add.deployed().then(function(i) {
        return i.add($("#fvalue").val(), $("#svalue").val());
    }).then(function(j) {
        $("#total").val(j);
    });
});

Ich habe meine Funktion auf reine Funktion geändert, es hat gut funktioniert

pragma solidity ^0.4.23;

contract adding{

  function  add(uint256 val1,uint256 val2) public pure  returns(uint256){
    //uint256 public total;
    uint256 total = val1+val2;
    return total;
  }
}

Der Unit-Test läuft schief

Erläuterungen finden Sie unter folgendem Link

Intracting mit dapp mit Frontend truffle petbox
AntwortenHierDatenschutz-Bestimmungen1y, 0v