How to request permissions on a MetaMask wallet using web3

In this tutorial, we are going to see how to get the granted permissions and request permissions on a MetaMask wallet using web3.

In this tutorial, we are going to see how to get the granted permissions and request permissions on a MetaMask wallet using web3.

The first step is to install the web3 dependency using the following command:

npm install web3

Then, to interact with a blockchain (Ethereum or BSC or any other) you need to create an instance of Web3 and give it a provider (like window.ethereum for browser wallets, for example).

After that, you need to connect to the user's wallet using any method you want. You can check out our guides if you want to learn how to connect to a wallet.

How does the permissions system work?

The permissions system is based on a set of methods that can be called using the user's wallet.

We have a first set of methods called "safe methods", that contain methods available on MetaMask that you can ask for permissions to use. For example under the safe methods we have the method "eth_getBalance".

There is also the method "eth_sendTransaction" that is considered safe because the user has to confirm the action before the method is executed and he has to approve your website first.

You can see the full list of safe methods in the MetaMask Github repository here:
MetaMask safe methods

We also have another set of methods called "restricted methods", that contain all the custom methods that you create and that should be approved by the user before adding them to the permissions.

We'll see how to add permissions later on this tutorial.

Get granted wallet permissions

// need a Web3 instance initialized with a provider like window.ethereum for browser wallets, in a variable called web3, to use this code stored
// also need a connected wallet using that instance

const permissions = await web3.currentProvider.request({
  method: 'wallet_getPermissions',
})

console.log(permissions)

This code will return an array containing all the permissions that your application has.

If the user connected his wallet to your website, the basic permissions list you will have looks like the following:

[{
    "@context": [
        "https://github.com/MetaMask/rpc-cap"
    ],
    "invoker": "https://your-website.com",
    "parentCapability": "eth_accounts",
    "id": "PERMISSION-ID",
    "date": DATE-PERMISSION-GRANTED,
    "caveats": [
        {
            "type": "limitResponseLength",
            "value": 1,
            "name": "primaryAccountOnly"
        },
        {
            "type": "filterResponse",
            "value": [
                "0xTHE-USER-ADDRESS"
            ],
            "name": "exposedAccounts"
        }
    ]
}]

Request wallet permissions

web3.currentProvider.request({
  method: 'wallet_requestPermissions',
  params: [
    {
      'eth_accounts': {
        requiredMethods: ['signTypedData_v4']
      }
    }
  ]
})
.then((permissions) => {
  const granted = permissions.find(
    (permission) => permission.parentCapability === 'eth_accounts'
  );
  if (granted) {
    // do something if user accepted
  }
})
.catch((error) => {
  if (error.code === 4001) {
    // do something if user denied
  }
})

This is how you request a permission to use a method from the safe methods list I shared previously.

If the user accepts, you can use the method he allowed you to use.

Thanks for reading this tutorial!