Through the Web3Js web page code, the user sending operation is completed with the assistance of MetaMask

The above html obtains the currently connected blockchain information and account information through web3JS. In the html, it obtains the local virtual blockchain information and the ETH of the account through Web3.0.js through the public key.

Then our previous article Web3 demonstrated the management operation of the ganache virtual environment account through MetaMask, and demonstrated the local sending of ETH to other accounts through MetaMask, so now we use the web page to implement it once.

The document describes that the sendTransaction
insert image description here
document has a relatively clear and visible case.

In order to facilitate the test, we should first set up the ganache environment and then
import two accounts through MetaMask to manage.

Then we operate account 2 here and send account 3.

Here we need to execute a function first.
There is a requestAccounts in the document
insert image description here
to authorize MetaMask,
we directly write the code as follows

var web3 = new Web3(Web3.givenProvider || "http://localhost:8545");
web3.eth.requestAccounts()

insert image description here
After running the webpage, MetaMask will automatically pop up to let me choose the authorized account.
Here we choose the account 2 and account 3 that we just imported, then click the next step

and directly click on the connection

. Wait for him to connect.

Let's assign the public key address of account 3
insert image description here
and then switch back to account 2

We write the code directly in the web page as follows

var web3 = new Web3(Web3.givenProvider || "http://localhost:8545");

web3.eth.getAccounts().then(function(accounts) {
    
    
  var from = accounts[0];
  web3.eth.sendTransaction({
    
    
    from: from,
    to: '0x0d9F9DA0c4c83a69d7F2317971Ce3395134a92f9',
    value: web3.utils.toWei("1", 'ether'),
    chainId: 1337
  }).then(res => {
    
    
    console.log("转发完成");
  }).catch(err => {
    
    
    console.error(err);
  });
});

insert image description here
What we mean here is that
getAccounts obtains the list of logged-in accounts and then obtains the first subscript to be used as the from parameter to put the public key of account 3 just copied and then send unit 1. Use web3.utils.toWei to convert to ether to avoid unit Error
Then chainId writes the current chain id to avoid errors

When we run the code, the operation corresponding to it will pop up, we just click confirm, insert image description here
and then we operate back and forth a few times, and when we look back at the user information, it changes

Through the Web3Js web page code, the user sending operation is completed with the assistance of MetaMask

Guess you like