How to Call An Ethereum Smart Contract Code From Javascript

Now that we have a contract on the blockchain, we can start using it. To do this, we're going to make a JavaScript object that acts as a proxy to our smart contract. Remember that our contract code doesn't describe its own API, so we need to use our ABI file. The process to get a handle of our contract instance feels a little odd coming from normal JavaScript. It looks like this. First, we'll parse our ABI into a JSON data structure. Second, we'll create a contract class using that ABI, and third, we'll instant iate that class using our address. It's probably easier just to show you in code. First, we're going to copy our ABI definition file we compiled earlier. Next, we'll go back to Geth and parse the string using JSON.parse. Take a look at the ABI. You can see that it's an object. Next, we're going to create essentially a JavaScript class for our contract. For our counter equals eth.contract passing the ABI. And finally, we need to tell our code where to find this particular instance of the counter contract on the blockchain. So to create an instance, we type var counter lowercase equals counter at the contract address. And looking at counter, we can see we have our address and our functions get an increment. Now we have a handle to our contract instance in JavaScript. And this means we can now interact with our contracts code like a JavaScript object. Sort of. Remember that all reads can be performed locally for free as long as they don't change any state. Let's try to use our read function get. Do you remember what return value should be? Great, it's one. We just read our first value from our first contract on the blockchain. Even though we just read a single number, it's worth noting that right now we have the pieces that we need to build JavaScript applications that read the contract. We'll talk about how to connect this to the browser using web three in a bit. But by making this connection between Solidity and JavaScript, we're now in somewhat familiar territory for a minute anyway. It gets more complicated when we want to update the state. Let's call our increment function now. Counter dot increment. Hmmm, error invalid address. Well, it might not be clear what that message means, but it's clear that we can 't use our state. Well, it might not be clear what that message means, but it's clear that what we were trying didn't work. And the primary reason is that you can't just call functions that change smart contract values locally. You have to submit a transaction that the rest of the network agrees is valid. So how do we do this? Here's another area where Solidity JavaScript API is not that intuitive. To send a transaction on a contract method, we call sendTransaction on that function. It looks like this. And you might need to unlock your account again. We'll call counter dot increment, but then on that increment function we'll call dot sendTransaction from ETH accounts zero. So here we're calling the sendTransaction function on the increment function. This API of calling functions on functions to change their behavior is something we'll see a few times when using JavaScript and Solidity. Our sendTransaction call returned the hash of our transaction and notice that the recipient is our contract address. And what will happen if we call counter dot get right now? You probably already know that we need to mine another block first, so let's do that. Mine are dot start, mine are dot stop, and now let's call counter dot get. Two, it works. We wrote our first change to our contract state in the blockchain. Now, if it didn't work or you want to dig in, you can use debug dot traceTrans action and pass the address of the mind transaction. You can also call eth dot getTransaction or eth dot getTransaction receipt. This might output quite a few logs, but you can just check for any errors for now. Of course, this is a simple contract with a simple application. The next thing we're going to do is bring the interface to this contract into our web browser.