Authenticating a user via MetaMask (like Cryptokitties)? [duplicate]

Question

I'm trying to understand how a user could be authenticated (like a sign in) using MetaMask, similar to how Cryptokitties makes you sign up/login?

From what I understand, we need to have the user sign a message to authenticate the ownership of the private key that generates a user's address. So If I have a web3 instance in my .js file, how can I prompt the user with a metamask login kinda like Cryptokitties?

I have this in my javascript file:

// Is there is an injected web3 instance?
if (typeof web3 !== 'undefined') {
  App.web3Provider = web3.currentProvider;
  web3 = new Web3(web3.currentProvider);
} else {
  // If no injected web3 instance is detected, fallback to Ganache.
  App.web3Provider = new web3.providers.HttpProvider('http://127.0.0.1:7545');
  web3 = new Web3(App.web3Provider);
}

Answer 1

This involves getting client-side signatures of messages, and verifying them server-side.

You can see a recent MetaMask blog post on one of our latest signing methods here:

https://medium.com/metamask/scaling-web3-with-signtypeddata-91d6efc8b290

Answer 2

Web3 Auth is a great project that I think will help not only your understanding of how to sign messages, but also show you best practices for storing the authentication keys in the clients browser.