[Ethereum] How to disconnect metamask wallet from a dapp using web3

metamaskreactweb3js

I tried connecting metamask wallet with web3.js, and it got succeeded.

const handleClick = async () => {
    try {
      // Get network provider and web3 instance.
      const web3 = await GetWeb3();
      // console.log(web3);

      // Use web3 to get the user's accounts.
      const accounts = await web3.eth.getAccounts();

      // Get the contract instance.
      const networkId = await web3.eth.net.getId();
      const deployedNetwork = smartContract.networks[networkId];
      const instance = new web3.eth.Contract(
        smartContract.abi,
        deployedNetwork && deployedNetwork.address
      );

      if (accounts) {
        dispatch({
          type: "WALLET_CONNECT",
          payload: {
            isWalletConnected: true,
            web3: web3,
            accounts: accounts,
            contract: instance,
          },
        });
      }

      console.log("connected");

      console.log(web3, accounts, instance);
    } catch (error) {
      alert(
        `Failed to load web3, accounts, or contract. Check console for details.`
      );
      console.log(error);
    }
  };

Now I would like to disconnect metamask wallet from the dapp, when the disconnect button is clicked, just like a logout button. Can anyone help me with this?

Best Answer

It's not possible.

Dapp's which have a "disconnect" button didn't actually disconnecting metamask. You are able to see that in Metamask interface still displays connected even after clicking logout.

Related Solutions

[Ethereum] Metamask accepting Promises/getting HTML to wait

The async/await patern works with JavaScript Promises.

In order to make web3.js functions asynchronous, you need to pass a callback parameter:

As this API is designed to work with a local RPC node, all its functions use synchronous HTTP requests by default.

If you want to make an asynchronous request, you can pass an optional callback as the last parameter to most functions. All callbacks are using an error first callback style:
web3.eth.getBlock(48, function(error, result){
    if(!error)
        console.log(JSON.stringify(result));
    else
        console.error(error);
})

If you want to then make this work with the async/await pattern, you will need to then wrap this asynchronous function into a promise, which is of the format:

new Promise( /* executor */ function(resolve, reject) { ... } );

Rather than do this over an over for each web3.js function, you can automate this process by creating a wrapper for javascript functions which includes the callback parameter and wraps it in a promise as so:

const promisify = (inner) =>
    new Promise((resolve, reject) =>
        inner((err, res) => {
            if (err) {
                reject(err);
            } else {
                resolve(res);
            }
        })
    );

This can then be used really simply with nearly all existing web3.js functions:

async function getBalance() {
    var address, wei, balance
    address = document.getElementById("address").value;
    wei = promisify(cb => web3.eth.getBalance(address, cb)) // simply wrap web3.js functions with the promisify function, also passing in a callback parameter
    try {
        balance = web3.fromWei(await wei, 'ether')
        document.getElementById("output").innerHTML = balance + " ETH";
    } catch (error) {
        document.getElementById("output").innerHTML = error;
    }
}

All of this information can be found on my blog where you can also find other small projects I have done which use this pattern.

[Ethereum] How to disconnect MetaMask wallet using Web3modal

It's not possible.

The connect/disconnect functionality is entirely in the user's hands due to security and privacy concerns.

You can only pretend a disconnect by resetting a provider, chainId and selectedAccount to null and clearing the cache of the provided you previously used.

P.S.: I know this is a harsh reality. Upvote this as it's the only correct answer that there is! You have to pretend from your app that the user has disconnected. This is the way I do it in my dapp, the way PancakeSwap does, Uniswap too, etc...

Related Topic

[Ethereum] How to disconnect a Metamask wallet from Uniswap