设置WalletConnect

Question

我想在我的站点上实现WalletConnect，这样我正在努力改进的平台(房地产令牌化)的用户可以连接他们的MetaMask钱包(最终还有其他人？)到站点，这样我们就可以用person拥有的令牌(ERC20)来显示一个投资组合。

你知道怎么安排这个吗？我很难找到关于这个问题的任何文件。

谢谢

Answer 1

下面是示例代码，演示在walletConnect的web3Modal库中使用Etherjs，该库提供多个钱包选项，允许用户使用自己选择的钱包连接到dApp。

import { ethers } from "ethers";
import Web3Modal from "web3modal";
import WalletConnectProvider from "@walletconnect/web3-provider";

    //defining supported provider
     const providerOptions = {
        injected: {
          display: {
            name: "MetaMask",
            description: "Connect with the metamask from your Browser",
          },
          package: null,
        },
        walletconnect: {
          display: {
            name: "WalletConnect",
            description: "Scan qrcode with your mobile wallet",
          },
          package: WalletConnectProvider,
          options: {
            rpc: {
              [CHAIN_ID]: RPC_URL,
            },
          },
        },
      };
        //creating web3 modal instance
        const web3Modal = new Web3Modal({
              cacheProvider: false, // optional
              providerOptions, // required
              });
        
        //invoking wallet modal 
        let instance = await web3Modal.connect();
        
        //creating etherjs instance from wallet connect
        let injectedInstance = new ethers.providers.Web3Provider(instance);
        
        //creating a signer
        const signer = provider.getSigner();
        
        //creating contract instance and invoking contract function
        const contractInstance = new ethers.Contract(
                  CONTRACT_ADDRESS,
                  CONTRACT_ABI,
                  signer
                );
        let transactionHash = await contractInstance.functionName(param1,{value:gweiAmount});