GUI funktioniert nicht für Vertrag

Question

GUI funktioniert nicht für Vertrag

Fragesteller

Ich habe einen Vertrag wie folgt entwickelt und eine "Garantiebescheinigung" erhalten. Es bedeutet, dass es gut funktioniert. Jetzt möchte ich eine Webanwendung als UI entwerfen, um mit Smart Contracts zu interagieren. Ich habe es mit HTML und JavaScript gemacht. Es funktioniert jedoch nicht richtig. Können Sie erwähnen, welcher Teil von HTML oder JavaScript falsch ist? (Ich muss die Werte für "Energie" und "Leistung" festlegen und abrufen.)

Smart Contract-Code:

pragma solidity ^0.4.15;

import './Ownable.sol';

contract Weechain is Ownable{

  using SafeMath for uint256;

  uint256 public energyTotalSupply;
  uint256 public powerTotalSupply;

  struct Device {
    uint256 energyValue;
    uint256 powerValue;
  }
  mapping(address => Device) amount;

  event setEnergyEvent(address indexed device, uint256 energy); 
  event setPowerEvent(address indexed device, uint256 power);
  event setPayloadEvent(uint256 indexed SQN, string payload);

  // Constructor
  function Weechain() {

    energyTotalSupply = 0;
    powerTotalSupply = 0;

    amount[owner].energyValue = energyTotalSupply;
    amount[owner].powerValue = powerTotalSupply;
  }

  function amountOfenergy(address dev) constant returns (uint256 energy) {
    return amount[dev].energyValue;
  }
  function amountOfpower(address dev) constant returns (uint256 power) {
    return amount[dev].powerValue;
  }

  function setPayload(uint256 SQN, string payload) public returns (bool) {

    emit setPayloadEvent(SQN, payload);

    return true;
  }

  function setEnergy(address dev, uint256 energy) public returns (bool) {
    require(dev != address(0));

    amount[dev].energyValue = amount[dev].energyValue + energy;
    energyTotalSupply = energyTotalSupply + energy;

    emit setEnergyEvent(dev, energy);

    return true;
  }

    function setPower(address dev, uint256 power) public returns (bool) {
    require(dev != address(0));

    amount[dev].powerValue = amount[dev].powerValue + power;
    powerTotalSupply = powerTotalSupply + power;

    emit setPowerEvent(dev, power);

    return true;
  }

}

Mein HTML- und JavaScript-Code:

   <!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Weechain Smart Contract</title>

    <link rel="stylesheet" type="text/css" href="main.css">

    <script src="./node_modules/web3/dist/web3.min.js"></script>

</head>
<body>
    <div class="container">

        <h1>Weechain Instructor</h1>
        <p>Output: <span id="owner"></span>
        </p>
        <h2 id="instructor"></h2>

        <label for="name" class="col-lg-2 control-label">Address</label>
        <input id="Address" type="text"> <!--name will be changed to device address-->

        <label for="name" class="col-lg-2 control-label">Energy</label>
        <input id="Energy" type="text"> <!--age will be changed to energy value type = "text" will be type = "number"-->

        <button id="buttonSet">Set</button>

        <button id="buttonGet">Get</button>


    </div>

    <script src="https://code.jquery.com/jquery-3.2.1.slim.min.js"></script>

    <script>
       if (typeof web3 !== 'undefined') {
           web3 = new Web3(web3.currentProvider);
       } else {
           web3 = new Web3(new Web3.providers.HttpProvider("http://localhost:8545"));
       }

       web3.eth.defaultAccount = web3.eth.accounts[0];
