web3-flipbook/flipbook/templates/includes/scripts.html

<script src="/static/js/main.js"></script>

{% with messages = get_flashed_messages() %}
  {% if messages %}
    {% for message in messages %}
      <p>{{ message }}</p>
    {% endfor %}
  {% endif %}
{% endwith %}

<!-- <script src="/static/js/vendor/metamask-onboarding-1.0.1.bundle.js"></script> -->
<script>
  window.addEventListener('DOMContentLoaded', () => {
    const connectButton = document.getElementById('connectWallet');
    let nonce = 0;

    async function getSignedData(publicAddress, jsonData) {
      const signedData = await window.ethereum.request({
        method: 'eth_signTypedData_v3',
        params: [publicAddress, JSON.stringify(jsonData)]
      });
      console.log(signedData);
      return signedData
    }

    async function connectWallet() {        
        let userExists;
        const allAccounts = await window.ethereum.request({
          method: 'eth_requestAccounts',
        });
        await fetch('/api/v1/user_exists/' + allAccounts[0])
          .then((resp) => resp.json())
          .then(function(data) {
              if (!data['success']) {
                console.log('error checking user_exists!')
                return
              }
              console.log(data);
              nonce = data['nonce'];
          })

        const msg = 'Authentication request from Flipbook app! Verifying message with nonce ' + nonce
        const signedData = await window.ethereum.request({
          method: 'personal_sign',
          params: [msg, allAccounts[0]]
        });
        console.log('Signing data with msg (' + msg + '), address (' + allAccounts[0] + '), and nonce (' + nonce + ')')
        console.log(signedData);

        await fetch('{{ url_for("api.authenticate_metamask"	) }}', {
          method: 'POST',
          headers: {
            'Content-Type': 'application/json;charset=utf-8'
          },
          body: JSON.stringify({
            'signed_data': signedData,
            'public_address': allAccounts[0],
            'nonce': nonce,
            'message': msg,
          })
        })
          .then((resp) => resp.json())
          .then(function(data) {
              console.log(data)
              if (data['success']) {
                window.location.href = '/'
              }
          })
    };
    
    if (connectButton) connectButton.onclick = async () => connectWallet();
  });
</script>