WalletConnect – Web3 Provider Issue with TrustWallet (Multi-Coin Wallet)

blockchainbscwalletconnectweb3-providersweb3js

I am using walletconnect/web3-provider to try to connect to trustwallet ios APP. My config on walletconnect is listed below:

try {
    console.log("Log in with connect wallet")
    const provider = await new WalletConnectProvider({
        rpc: {
            56: "https://bsc-dataseed1.binance.org",
        },
    });
    // provider.networkId = 56;
    await provider.enable();
    const web3 = await new Web3(provider);
    console.log(web3)
    resolve(web3)
} catch {
    console.log("Install metamask or use wallet connect")
}

It is normally connected to the wallet, but it is not working right.
So I check the provider and find out that the chain ID is pointing to "1" instead of the BSC chainID "56". see below:

Am I doing anything not correct?

Best Answer

I found the solution on github repo, check below discussion: https://github.com/WalletConnect/walletconnect-monorepo/issues/522#issuecomment-860773569

Related Solutions

Web3.js – Building a Custom Web3 Provider

You are asking about very niche and complex problem, so one cannot expect ready made tutorials to be available.

I would suggest

Reverse engineering web3.js
Reverse engineering MetaMask
Reverse engineering Trust wallet
Reverse engineering web3.py (might be the most readable source code of all these)

web3js – How to Implement WalletConnect with Vanilla JavaScript

Yes - this is possible, but you need the full packaged suite of JS that it depends on. Unpkg makes this available, and you can use a Web3 wrapper so that it can be tidily manipulated in vanilla JS.

Try this:

<script src="https://cdnjs.cloudflare.com/ajax/libs/web3/3.0.0-rc.5/web3.min.js"></script>
<script src="https://unpkg.com/@walletconnect/web3-provider@1.7.1/dist/umd/index.min.js"></script>
//Make sure the above loads first (either stick it in the head, or manage your load sequence)...

<script>
//An infura ID, or custom ETH node is required for Ethereum, for Binance Smart Chain you can just use their public endpoint
var provider = new WalletConnectProvider.default(
  { 
    infuraId: "<<YOUR INFURA ID>>", 
    rpc: {56: "https://bsc-dataseed.binance.org/"}
  });
//to set it to BSC, uncomment the following line
//provider.chainId = 56;
//present the Wallet Connect QR code
provider.enable().then(function(res){ 
  //get wallet addrs and then wrap this into the Web3 JS
  let web3 = new Web3(provider);
  //now do all the web3 stuff you want...
  //awesome web3 application goes here
});

EDIT: I created some small helper files to deal with this, and to also include other wallets. You can find them here

Best Answer

Related Solutions

Web3.js – Building a Custom Web3 Provider

web3js – How to Implement WalletConnect with Vanilla JavaScript

Related Topic