getting metamask wallet intels the simplest way

The simplest way to gather informations about the wallet address, balance and the network used from Metmask in Javascript and HTML.

the HTML source code

<html
  <head>
    <title>Ethereum Wallet</title>
  </head>
  <body>
    <h1 id="address">The Wallet</h1>
    <h1 id="network">The Network</h1>
    <h1 id="balance">The Balance</h1>
    <script src="./script.js">
    </script>
  </body>
</html>>        

and the javascript source code:

const Web3 = require("Web3")


async function connect() {
  if (typeof window.ethereum !== "undefined") {
    try {
      const web3 = new Web3(Web3.givenProvider);
      const accounts = await ethereum.request({method: "eth_requestAccounts"});
      // get account
      const address = accounts[0];
      // get network (simple / straightforward / hacky)
      const _network = window.ethereum.networkVersion;
      const network = _network === "1" ? "mainnet" : _network === "5" ? "goerli" : _network === "11155111" ? "sepolia" : "undefined"
      // get balance
      web3.eth.getBalance(address, (error, balance) => {
        if (error) { console.error(error);} 
        else {
          // display the balance in ETH
          document.getElementById("balance").innerHTML = `Balance: ${(balance/10**18)} ETH`;
          // display the wallet address
          document.getElementById("address").innerHTML = `Address: ${address}`;
          // display the network
          document.getElementById("network").innerHTML = `Network: ${network}`;
        }
      });
    } catch (error) {
      console.log(error);
    }
  }
}


connect();


;        

PS: using Browserify package can resolve the "require" problem you could face when running this code.

To view or add a comment, sign in

More articles by Jalel TOUNSI

Insights from the community

Others also viewed

Explore topics