DEV Community

So Sun Park
So Sun Park

Posted on

web3 - metamask api study(1)

I'm trying to implement the feature that recognizes metamask wallet, and ultimately connects with the application so that the user can simply sign up or login with metamask login. Just like how opensea sign up / login works.

Image description

1. Original Code

I was following this code in the of MetaMask/detect-provider

Initially, I'm working on HTML/Javascript mode (not nodejs yet) to test simple functions first. And the repo README's sample HTML code was giving an error.

2. error

await is only valid in async functions and the top level bodies of modules 
Enter fullscreen mode Exit fullscreen mode

3. Solution

Fix - Await is only valid in async function Error in NodeJS

As it explained in the blog, the error occurred because it was using top level await without setting. It required to change type= module in package.json or script tag.

So the HTML code in the should be like below

<script src=""></script>
<script type="module">
  const provider = await detectEthereumProvider()

  if (provider) {
    // handle provider
  } else {
    // handle no provider
Enter fullscreen mode Exit fullscreen mode

Top comments (0)