To use the blockchain, all you need is to install a mobile application browser. It is important to acknowledge that most of such popular distributed app browsers are known to be Metamask. To work and install the Metamask Login account on the Chrome browser there are a few sets of instructions that you need to follow in order if you are a beginner. With this article, you will get the instructions to use the Metamask Login account. So, let us get started!
Online users are becoming increasingly resistant to traditional email/password registration processes. One-click social login functionality via Facebook, Google, or GitHub turns out to be a much more desirable alternative. However, it comes with a trade-off.
Pros of social media login integration:
- No more cumbersome form-filling.
- No need to remember yet another username/password pair.
- The whole process takes seconds instead of minutes.
Cons of social media login integration:
- Since the user’s information is loaded from external providers, this raises a huge privacy concern on how providers use all this personal data. For example, at the time of writing, Facebook is facing data privacy issues.
This article introduces a new login method to blockchain development: A one-click, cryptographically-secure login flow using the MetaMask extension, with all data stored on our own back end. We call it: “MetaMask Login”.
How to Use Metamask for a One-Click Login Flow
The basic idea is that it’s cryptographically easy to prove the ownership of an account by signing a piece of data using a private key. If you manage to sign a precise piece of data generated by our back end, then the back end will consider you the owner of that public address. Therefore, we can build a message-signing-based authentication mechanism with a user’s public address as their identifier.
Please note that while we will be using tools connected to the Ethereum blockchain (MetaMask, Ethereum public addresses), this login process does not actually need the blockchain: It only needs its cryptography functions. That being said, with MetaMask becoming such a popular extension, now seems a good time to introduce this login flow.
The MetaMask Browser Extension
If you already know what MetaMask is, feel free to skip this section.
MetaMask is a browser plugin, available as the MetaMask Chrome extension or Firefox Add-on. At its core, it serves as an Ethereum wallet: By installing it, you will get access to a unique Ethereum public address, with which you can start sending and receiving ether or tokens.
But MetaMask Login does something more than an Ethereum wallet. As a browser extension, it can interact with the current webpage you’re browsing. It does so by injecting a JavaScript library called web3.js in every webpage you visit. Once injected, a web3
object will be available via window.web3
in the JavaScript code of this website. To have a look at what this object looks like, just typewindow.web3
in the Chrome or Firefox DevTools console, if you have MetaMask installed.
Web3.js is a JavaScript interface to the Ethereum blockchain. There are functions to:
- Get the latest block of the chain (
web3.eth.getBlockNumber
) - Check the current active account on MetaMask (
web3.eth.coinbase
) - Get the balance of any account (
web3.eth.getBalance
) - Send transactions (
web3.eth.sendTransaction
) - Sign messages with the private key of the current account (
web3.personal.sign
)
When MetaMask is installed, any front-end code can get access to all these functions, and interact with the blockchain. They are called dapps or DApps (for decentralized apps–sometimes even styled “ĐApps”).
Most functions in web3.js are read functions (get block, get balance, etc.), andweb3
will give the response immediately. However, some functions (likeweb3.eth.sendTransaction
and web3.personal.sign
) need the current account to sign some data with its private key. These functions trigger MetaMask to show a confirmation screen, to double-check that the user knows what she or he is signing.
Let’s see how to use MetaMask for this. To make a simple test, paste the following line in the DevTools console: https://community.metamask.io/
This command means: Sign my message, converted from utf8 to hex, with the coinbase account (i.e. current account), and as a callback, print the signature. A MetaMask popup will appear, and if you sign it, the signed message will be printed.