/*
       var CoursetroContract = web3.eth.contract([{"constant":false,"inputs":[{"name":"_fName","type":"string"},{"name":"_age","type":"uint256"}],"name":"setInstructor","outputs":[],"payable":false,"stateMutability":"nonpayable","type":"function"},{"constant":true,"inputs":[],"name":"getInstructor","outputs":[{"name":"","type":"string"},{"name":"","type":"uint256"}],"payable":false,"stateMutability":"view","type":"function"}]);
*/
    var CoursetroContract = web3.eth.contract([{"constant":true,"inputs":[],"name":"energyTotalSupply","outputs":[{"name":"","type":"uint256"}],"payable":false,"stateMutability":"view","type":"function"},{"constant":true,"inputs":[{"name":"dev","type":"address"}],"name":"amountOfenergy","outputs":[{"name":"energy","type":"uint256"}],"payable":false,"stateMutability":"view","type":"function"},{"constant":true,"inputs":[],"name":"owner","outputs":[{"name":"","type":"address"}],"payable":false,"stateMutability":"view","type":"function"},{"constant":true,"inputs":[],"name":"powerTotalSupply","outputs":[{"name":"","type":"uint256"}],"payable":false,"stateMutability":"view","type":"function"},{"constant":false,"inputs":[{"name":"dev","type":"address"},{"name":"energy","type":"uint256"}],"name":"setEnergy","outputs":[{"name":"","type":"bool"}],"payable":false,"stateMutability":"nonpayable","type":"function"},{"constant":false,"inputs":[{"name":"SQN","type":"uint256"},{"name":"payload","type":"string"}],"name":"setPayload","outputs":[{"name":"","type":"bool"}],"payable":false,"stateMutability":"nonpayable","type":"function"},{"constant":true,"inputs":[{"name":"dev","type":"address"}],"name":"amountOfpower","outputs":[{"name":"power","type":"uint256"}],"payable":false,"stateMutability":"view","type":"function"},{"constant":false,"inputs":[{"name":"newOwner","type":"address"}],"name":"transferOwnership","outputs":[],"payable":false,"stateMutability":"nonpayable","type":"function"},{"constant":false,"inputs":[{"name":"dev","type":"address"},{"name":"power","type":"uint256"}],"name":"setPower","outputs":[{"name":"","type":"bool"}],"payable":false,"stateMutability":"nonpayable","type":"function"},{"inputs":[],"payable":false,"stateMutability":"nonpayable","type":"constructor"},{"anonymous":false,"inputs":[{"indexed":true,"name":"device","type":"address"},{"indexed":false,"name":"energy","type":"uint256"}],"name":"setEnergyEvent","type":"event"},{"anonymous":false,"inputs":[{"indexed":true,"name":"device","type":"address"},{"indexed":false,"name":"power","type":"uint256"}],"name":"setPowerEvent","type":"event"},{"anonymous":false,"inputs":[{"indexed":true,"name":"SQN","type":"uint256"},{"indexed":false,"name":"payload","type":"string"}],"name":"setPayloadEvent","type":"event"},{"anonymous":false,"inputs":[{"indexed":true,"name":"_by","type":"address"},{"indexed":true,"name":"_to","type":"address"}],"name":"ChangementOwnership","type":"event"}]);

       var Coursetro = CoursetroContract.at('0x9ea9de4056ae3defda58ca02257e7b6218f2e6eb');

       $("#buttonGet").click(function() {
       Coursetro.amountOfenergy('0xbacbc6e824272c7c501d930d8bb2a9e4d1a80312', function(error, result) {
           if (!error) {
               $("#instructor").html(result[0])+' ('+result[1]+')');
               console.log(result);
           } else
                console.log(error);
       });

       });

       $("#buttonSet").click(function() {
           //Coursetro.setPayload($("#name").val(), $("#age").val());
           Coursetro.setEnergy($("#Address").val(), $("#Energy").val());
           //Coursetro.setPayload($("#name").val());
       });

    </script>

</body>
</html>

HINWEIS: Ich habe auch ein Github-Repository für dieses Projekt erstellt, einschließlich Smart Contract, HTML und JavaScript-Code HIER: https://github.com/s1241/GUI-for-Smart-Contract

Antworten (1)

GUI funktioniert nicht für Vertrag

Danni · Answer 1

Danni

Ich habe keine 50 Reputation, um eine Kommentarfrage zu stellen, aber ich gehe davon aus, dass das Problem, auf das Sie stoßen, darin besteht, dass Ihre Setter Versprechen sein müssen und eine .then(function(response, error) {})Kette erfordern.

Sie warten also nicht auf die Antwort und versuchen sofort, die Werte abzurufen (die nicht festgelegt werden).

Diese Seite könnte helfen: https://coursetro.com/posts/code/99/Interacting-with-a-Smart-Contract-through-Web3.js-(Tutorial)

Versprechen: https://developers.google.com/web/fundamentals/primers/promises

Fragesteller

Vielen Dank, aber ich habe genau diesen Tutorial-Code verwendet, um meine HTML- und Javascript-Anwendung zu entwickeln. Und ich rufe meine Funktionen wie dieses Tutorial auf. Sie können meinen Code sehen. Wenn Sie denken, dass etwas nicht stimmt, lassen Sie es mich bitte wissen.

Danni

