I'm using Ethers.js to allow users to connect their Metamask wallets to my app. Here's the code that I have:

import { ethers } from "ethers"

async function connect() {
    const provider = new ethers.providers.Web3Provider(window.ethereum, "any")
    await provider.send("eth_requestAccounts", [])

    const signer = provider.getSigner()

    const address = await signer.getAddress()

    // Always prints the address that I first connected with
    console.log(address)
}

The issue is that once I have connected one of my Metamask accounts, then I always get its wallet address even if I switch to another Metamask account and try to connect it as well.

Why is that and how should I fix this?

I'm using Ethers.js to allow users to connect their Metamask wallets to my app. Here's the code that I have:

import { ethers } from "ethers"

async function connect() {
    const provider = new ethers.providers.Web3Provider(window.ethereum, "any")
    await provider.send("eth_requestAccounts", [])

    const signer = provider.getSigner()

    const address = await signer.getAddress()

    // Always prints the address that I first connected with
    console.log(address)
}

The issue is that once I have connected one of my Metamask accounts, then I always get its wallet address even if I switch to another Metamask account and try to connect it as well.

Why is that and how should I fix this?

• javascript
• ethereum
• web3js
• metamask
• ethers.js

3 Answers 3

Correct answer:

To get the current account, get the 0 address of eth_requestAccounts:

let accounts = await provider.send("eth_requestAccounts", []);
let account = accounts[0];

To update it automatically, listen to the accountsChanged event:

provider.on('accountsChanged', function (accounts) {
    account = accounts[0];
});

Code:

import { ethers } from "ethers"

async function connect() {
    const provider = new ethers.providers.Web3Provider(window.ethereum, "any");
    let accounts = await provider.send("eth_requestAccounts", []);
    let account = accounts[0];
    provider.on('accountsChanged', function (accounts) {
        account = accounts[0];
        console.log(address); // Print new address
    });

    const signer = provider.getSigner();

    const address = await signer.getAddress();

    console.log(address);
}

Old (incorrect) answer:

I believe that the issue is that you need to re-instantiate both the signer and the provider when the account is switched.

In addition, if I read the docs correctly, it's better practice to instantiate the signer after eth_requestAccounts is successfully called.

I think the issue is, if your app is on localhost:3000 and your app is connected to the metamask, that connection request somehow cached and always gets the same address.

If you shut down the app, start the app at localhost:3001, connect to the metamask manually (meaning that on your app window, click on extension and you will see connect button and manually connect) you will get the newly connected address

Well After a lot of wastage of time I understood that this only happens when you are using provider But if you want to get the the address that you have changed in the metamask and the one that you are using to call a function of smart contract at that moment.

Then you gotta use Signer instead of Provider. I don't know what's the story behind it but this is the solution maybe they kind of store some data when you use provider as its going to be only read only. But with the signer it always reflect the correct address. Hope that helps to someone and save some time :)

Let me know if someone knows the exact reason behind this?