Connect Directly to the ME EVM Provider

Detecting the Provider

If you've built a custom wallet connection solution and want to add support for the Magic Eden Wallet, you can directly access the EVM Provider at magicEden.ethereum in the Window.

A code snippet to find the provider might look like the following:

const getProvider = () => {
  // check if the magicEden object is available
  if ('magicEden' in window) {
    const magicProvider = window.magicEden?.ethereum;
    if (magicProvider?.isMagicEden) {
      return magicProvider;
    }
  }
  window.location.href = 'https://wallet.magiceden.io/'
};

The above will return the provider if the user has the extension installed, otherwise it'll redirect the user to the magic eden wallet website to download it.

Note:

An actual production implementation to detect the provider might want to make use of timeout + some sort of loop to give the provider object time to inject in the window.

Connecting

Once the magicEden provider object has been found, a user is able to connect their wallet to the site. The connection request will prompt the user to approve the connection, so that their wallet can be used to make requests, such as sending transactions and signing messages.

The default way to prompt a connection with a user's ME wallet is with the window.ethereum.request function and passing in the eth_requestAccounts method.

const connect = async () => {
  if (!provider) return;
  try {
    const accounts = await provider.request({ method: "eth_requestAccounts" });
    console.log(accounts[0]);
    // 0x6aDdF38602487b7a159D926bc08151eBaEEF2B70
    
    // do some logic here to update your app context with the connected account	
  } catch (err) {
      console.error(err);
  }
};

The eth_requestAccounts method will return a Promise that resolves into an array where the connected address is at the 0th index.

Last updated