Ja, das Problem ist, dass Sie einstellen und sofort danach kommen. Sie müssen es einstellen, dann auf die Bestätigung der Transaktionen warten, damit es in das Ethereum-Netz geschrieben wird, und dann die Änderungen nach der Bestätigung der Transaktion erhalten. Erstellen Sie zwei Schaltflächen, eine zum Einstellen und eine zum Abrufen. Klicken Sie auf Get, nachdem Ihre Transaktion bestätigt und abgebaut wurde

Fragesteller

Danke schön. Tatsächlich habe ich zwei Set-Schaltflächen erstellt (Set Energy und Set Power), aber ich weiß nicht, wie ich for get so erstellen soll, dass nach dem Klicken der neu abgestimmte Wert meiner Funktion in einem Textfeld angezeigt wird. Weißt du, wie es geht? Danke.

Danni

Ja, Sie müssen entweder auf eine öffentliche Variable in Ihrem Vertrag zugreifen oder eine getFunction erstellen, um alles zu bekommen, was Sie brauchen. Siehe das Tutorial oben? Sie haben eine Funktion in ihrem Vertrag function getInstructor() view public return (string, uint) { return (fName, age); }

Fragesteller

Ja, ich habe es gesehen. aber in HTML und Javascript gibt es keine "Schaltfläche" zum Aufrufen der Funktion getInstructor(). Siehe Ende meines Javascript-Codes (Weechain.amountOfenergy(function(error, result) ....) wo ich genau wie in diesem Tutorial vorgegangen bin, nicht wahr?

Danni

Ach ich verstehe. Ja, also erstellen Sie eine Schaltfläche, um die Energiemenge zu erhalten. So etwas wie $("#buttonGetEnergy").click(function() { Weechain.amountOfenergy().then(function(error, result) { if (!error) { $("#Energyinstructor").html('Energy Value:'result[0]); } else console.log(error); }); });

Danni

Sie müssen auch eine Adresse an amountOfEnergy übergeben, da Sie sie auf eingestellt habenaddress dev

Fragesteller

Ich habe meinen HTML- und Javascript-Code geändert, wie Sie sagten, und in meiner Frage aktualisiert. Es funktioniert jedoch noch nicht. Könnt ihr mir eure Meinung sagen. Wenn Sie es testen können, ist es perfekt. Danke

Danni

Kannst du ein Github-Repo erstellen?

Fragesteller

Sur, ich werde es tun.

Fragesteller

Ich habe ein Github-Repository für dieses Projekt erstellt. Wenn Sie andere Dinge zu tun haben, lassen Sie es mich bitte wissen. Danke. github.com/s1241/GUI-for-Smart-Contract

Danni

Sie müssen Ihren Vertrag importieren, nicht wahr? Dass ich einen Weechan bekomme, ist nicht definiert. Könnten Sie das Repo aktualisieren, damit es die Dateien richtig importiert, bevor ich es mir noch einmal ansehe

Fragesteller

Ich habe den Weechain-Vertrag und andere Dateien (index.html usw.) erneut in das Repository github.com/s1241/GUI-for-Smart-Contract hochgeladen . Weitere detaillierte Informationen finden Sie unter Link1 und Link2. Wenn Sie der Meinung sind, dass es ein anderes Problem gibt, lassen Sie es mich bitte wissen. Danke.

Danni

Sieht aus, als hättest du es herausgefunden. Gut gemacht

Anupam

@Danny Jetzt hast du 50. Hilf der Community zu wachsen.

GUI funktioniert nicht für Vertrag

Fragesteller

Antworten (1)

Danni

Fragesteller

Danni

Fragesteller

Danni

Fragesteller

Danni

Danni

Fragesteller

Danni

Fragesteller

Fragesteller

Danni

Fragesteller

Danni

Anupam

So rufen Sie die Solidity-Funktion auf, die ein Array von Adressen als Argument mit web3 hat

Falscher Rückgabewert von Web3JS

Können wir zwei Verträge in der Methode web3.eth.filter aufrufen?

Solidität Wie man ein Argument von der Client-Seite an den Konstruktor übergibt

Wie generiert man eine Solidity-Encode-Funktionssignatur aus Javascript?

Die Eigenschaft „interface“ von „undefined“ oder „null“ kann nicht destrukturiert werden. Wie löst man das?

Wie rufe ich eine Zustandsänderungsfunktion mit web3.js (Browser) und Remote-Knoten auf?

Shopplattform, lade jede Sekunde 10 Artikel

Vertragscode wird nicht von web3 ausgeführt, funktioniert von Mist

Wie mache ich das Äquivalent von Soliditys bytes32 (a_signed_integer) in JavaScript?