To develope a decentralised application metamask wallet plays an important role as a wallet provider
Recently, metamask has pulled out the web3 library, you might have witnessed an error in the console that 'metamask no longer injects web3'.
here in this post I will be sharing some workful hacks with metamask extension
source : metamask.io
Detect ethereum in browser first:
You can directly do this with if(window.ethereum){} in js. this will automatically trigger the connection request with metamask
to get the account address you can use :
const accounts = await ethereum.request({ method: 'eth_requestAccounts' });
this will return the current connected and selected account in the metamask.
this will check if the account is changed in the metamask or not ->
ethereum.on('accountsChanged', function (accounts) {
// Time to reload your interface with accounts[0]!
});
! But there is a catch here ;)
the API will work only for connected accounts. e.g. suppose there is a web DApp which need a metamask wallet connection. then you will either get a connection request from their DApp or you can manually connect the accounts to DApp
Now if two accounts are connected and you switch between these accounts the above API (onaccountschanged) will work, but if the account is not connected with the DApp it will not detect the changed account, get it ?
Another problem is that when two accounts are connected with the DApp, you won't get both accounts address in an array as they say in their docs; this is what they say -
If the first account in the returned array isn't the account you expected, you should notify the user! In the future, the accounts array may contain more than one account. However, the first account in the array will continue to be considered as the user's "selected" account.
So I decided to request for account connection every time user visits the DApp regardless the user's accounts are connected previously. This gives complete choice of connecting accounts to user. This can be done by the following API -
I have declared one boolean variable for connection and then with the help of this i get the account address ---
await ethereum.request({
method: 'wallet_requestPermissions',
params: [{ eth_accounts: {} }],
}).then((permissions) => {
const accountsPermission = permissions.find(
(permission) => permission.parentCapability === 'eth_accounts')
if (accountsPermission) {
console.log('eth_accounts permission successfully requested!');
connected = true;
}
}).catch((error) => {
if (error.code === 4001) {
// EIP-1193 userRejectedRequest error
console.log('Permissions needed to continue.');
connected = false;
return false;
} else {console.error(error);}
});
and then as connected sets to true we can request user accounts now :
if (connected) {
await ethereum.request({
method: 'eth_accounts',
}).then(async (result) => {
CURRENT_ETH_ADDRESS = result[0];
console.log(CURRENT_ETH_ADDRESS);
});
} else { return false; }
Hope it will solve the problem , if you have any better idea than this do comment it below.