GUI no funciona por contrato

Question

GUI no funciona por contrato

interfaz gráfica de usuario
web3js
Finanzas
solidez
javascript
proveedores web3

Preguntador

Desarrollé un contrato de la siguiente manera y obtuve "certificado de garantía". Significa que funciona bien. Ahora quiero diseñar una aplicación web como interfaz de usuario para interactuar con un contrato inteligente. Lo hice con HTML y JavaScript. Sin embargo, no funciona correctamente. ¿Puedes mencionar qué parte de html o JavaScript está mal? (Necesito configurar y obtener los valores de "energía" y "potencia").

Código de contrato inteligente:

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;
  }

}

Mi código HTML y JavaScript:

   <!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>

NOTA: También he creado un repositorio de Github para este proyecto que incluye código de contrato inteligente, HTML y JavaScript AQUÍ: https://github.com/s1241/GUI-for-Smart-Contract

Respuestas (1)

GUI no funciona por contrato

dany · Answer 1

dany

No tengo 50 reputación para hacer una pregunta de comentario, pero supongo que el problema con el que te encuentras es porque tus setters deben ser promesas y requieren una .then(function(response, error) {})cadena.

Por lo tanto, no está esperando que regrese la respuesta e inmediatamente tratando de obtener los valores (que no se establecerán).

Este sitio podría ayudar: https://coursetro.com/posts/code/99/Interacting-with-a-Smart-Contract-through-Web3.js-(Tutorial)

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

Preguntador

Gracias, pero usé exactamente este código de tutorial para desarrollar mi aplicación HTML y Javascript. Y llamo a mis funciones como este tutorial. Puedes ver mi código. Si crees que algo está mal, por favor házmelo saber.

dany

Sí, el problema es que estás configurando e inmediatamente después. Debe configurarlo, luego esperar a que se confirmen las transacciones, para que se escriba en la red ethereum, luego obtenga los cambios después de la confirmación de la transacción. Cree dos botones, uno para configurar y otro para obtener. Haga clic en obtener después de que su transacción haya sido confirmada y minada

Preguntador

Gracias. De hecho, creé dos botones de configuración (configurar energía y configurar potencia) pero no sé cómo crearlos para que, después de hacer clic, el valor de retorno de mi función se muestre en un cuadro de texto. ¿Sabes cómo hacer? Gracias.

dany

Sí, necesita acceder a una variable pública en su contrato o crear una función get para obtener lo que necesite. ¿Ves el tutorial de arriba? Tienen una función en su contrato función getInstructor() ver retornos públicos (cadena, uint) { retorno (fName, edad); }

Preguntador

Sí, lo vi. pero en su html y javascript no hay un "botón" para llamar a la función getInstructor(). Vea el final de mi código javascript (Weechain.amountOfenergy(function(error, result) ....) donde hice exactamente lo mismo que este tutorial. ¿no es así?

dany

Ah, claro. Sí, así que crea un botón para obtener la cantidad de energía. Algo como esto $("#buttonGetEnergy").click(function() { Weechain.amountOfenergy().then(function(error, result) { if (!error) { $("#Energyinstructor").html('Energy Valor:'resultado[0]); } else console.log(error); }); });

dany

También debe pasar una dirección a la cantidad de energía, ya que la configuró enaddress dev

Preguntador

Modifiqué mi código html y javascript como dijiste y actualicé en mi pregunta. Sin embargo, todavía no funciona. Me podrías decir tu opinión. Si puedes probarlo, es perfecto. Gracias

dany

¿Puedes hacer un repositorio de github?

Preguntador

Sur, lo voy a hacer.

Preguntador

Creé un repositorio Github para este proyecto. Si necesita otras cosas que hacer, por favor hágamelo saber. Gracias. github.com/s1241/GUI-for-Smart-Contract

dany

necesita importar su contrato, ¿no es así? Estoy obteniendo un Weechan no está definido. ¿podría actualizar el repositorio para que importe correctamente los archivos antes de volver a verlo?

Preguntador

Cargué nuevamente el contrato de Weechain y otros archivos (index.html, etc.) en el repositorio github.com/s1241/GUI-for-Smart-Contract . También para obtener información más detallada, puede ver el enlace 1 y el enlace 2. Si cree que hay algún otro problema, hágamelo saber. Gracias.

dany

Parece que te diste cuenta. Buen trabajo

Anupam

@Danny Ahora tienes 50. Ayuda a la comunidad a crecer.

GUI no funciona por contrato

Preguntador

Respuestas (1)

dany

Preguntador

dany

Preguntador

dany

Preguntador

dany

dany

Preguntador

dany

Preguntador

Preguntador

dany

Preguntador

dany

Anupam

Cómo llamar a la función de solidez que tiene una matriz de direcciones como argumento usando web3

Valor de retorno incorrecto de Web3JS

¿Podemos llamar a dos contratos en el método web3.eth.filter?

Solidez Cómo pasar el argumento al constructor desde el lado del cliente

¿Cómo generar la firma de la función de codificación de solidez desde Javascript?

No se puede desestructurar la propiedad 'interfaz' de 'indefinido' o 'nulo'. ¿Cómo resolver esto?

¿Cómo llamar a una función de cambio de estado con web3.js (navegador) y nodo remoto?

Plataforma de compras, carga 10 artículos cada segundo

El código del contrato no se ejecuta desde web3, funciona desde Mist

¿Cómo hago el equivalente de bytes32 (a_signed_integer) de Solidity en JavaScript?