logo
From the MetaMask developer FAQ:
Using synchronous calls is both a technical limitation and a user experience issue. They block the user's interface. So using them is a bad practice, anyway. Think of this API restriction as a gift to your users.
Setting up a Web3 function to work asynchronously was pretty easy to figure out for a single call; but what about making multiple calls through Web3, that all need to be asynchronous, but also have dependencies on one another? An example would be calculating the ERC-20 token balance of an Ethereum address. To do this, you need to know both the balance of tokens at the address, but also the decimals value for that token to convert to the right units. JavaScript Promises are the natural solution here. They allow you to track the status of an asynchronous function, and perform actions after your multiple dependencies all resolve.
You can make an asynchronous requests by adding an error first callback to the Web3.js functions:
If we depend on multiple calls from the Ethereum blockchain to create a result, using JavaScript Promises is a good solution. They allow you to react to a success or a failure from an asynchronous function. Creating a promise from the error first callback function is pretty straightforward:
But we can actually make this process even simpler for multiple Web3 functions by creating a wrapper which both makes the function asynchronous, and turn it into a promise; basically automating what we would repeat above for each different Web3 function we call. Here is the wrapper from 0xcaff posted in StackExchange:
Now that we have a Promise, we can take advantage of the async/await pattern which simplifies not only the look, but also the behavior of Promises. Putting this all together, let's show how simple this makes getting the token balance for an ETH account. We convert our orginal "Hello World" getBalance into an ansychronous function, like so:
Not much shorter for a single function, but will certainly make things better the more separate functions we call. My next post will show the results of these smaller educational posts, and how we can put it together to create the project I have been hinting above: Getting the ERC-20 balance of an Ethereum Address. I hope this teaches you something! Again, this may be trivial to many, but was not so straightforward when I first started to tackling these problems. 
logo
Please note: This is a very early stage feature, and the exact implementation may be subject to change! Do not use this method for production applications that you’re not able to update should the API change in the future!
There are a wide array of ways that Ethereum plans to scale, and it’s a favorite topic of blockchain fans, because the scalability of the blockchain is a hard technical limit on how useful it can become.
One of the easiest ways you can start scaling your application on Ethereum today, without waiting for any other technology to be available, is to construct mechanisms that allow users to sign state changes that aren’t always submitted to the blockchain, but can be if needed, like a state channel. To make a working state channel today, there’s no easier option than to take advantage of MetaMask’s new signedDataType model
Originally proposed in EIP 712 by Leonid Logvinov of 0x, and then implemented for MetaMask by Sergey Ukustov of Machimony. This new method makes it easier than ever to create applications involving user signatures that:
    sent structured data.
    Are human readable.
    Cannot impersonate Ethereum transactions.
    Are cheap to compute on-chain.
In this article, you’ll learn to show the MetaMask user something like this:
The API is simple, and will be even simpler once it has been deployed in new versions of EthJS and Web3.js. In the meanwhile, using it exposes you to the lowest-level API that MetaMask gives you: The Ethereum Provider.
You can find this code live online on github here.
As you can see, in this we:
    Imported the signature recovery library eth-sig-util
    Assembled parameters for the method.
    Retrieved the current user’s address from the web3 API.
    Asked the user to sign those parameters.
    Using the parameters and the signature, we were able to verify this signature came from their address (and only their address!).
Not only can you verify this data with JavaScript, you can also verify it in Solidity. Here is an example of verifying one of these signatures in Solidity. This can be useful for writing code for closing a state channel.
I hope this has been useful to you, let us know if you have any questions, and if you create any sample examples you’d like to share!
logo
In this post I’m going to give a simple but hopefully effective demonstration of how a JavaScript developer would create a web page that is able to call a smart contract, and send money (Ether) to it, with a single click.
To do this, your users are going to need to be using a web3-enabled browser, so either an installable one like Parity or Mist, or they could use a browser extension like MetaMask.
Also, while I could teach you how to use the web3 API directly, instead I’m going to teach you how to use a new convenience library for talking to Ethereum smart contracts called EthJS.
Your website will need to wait for the ready event, and then check for a global web3 object. That looks like this:
Copied loosely from the MetaMask Developer Guide.
In this example, I’m going to assume you’re using a JavaScript bundler like Browserify or Webpack, and know how to install modules off NPM.
In your app setup, you’re going to use a few different ethjs modules, and you’ll initialize them with the global web3 object’s currentProvider property, which is how it talks to the blockchain anyway.
Once you’ve instantiated a contract instance, you can use it to create references to live contracts on the network. To do this, you need two things:
    The contract address.
    The contract ABI.
The ABI is the Application Binary Interface, and it tells your JavaScript contract how to talk to the smart contract. It’s just JSON data that describes the contract methods.
Usually if you published a contract, you know how to get the ABI, and if you’re connecting to someone else’s contract, they should make the ABI available, although sometimes you can find ABIs matched to contracts on block explorers like Etherscan.
Let’s assume you have your ABI and address available, and see how we’ll create a contract object now. In this example I’ll use an ABI that includes only the transfer(to, value) method from the Token standard:
Now we’ve initialized a JavaScript interface for a smart contract, so we just need to create a little HTML
And a little JavaScript to respond to the click, and send those funds:
Note if this transaction were to send ether also, you’d add value: '10000' to the options hash that includes the from field. The value is in the unit of wei, which is 1x10^-18 Ether. An easy way to convert is like this:
A strange part of this for a normal web developer is that the transaction response does not mean the transaction is now complete, it just means it’s been transmitted to the network. It still needs to be mined, and in Ethereum, that takes around 14 seconds on average (block time, view stats on EthStats.net).
Right now there aren’t great subscription methods for waiting for a transaction to be mined, so you’ll need to poll for it with that txHash you got back. Yes, it’s tedious, so I’ll show you how it can be a little less painful using the new JavaScript async/await pattern:
That’s it! (I know, it was a lot) I hope this was enough to show you how to interact with a smart contract over the Ethereum block chain. Once you’re used to it, it’s pretty great, because it’s a sort of global API that has permissions baked in, so while you have to do a couple funny things like wait for transactions to be mined, you don’t have to do obnoxious things like manage user accounts and passwords, or manage a backend server yourself!
Please add any questions you have here, we made MetaMask to enable the easy creation of web interfaces for smart contracts, so that’s really what we’re here for. Show us what you’ve got!
3 Articles

No articles found.

0

Article Requests for metamask