2

I am trying to integrate a react app with go-ethereum using web3js.

an event Onsubmit will do the following: 1. Create an account. 2. Open the account. 3. Approve a smart contract with the created account.

Here is my code

import React, { Component } from 'react';
import './App.css';
import web3 from './web3';

....

class App extends Component {

  constructor(props){
    super(props);

    this.state = {requester : '', receiver:'', balance: '', message:''};
  }

 async  componentDidMount(){
    const requester = await auth.methods.requester().call();
    const receiver = await auth.methods.receiver().call();
    const approvers = await auth.methods.approvers(0).call();
    const balance = await web3.eth.getBalance(auth.options.address);

    this.setState({requester,receiver,balance});

  }

  onSubmit = async (event)=>{
      event.preventDefault();
      console.log('Approving the smart contract ..... Mining in process ! ');

      var pass = "xxxxxxx"

      var newaccount = web3.eth.personal.newAccount(pass);

      var promise1 = Promise.resolve(newaccount);


      promise1.then(function(value) {
        var accountnumber = value;
        console.log(accountnumber);
        web3.eth.personal.unlockAccount(accountnumber,pass, 1500);    
        auth.methods.approve().send({gas: '1000000',from: accountnumber});

        console.log('Smart Contract approved ! ');


            });
  };

The account is getting created but while doing the transaction I am receiving the following error.

Approving the smart contract ..... Mining in process ! App.js:57

0x98f76b2673d545F55c0ff1e961f15EF0a7DfBaD3

App.js:71 Smart Contract

approved ! errors.js:29 Uncaught (in promise) Error: Returned error: authentication needed: password or unlock at Object.ErrorResponse (errors.js:29) at index.js:125 at XMLHttpRequest.request.onreadystatechange (index.js:103) at XMLHttpRequestEventTarget.dispatchEvent (xml-http-request-event-target.js:50) at XMLHttpRequest._setReadyState (xml-http-request.js:288) at XMLHttpRequest._onHttpResponseEnd (xml-http-request.js:459) at push../node_modules/stream-http/lib/response.js.exports.IncomingMessage. (xml-http-request.js:413) at push../node_modules/stream-http/lib/response.js.exports.IncomingMessage.emit (events.js:139) at endReadableNT (_stream_readable.js:1030) at afterTickTwo (index.js:31) at Item.push../node_modules/process/browser.js.Item.run (browser.js:167) at drainQueue (browser.js:131) ErrorResponse @ errors.js:29 (anonymous) @ index.js:125 request.onreadystatechange @ index.js:103 XMLHttpRequestEventTarget.dispatchEvent @ xml-http-request-event-target.js:50 XMLHttpRequest._setReadyState @ xml-http-request.js:288 XMLHttpRequest._onHttpResponseEnd @ xml-http-request.js:459 (anonymous) @ xml-http-request.js:413 emit @ events.js:139 endReadableNT @ _stream_readable.js:1030 afterTickTwo @ index.js:31 push../node_modules/process/browser.js.Item.run @ browser.js:167 drainQueue @ browser.js:131 setTimeout (async) _fireError @ index.js:72 sendTxCallback @ index.js:465 (anonymous) @ index.js:125 request.onreadystatechange @ index.js:103 XMLHttpRequestEventTarget.dispatchEvent @ xml-http-request-event-target.js:50 XMLHttpRequest._setReadyState @ xml-http-request.js:288 XMLHttpRequest._onHttpResponseEnd @ xml-http-request.js:459 (anonymous) @ xml-http-request.js:413 emit @ events.js:139 endReadableNT @ _stream_readable.js:1030 afterTickTwo @ index.js:31 push../node_modules/process/browser.js.Item.run @ browser.js:167 drainQueue @ browser.js:131 setTimeout (async) runTimeout @ browser.js:43 push../node_modules/process/browser.js.process.nextTick @ browser.js:156 nextTick @ index.js:30 maybeReadMore @ _stream_readable.js:521 addChunk @ _stream_readable.js:300 readableAddChunk @ _stream_readable.js:278 push../node_modules/readable-stream/lib/_stream_readable.js.Readable.push @ _stream_readable.js:242 (anonymous) @ response.js:47 write @ response.js:44

Edit: Changed the code to catch the errors

web3.eth.personal.unlockAccount(accountnumber,pass, 1500, function(err, result){
              if(err){
                alert("Error"+ err);
                return;}
              alert("Account Opening: "+ result);});

......

auth.methods.approve().send({gas: '1000000',from: accountnumber}, function(err, result){
      if(err){
        alert("Error"+ err);
        return;}
      alert("Account address: "+ result);
      console.log('Smart Contract approved ! ');});

The web3.eth.personal.unlockAccount is returning "true" but the still the auth.methods.approve is giving me the error.

0

So, after some major changes in the code, I am able to do the following with an onSubmit event in a react app.

  1. Create a new account.
  2. Transfer some gas to it.
  3. Open the account.
  4. Approving a smart contract with the account.

Here is the code

onSubmit = async (event)=>{
      event.preventDefault();
      console.log('Approving the smart contract ..... Mining in process ! ');

      var pass = "passsword1"

      var newaccount = web3.eth.personal.newAccount(pass);

      var promise1 = Promise.resolve(newaccount);


      promise1.then(function(value) {
        var accountnumber = value;
        console.log(accountnumber);
        web3.eth.personal.unlockAccount('0x197022acd263e8be0f6b65b10d1e5cdbaa244c17',"*****", 1500, function(err, result){
          if(err){
            alert("Error"+ err);
            return;
          }else {
          alert("Parent Opening: "+ result);
          web3.eth.sendTransaction({
          from: "0x197022acd263e8be0f6b65b10d1e5cdbaa244c17",
          to: accountnumber, 
          value: '100000000000000000', 
          }, function(err, transactionHash) {
          if (err) { 
              console.log(err); 
          } else {
            web3.eth.personal.unlockAccount(accountnumber,pass, 1500, function(err, result){
              if(err){
                alert("Error"+ err);
                return;
              }else{
                console.log(web3.eth.getBalance(accountnumber));
                alert("Child Opening: "+ result);
                auth.methods.approve().send({gas: '20000000',from: accountnumber}, function(err, result){
                if(err){
                  alert("Error"+ err);
                  return;
                }else{
                  console.log("Account address: "+ result);
                  console.log('Smart Contract approved ! ');

                }
                });
              }
            });
          }
          });
       }

      });
};

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.