Vechain
Browser

Connect with Browser

Interacting with Blockchain-data is a big unknown at first but if you think about Blockchain-Nodes as your Backend-API, you'll feel how the complexity of decentralization is slowly fading.

On one end logic layers are published on the Blockchain with contracts. On the other end the data needs to be read and manipulated. Public nodes provide a public API that can be accessed either per Web.

This example shows how to read some information from a known contract and display that information.

Connect

Connex (opens in a new tab) is the standard interface to connect dApps with VeChain blockchain and users.

import Connex from "@vechain/connex";
 
const connex = new Connex({
  node: "https://mainnet.veblocks.net",
  network: "main"
});

For the TestNet use { node: "https://testnet.veblocks.net", network: "test" }

Interact

Prepare

For an interaction we need to know:

  1. The address of the contract we want to talk to (like an API or Hostname)
  2. The ABI documentation of the function we want to call

For this example the current supply of VTHO will be read, the address for that contract is:

0x0000000000000000000000000000456E65726779

I did look it up in the official docs:
https://docs.vechain.org/others/miscellaneous.html#energy-sol (opens in a new tab)

The ABI definition is available in the official docs as well: https://raw.githubusercontent.com/vechain/b32/master/ABIs/energy.json (opens in a new tab)

For this example only the single function totalSupply() is relevant, it is extracted from the list of all functions defined in the ABI:

const abiTotalSupply = abi.find(({ name }) => name === "totalSupply");

Execute

    const result = await connex.thor
      .account(CONTRACT_ADDRESS)
      .method(abiTotalSupply)
      .call();

result contains a lot of noise. The expected information is found in result.decoded:

{ 0: "52418836757574038600000000000" }

Repeating this on each new block will return the current VTHO supply on the whole network.

Arguments

The same functionality can be used with parameters. To get the balance of a single address:

const abiBalanceOf = abi.find(({ name }) => name === "totalSupply");
 
 const { decoded } = await connex.thor
      .account(CONTRACT_ADDRESS)
      .method(abiBalanceOf)
      .call("0x04Ad3f13050cc766169433062BcDbB367B616986");
 
console.log('VTHO Balance:', decoded[0])

call() will verify against the ABI and an error is thrown if data format or number of arguments don't match. Be sure to handle errors correctly.

Sandbox

You can play around with this in a working example here:

https://codesandbox.io/s/connect-to-vechain-nuvho8?file=/src/App.js (opens in a new tab)

Notes

There is an awesome list of ABI's with VeChain specific contracts:

https://github.com/vechain/b32/tree/master/ABIs (opens in a new tab)

If you happen to know more ABIs or Contract-Addresses, please feel free to share them in the comments.

Links

  1. Above Example Project (opens in a new tab)
  2. Connex Docs (opens in a new tab)
  3. B32 Collection of ABIs (opens in a new tab)