Web3

This is a little tricky but at the end you will only use an ethereum wallet to login. This is how it works:

  1. First of all you request to the server a random code giving also a wallet address. This code will be associated to the provided wallet address.
  2. Then you sign that code using your wallet. Then the server verifies that signature and checks if match with the provided wallet.
  3. Once this verification is succesful generates a JWT.
sequenceDiagram participant C as Client participant S as Server C->>S: Please give me a random code and associate with this wallet 0x1234..5678 activate S S-->>C: Of course here you have 1234...7890 deactivate S activate C C->>S: Here you have my signature 0x12345...67890 deactivate C activate S S-->>C: All seems correct here you have a JWT deactivate S

Code example

Prerequisites

To make this you need a libary that allows you to interact with ethereum wallets. See:

​
// Using axios
// ES6 import
import axios from "axios";
// CommonJS
const axios = require("axios");

// Preparing body
const wallet_address = '0x4fA...5Yc';

(async () => {
    // Sending request to server
    const response = await axios.post('http://localhost:3000/auth/sign-code', {wallet_address});

    // Now lets sign the code
    const {code} = response.data;

    // Signing message
    const signature = await wallet.signMessage(code);
    
    // Sending signature to server
    const body = {
        web3: true,
        wallet_address,
        signature
    }
    const response = await axios.post('http://localhost:3000/auth/sign-in', body);
    const {access_token} = response.data;
})();

// Using axios
import axios from "axios";

// Preparing body
const wallet_address = '0x4fA...5Yc';

(async () => {
    // Sending request to server
    const response = await axios.post('http://localhost:3000/auth/sign-code', {wallet_address});

    // Now lets sign the code
    const {code} = response.data;

    // Signing message
    const signature = await wallet.signMessage(code);
    
    // Sending signature to server
    const body = {
        web3: true,
        wallet_address,
        signature
    }
    const response = await axios.post('http://localhost:3000/auth/sign-in', body);
    const {access_token} = response.data;
})();