web3.js import contract abi from .json file

Question

So I have a deployed contract with address0. I can easily interact with it using my index.html like so:

import contract_artifacts from '../../build/contracts/contract.json'
var contract0 = contract(contract_artifacts);

Then I can call it's functions like so:

contract0.deployed().then(function(something){});

But I also have another previously deployed contract with address1. The contract is the same as the contract with the address0. I see only one way to work with the contract1:

var abiarray = [ here goes pretty big abi ];
contract1 = web3.eth.contract(abiarray).at(address1);

Is there another way to do it without including the whole abi of the contract? Because I already have it in contract_artifacts, I just don't know how to get it from there. Thank you.

MAD · Answer 1 · 2020-01-23T15:36:52.347

I know the question is old, but I had some problems with this so I will share what helped me.

To import the ABI from a JSON file, you can use the following code (assuming you already have your web3 Object):

var fs = require('fs');
var jsonFile = "pathToYourJSONFile/project.json";
var parsed= JSON.parse(fs.readFileSync(jsonFile));
var abi = parsed.abi;

var YourContract= new web3.eth.Contract(abi, 0x12345678912345678912345678912345678912);

You can read more about it here: https://web3js.readthedocs.io/en/1.0/web3-eth-contract.html

Update 01/2020: Since Typescript 2.9, reading JSON Files is supported directly. So if you try to get the ABI or Bytecode from within a Typescript Project (Angular, React, ...) simply go to your tsconfig.json and set:

{
  "compilerOptions": {
    "resolveJsonModule": true,
    "esModuleInterop": true  
  }
}

You can then use import ContractName from 'path/to/contract/ContractName.json' to import your Contracts and get the Abi with ContractName.abi.

Cheers

I'm surprised this is one of the only few answers to this problem online.... most of the articles I read is asking you to type the ABI manually in js, which is really messy. — Richard Fu, Jul 19 '18 at 07:10
I'm getting an error: Error: Cannot find module '../../node_modules/file-system' - even though I absolutely have file system installed - both globally and locally in my project's folder... Strangely the error says its on line 210 of web3.min.js - which I wouldn't think is related to any of this. Thoughts? — Mark55, Feb 19 '19 at 15:59

score 7 · Answer 2 · answered May 10 '20 at 15:42

7

I used the require function to import the JSON file.

import Web3 from 'web3';
const web3 = new Web3(window.web3.currentProvider);
const { abi } = require('./smart_contract_after_compilation_step.json');
var smart_contract_interface = new web3.eth.Contract(abi, '0x5E54780072f1998FB85c3203D9697ef9E3F82DF0')

answered May 10 '20 at 15:42

Rahul Soshte

174
1
6

Using "require" function from where? – Magno C May 20 '21 at 21:10
In NodeJS/ExpressJS – Rahul Soshte May 22 '21 at 18:33
This is the only solution shown here that solves my problem. Thanks! – James Jun 29 '21 at 23:33

score 3 · Answer 3 · edited Jul 03 '21 at 06:19

In the frontend i just do this:

import MyContract fom './contracts/MyContract.json'; //truffle project dir
web3 = new Web3(Web3.givenProvider);
const myContractWeb3 = new web3.eth.contract(MyContract.abi, "0x00");
// and then call the function that I want to

const functionThatIWantToUseFromSmartContract = async () =>{

    const account = await window.ethereum.enable();
    const accounts = account[0];
    const gas = await 
    myContractWeb3.methods.theFunction(args).estimateGas();
    await myContractWeb3.methods.theFunction(args).send();
}

score 0 · Answer 4 · answered Jan 22 '22 at 19:55

Reading JSON Files is supported directly. In my Nodejs Express App I loaded the contract:

// Load Contract
var fs = require('fs');
var jsonFile = "abis/abi.json";
var abi = JSON.parse(fs.readFileSync(jsonFile));
// Contract
var contract = new web3.eth.Contract(abi, "0x068_your_address");

web3.js import contract abi from .json file

4 Answers4