A way to view smart contract data without needing to connect wallet to dApp in ethersjs?

Question

I am building a crowd-funding dApp using ethersjs to connect my smart contract to my front end, and I am looking to display public variables like total campaigns on my index page for style purposes.

Right now, I am calling a public variable totalCampaigns to get the returned number of total campaigns. The issue is, is I have to connect my wallet to view the number. If I don't, then no number is displayed.

In ethersjs, is there a way I can view public variables with getter functions, like my totalCampaigns variable without needing someone to connect their wallet? Or is it supposed to be connected by design and I should just scrap the idea all together?

Answer 1

Yes, it is possible by creating a read-only contract instance.

First you need a provider, you can use a custom provider like Infura or Alchemy for example:

const provider = new ethers.providers.JsonRpcProvider("https://Url-of-your-provider");

To create a read-only contract instance, you need to instantiate a contract with aProvider instead of a Signer. Here is an example with an ERC20 token.

const tokenContract = new ethers.Contract(tokenAddress, erc20ABI, provider);

Then you can call any function of your contract.

  const balance = await tokenContract.balanceOf("0xabc...");
  console.log('Balance:', balance.toString());