11

How to check from client-side JavaScript whether MetaMask is installed?

7 Answers 7

6

The recommended way is to use window.ethereum:

window.addEventListener('load', function() {
  if (window.ethereum) {
    console.log('Ethereum support is available')
    if (window.ethereum.isMetaMask) {
      console.log('MetaMask is active')
    } else {
      console.log('MetaMask is not available')
    }
  } else {
    console.log('Ethereum support is not found')
  }
})
3
  • 1
    github link is dead
    – alper
    May 9, 2022 at 19:56
  • @alper fixed the link and updated code. Let me know if it works. Feb 7, 2023 at 10:33
  • 1
    it works, thanks
    – alper
    Feb 8, 2023 at 22:05
8

Not Metamask specifically, but the below checks if Web3 is being injected.

window.addEventListener('load', function() {

  // Check if Web3 has been injected by the browser (Mist/MetaMask).
  if (typeof web3 !== 'undefined') {
    // Use Mist/MetaMask's provider.
    web3js = new Web3(web3.currentProvider);
  } else {
    // Handle the case where the user doesn't have web3. Probably 
    // show them a message telling them to install Metamask in 
    // order to use the app.
  }

});
4

MetaMask's own onboarding library runs the test

window.ethereum && window.ethereum.isMetaMask

https://github.com/MetaMask/metamask-onboarding/blob/v1.0.1/src/index.ts#L169

Then create a Provider using new ethers.providers.Web3Provider(window.ethereum)

3
if (typeof window.ethereum !== 'undefined') {
  console.log('MetaMask is installed!');
}

Metamask documentation

1

I found this answer on the Metamask github page https://metamask.github.io/metamask-docs/Advanced_Concepts/Provider_API#ethereum.on(eventname%2C-callback)

if (typeof window.ethereum !== 'undefined'
|| (typeof window.web3 !== 'undefined')) {

  // Web3 browser user detected. You can now use the provider.
  const provider = window['ethereum'] || window.web3.currentProvider
}

Then you call window.ethereum.enable() to request user permission

3
  • broken link but good answer
    – staminna
    Feb 23, 2022 at 14:52
  • I think this is the correct link: docs.metamask.io/guide/…
    – MantasFam
    Mar 3, 2022 at 9:46
  • 1
    window['ethereum'] is not a provider. You have to create a provider from this: new ethers.providers.Web3Provider(window.ethereum) Jul 31, 2022 at 2:46
1

Just to throw a different solution into the mix, here's a way to check on an interval in case you're up against loading issues. In this example, that interval is every second, it checks 15 times and then gives up.

((context) => {
  const checksBeforeStopping = 15
  let checksMade = 0

  const interval = setInterval(() => {
    if (context?.ethereum?.isMetaMask) {
      console.log('MetaMask is installed')
      clearInterval(interval)
    } else console.log('Will check again in one second')
    
    if (++checksMade === checksBeforeStopping) {
      clearInterval(interval)
      console.log('Giving up on checking for MetaMask')
    }
  }, 1000)
})(window)
1

just 1 line: const isMetamask = ethereum.isMetaMask

it will return true or error.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

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